Nedávno se nás jeden z našich čtenářů zeptal, jak změnit boční stranu motivu WordPress?
Tuto otázku obvykle dostáváme od uživatelů, kteří chtějí změnit umístění svého postranního panelu zleva doprava nebo zprava doleva.
V tomto tutoriálu vám ukážeme, jak změnit umístění postranního panelu na WordPress.
Ale dříve, pokud jste nikdy nenainstalovali WordPress objevit Jak nainstalovat 7 kroků WordPress blogu et Jak najít, nainstalovat a aktivovat WordPress téma na svém blogu
Pak zpět k tomu, proč jsme tady.
Proč změnit umístění postranního panelu na WordPressu?
Odborníci na použitelnost věří, že lidé skenují stránky zleva doprava. Doporučují umístit důležitý obsah nalevo, aby uživatelé tento obsah viděli jako první. To by však mohlo být obráceno, pokud je váš web v jazyce RTL (vpravo vlevo).
Zjistit, jestli měl by váš blog WordPress obsahovat postranní panely
Mnoho webů WordPress používá typické rozložení blogu se dvěma sloupci. Jeden pro obsah a druhý pro postranní panel.
Pokud jste na webových stránkách nováčkem, měli byste vybrat téma WordPress, které má postranní panel ve vašem preferovaném umístění.
Mnoho Témata WordPress nabízejí možnosti změny strany postranního panelu v nastavení postranního panelu. Pokud však vaše téma WordPress tuto možnost nemá, budete muset ručně změnit stranu postranního panelu. Jděte dále objevováním jak odstranit postranní panel na WordPress
To znamená, pojďme se podívat na metodu, kterou potřebujete použít k snadné změně postranního panelu WordPress pomocí CSS.
Změna postranního panelu pomocí CSS
Než provedete jakékoli změny v tématu WordPress, měli byste nejprve zvážit vytvoření podřízeného motivu, Pomocí podřízeného motivu budete moci aktualizovat nadřazené téma, aniž byste ztratili změny.
Discover Jak zobrazit různé postranní panel pro každou položku na WordPress
Zadruhé byste měli vždy vytvořit zálohu svého webu WordPress, když provedete změny v aktivním motivu v reálném čase.
K úpravě souborů motivů WordPress budete potřebovat klienta FTP. Poraďte se s návod, jak používat FTP.
Přihlaste se na svůj web WordPress pomocí FTP klienta a přejděte do složky motivů. Obvykle se nachází na:
/ Yoursite / wp-content / themes / vaše-theme-složky /
Nyní musíte stáhnout a otevřít hlavní soubor stylů vašeho motivu WordPress v textovém editoru, jako je Poznámkový blok. Tento soubor se nazývá style.css, a je v kořenovém adresáři motivu WordPress.
Discover jak spravovat soubory a složky WordPress
V tomto souboru najděte třídu CSS na vašem postranním panelu. Obecně je tato třída „ sidebar “. V tomto příkladu používáme výchozí téma WordPress “ dvacet patnáct Kdo má tuto třídu pro postranní panel:
.sidebar {float: left; pravý okraj: -100%; max-width: 413px; poloha: relativní; šířka: 29.4118%; }
Jak vidíte, postranní panel se vznáší vlevo s rozpětím -100%. Změníme float doprava:
.sidebar {float: right; levý okraj: -100%; max-width: 413px; poloha: relativní; šířka: 29.4118%; }
Uložte změny a nahrajte soubor style.css na svůj web pomocí FTP klienta. Pokud nyní navštívíte svůj web, bude to vypadat takto:
Opravdu jsme přesunuli postranní panel, ale neposunuli jsme oblast obsahu. " dvacet Patnáct Tento CSS používá k definování pozice oblasti obsahu.
.site-content {display: block; float: left; levý okraj: 29.4118%; šířka: 70.5882%; }
Změníme jej tak, aby se obsah přesunul doprava. Takto:
.site-content {display: block; float: left; pravý okraj: 29.4118%; šířka: 70.5882%; }
Takto bude váš web vypadat po použití tohoto kódu CSS.
Jak vidíte, změnili jsme umístění oblasti obsahu a postranního panelu. Na levé straně je však stále bílý blok.
Jděte dále objevováním jak spravovat soubory a složky WordPress
Při práci s CSS se často setkáte s těmito chybami. Bude potřeba nějaké detektivní práce, abychom pochopili, co to způsobuje a jak to opravit.
Pomocí nástroje „Inspektor“ svého prohlížeče se podívejte na zdrojový kód. Namiřte myš na postiženou oblast v prohlížeči, klikněte pravým tlačítkem myši a v nabídce prohlížeče vyberte možnost „Inspektor“.
Když pohybujete myší po zobrazení zdrojového kódu, všimnete si oblastí, které ovlivňuje, zvýrazněné v živém náhledu. V pravém podokně uvidíte CSS použitý pro vybraný prvek.
Objevte naše 5 WordPress pluginy pro vizuální úpravu CSS na vašem blogu
CSS odpovídající zvýrazněné položce je tedy třeba znovu upravit.
@media screen a (min-width: 59.6875em) {body: before {background-color: #fff; stín pole: 0 0 1px rgba (0, 0, 0, 0.15); content: ""; displej: blok; výška: 100%; min-výška: 100%; poloha: pevná; nahoru: 0; vlevo: 0; šířka: 29.4118%; z-index: 0; / * Opravuje blikající chybu pomocí posouvání na Safari * /}
Tento kód CSS přidává prázdný levý blok 29,4118% šířky a šířky 100% vlevo nahoře. Zde je návod, jak to posuneme doprava.
@media screen a (min-width: 59.6875em) {body: before {background-color: #fff; stín pole: 0 0 1px rgba (0, 0, 0, 0.15); content: ""; displej: blok; výška: 100%; min-výška: 100%; poloha: pevná; nahoru: 0; vpravo: 0; šířka: 29.4118%; z-index: 0; / * Opravuje blikající chybu pomocí posouvání na Safari * /}
Po uložení a nahrání šablony stylů na server bude takto vypadat váš web.
Práce s CSS může být matoucí pro začátečníky. Pokud nechcete dělat všechny manuální práce, pak můžete vyzkoušet Doplněk WordPress CSS Hero. Umožňuje vám upravovat CSS bez psaní kódu a funguje s každým tématem WordPress.
Objevte také některé prémiové doplňky WordPress
Můžete použít jiné WordPress pluginy poskytnout moderní vzhled a optimalizovat práci s vaším blogem nebo webem.
Nabízíme vám zde prémiové doplňky WordPress, které vám to pomohou.
1. Zxeion
Zxeion je mocný WordPress Plugin prémie odpovědné za zlepšení zabezpečení vašeho webu. Tento plugin obsahuje kolekci ochranných a bezpečnostních nástrojů, které ochrání váš web před možnými útoky.
Jeho systém ochrany v reálném čase vám pomůže identifikovat hrozby pro váš web a blokovat je, aniž byste museli dělat cokoli.
Objevte také naše 7 pluginů pro posílení vašich postranních panelů na WordPress
Mezi jeho vlastnosti patří: ochrana v reálném čase, vynikající zákaznická podpora, pravidelné aktualizace, blokování IP adres, vynikající dokumentace, moderní a profesionální rozhraní, specializovaná zákaznická podpora a další.
Stáhnout | Demo | Web hosting
2. Slaido
Slaido je a WordPress Plugin premium, která vám umožňuje vybrat si z téměř 320 responzivních šablon posuvníků a importovat jednu z nich na váš web pomocí několika kliknutí. Je to kompletní sada šablon, ideální pro Posuvník Revolution. Chcete-li jej plně využívat, budete jej muset nejprve nainstalovat WordPress Plugin
Jeho hlavní rysy jsou: responzivní rozložení jeho posuvníků, snadnost importu nebo exportu posuvníků, pravidelné aktualizace, zákaznická podpora k dispozici 24/7, plynulé a velmi skvělé animace, dostupnost videonávody pro rychlý start, podpora pro písma Google a mnoho dalších.
Stáhnout | Demo | Web hosting
3. Kontaktujte nás
Contact Us Form je prémiový responzivní WordPress plugin a jednoduchý nástroj, ale bohatý na možnosti přizpůsobení, který vám umožní zobrazit jasný a povzbudivý formulář, ve kterém vás mohou návštěvníci kontaktovat zanecháním jejich zprávy.
Budete moci definovat potřebná pole, vybrat nejlepší rozložení polí a úplně je přizpůsobit, abyste povzbudili své zákazníky nebo návštěvníky, aby zanechali své návrhy nebo zprávy.
Zveme vás také ke čtení: Zásuvné moduly 10 WordPress pro vytváření a správu webových stránek restaurace
Stačí nastavit e-mailovou adresu, na kterou chcete přijímat zprávy, a použít ji k růstu vašeho podnikání nejziskovějším směrem.
Stáhnout | Demo | Web hosting
Doporučené zdroje
Zjistěte další doporučené zdroje, které vám pomohou vytvořit a spravovat váš web.
- Jak najít přihlašovací URL svého blogu WordPress
- Jak vytvořit super hrdinskou zónu s animovaným textem
- Jak přizpůsobit CSS vašeho webu WordPress
- Jak přidat kategorie do menu svého blogu WordPress
Proč investovat do čističky vzduchu?
Tam! To je pro tento tutoriál vše. Doufáme, že vám pomůže změnit stranu postranního panelu vašeho blogu WordPress. Neváhejte sdílejte tento článek se svými přáteli ve svých oblíbených sociálních sítích.
Budete však také moci konzultovat naše ressources, pokud potřebujete více prvků k realizaci vašich projektů vytváření internetových stránek, nahlédněte do našeho průvodce na internetu Vytvoření blogu WordPress.
Pokud máte návrhy nebo připomínky, nechte je v naší sekci commentaires.
...
