Editace domovské stránky pomocí Elementoru: přidání modulů (text, obrázky, tlačítka atd.)

Naučit se přidávat základní moduly je klíčová dovednost pro návrh stránek pomocí Elementoru. V této kapitole vás krok za krokem naučíme, jak přidávat běžné prvky, jako jsou text, obrázky, tlačítka, a jak upravovat jejich styl, abyste mohli vytvořit základní verzi své domovské stránky.

Příprava: Přejděte do režimu editace v Elementoru.

1. Přihlaste se do administrace WordPressu, přejděte na „Stránky“ → najděte „Domovskou stránku“ (nebo stránku, kterou chcete upravit) a klikněte na „Upravit“.
2. Na vrcholu stránky klikněte na tlačítko „Upravit pomocí Elementoru“ (modré barvy s ikonou Elementoru) a přejděte do režimu vizuálního editování.

Po přihlášení je rozhraní rozděleno na tři části:

• Na levé straně: panel modulu.(Zahrnuje všechny prvky, které lze přidat)
• Střed: editační oblast(Zobrazení efektů stránky v reálném čase)
• Na pravé straně: panel stylů.(Po výběru prvku můžete upravit styl detailů)

První krok: přidejte modul „Nadpis“ (textový nadpis).

Nadpis je „kmen“ stránky, který návštěvníkům pomáhá porozumět hierarchii obsahu.

1. Naleznete modul s názvem.V levém panelu modulů najděte modul „Titulky“ v kategorii „Základní“ (ikona „T“).
2. Přetáhněte a přidejte na stránku.Zadržte modul „Nadpis“ a přetáhněte jej na pozici „+ Přetáhněte prvek sem“ v centrální editační oblasti. Poté uvolněte tlačítko myši. Na stránce se nyní zobrazí výchozí nadpis „Toto je nadpis“.
3. Změňte obsah titulku.Vyberte právě přidaný modul titulku a na pravé straně se zobrazí editační panel:
   • V části „Obsah“ → „Text nadpisu“ odstraňte výchozí text a zadejte svůj nadpis (například „Vítejte na mém osobním blogu“).
   • V „úrovni nadpisů“ vyberte úroveň (H1 je nejvyšší a je vhodná pro hlavní nadpisy; H2 je nižší a je vhodná pro podnadpisy; vyberte podle hierarchie obsahu).
4. Změňte styl nadpisu.Klepnutím na záložku „Styl“ v pravém panelu můžete provést personalizaci:
   • PísmoV rozbalovací nabídce „Písmo“ vyberte písmo, které se vám líbí (například „Microsoft Yahei“ nebo „Arial“).
   • Velikost: Přetáhněte posuvník „Velikost písma“ nebo zadejte hodnotu přímo (doporučujeme, aby velikost titulku byla mezi 24 a 48 pixelů).
   • BarvaKlíkněte na pole „Barva textu“ a vyberte barvu nadpisu (například černou nebo tmavě modrou).
   • ZarovnatKlikněte na tlačítko „Zarovnání textu“ a nastavte zarovnání titulku doleva, uprostřed nebo napravo (pro hlavní titulek na domovské stránce se doporučuje zarovnání do středu).

Druhý krok: Přidejte modul „Odstavec“ (text hlavního obsahu).

Odstavce slouží k prezentaci podrobných informací, jako jsou například úvod, vysvětlení atd.

1. Přidat modul odstavceV kategorii „Základy“ na levé straně najděte modul „Odstavce“ (ikona ve tvaru odstavce) a přetáhněte jej pod modul „Nadpisy“.
2. Změňte obsah odstavce.Vyberte modul „Odstavec“ a v části „Obsah“ → „Text“ na pravé straně zadejte obsah (například „Zde sdílím své životní postřehy a poznámky ke studiu. Vítám vás k diskuzi!“).
3. Optimalizujte styl odstavců.Přepněte na kartu „Styl“:
   • Velikost písmaDoporučuje se nastavit velikost na 16–18 pixelů (pro snazší čtení).
   • Výška řádkuNastavte to na 1,5–1,8násobek (aby byly mezery mezi slovy pohodlnější).
   • BarvaZvolte barvu, která se odlišuje od barvy nadpisu (například tmavě šedá, aby se zabránilo tomu, že bude příliš podobná barvě pozadí).

Třetí krok: Přidejte modul „Obrázky“ (vložení obrázků)

Obrázky mohou stránku oživit, proto doporučujeme vybírat jasné a relevantní fotografie (například fotografie osob, produktů nebo krajiny).

1. Nahrát nebo vybrat obrázek.V kategorii „Základní“ na levé straně najděte modul „Obrázky“ a přetáhněte jej pod odstavec. Vyberte modul Obrázky a v části „Obsah“ → „Obrázky“ na pravé straně klikněte na „Vybrat obrázky“:
   • Pokud je obrázek již v počítači, klikněte na „Nahrát soubor“ → vyberte obrázek → klikněte na „Vybrat“.
   • Pokud jste již obrázek nahráli, vyberte jej přímo v knihovně médií.
2. Nastavte způsob zobrazení obrázků.Přepněte na kartu „Styl“:
   • VelikostV „šířce“ nastavte poměr obrázku k celé stránce (například 100% znamená celou šíři obrazovky, zatímco 80% znamená trochu užší obrazovku).
   • Kolébkové koutyPokud chcete zaoblit okraje obrázku, přesuňte posuvník „Hrana“ tak, aby hodnota byla vyšší (čím vyšší hodnota, tím výraznější bude zaoblení).
   • StínPokud zapnete „Stín na rámečku“, přidá se k obrázku jemný stín (což obrázku dodá větší hloubku).
3. Přidejte popis obrázku (volitelné)Zadáním popisu obrázku (například „Moje fotografie z cest“) v části „Obsah“ → „Alternativní text“ pomůžete vyhledávačům porozumět obsahu obrázku a zlepšit SEO.

Čtvrtý krok: Přidejte modul „Tlačítko“ (pro nasměrování kliknutí).

Tlačítka se často používají k nasměrování návštěvníků k určitým akcím, například „Zobrazit více“, „Kontaktujte mě“ nebo „Koupit nyní“.

1. Modul pro přidávání tlačítekV kategorii „Základní“ na levé straně najděte modul „Tlačítko“ a přetáhněte jej pod obrázek.
2. Nastavte obsah tlačítka a odkaz.Modul výběru tlačítek, v části „Obsah“ na pravé straně:
   • Text: Zadejte text tlačítka (například „Zobrazit mé články“).
   • odkaz (na webové stránce)Klíkněte na vstupní pole vedle „Dynamika“ a zadejte adresu odkazu (například adresu stránky se seznamem vašich blogů nebo externí odkaz).
     • Pokud chcete odkázat na stránku uvnitř webu, můžete kliknout na ikonu „Vybrat stránku“ napravo od pole pro zadávání textu a přímo vybrat cílovou stránku.
3. Návrh stylu tlačítkaPřejděte na kartu „Styl“ a vytvořte nápadné tlačítko:
   • BarvaZvolte bílou barvu pro „Barvu textu“ a živou barvu (například modrou nebo oranžovou) pro „Barvu pozadí“, která bude ladit s hlavními barvami stránky.
   • VelikostZvolte „Střední“ nebo „Velký“ pro „Velikost tlačítka“, aby bylo na tlačítko snazší kliknout.
   • TvarNastavte „poloměr ohraničení“ na 5–10 pixelů (jemně zaoblené rohy vypadají lépe).
   • ** Efekt Hover **: Klikněte na kartu „Hover“ a nastavte barvu při přejezdu myši (například tmavší barva) pro zvýšení interaktivity.

5. krok: Upravte mezery mezi moduly (aby byla stránka přehlednější)

Po přidání několika modulů může dojít k problémům s příliš malými nebo příliš velkými mezerami, což vyžaduje úpravu rozložení:

1. Vyberte modul.Klíkněte na okraj modulu (objeví se modrý rámeček).
2. Změňte vnější okraje.V pravém panelu „Pokročilé“ → „Okraje“ nastavte vzdálenost mezi modulem a horními a dolními prvky (například „horní okraj“ nastavte na 30 pixelů, čímž zvětšíte vzdálenost od horního modulu).
3. Jednotné zarovnání: Podržte Ctrl Klávesa (nebo Command Pokud chcete vybrat několik modulů najednou, klikněte na tlačítko „Zarovnat“ v horní liště nástrojů (například „Zarovnat do středu“), aby se prvky zarovnaly hezčí.

Šestý krok: Uložení a náhled.

1. Uložit změnyKlíkněte na tlačítko „Aktualizovat“ v levém dolním rohu stránky (doporučujeme pravidelně ukládat po každé úpravě).
2. Náhled efektuKlikněte na tlačítko „Náhled“ v levém horním rohu a vyberte „Náhled na stolním počítači“, „Náhled na tabletu“ a „Náhled na mobilním telefonu“, abyste zkontrolovali zobrazení na různých zařízeních (ujištěte se, že na mobilním telefonu nedochází k překrývání textu a zdeformování obrázků).

Tipy pro začátečníky

• Moduly lze přidávat opakovaně: Pokud potřebujete více odstavců nebo obrázků, jednoduše přetáhněte příslušný modul několikrát.
• Odebrat modul: Po výběru modulu stiskněte klávesy na klávesnici. Delete Klávesou Delete nebo kliknutím na ikonu „koše“ nad modulem.
• Modul kopírování: Po výběru modulu můžete klepnutím na ikonu „Kopírovat“ rychle zkopírovat prvky stejného stylu (poté můžete provést změny).

Pomocí výše uvedených kroků jste zvládli nejdůležitější dovednosti při přidávání modulů do Elementoru. Nyní můžete vyzkoušet přidání modulů, jako jsou „ikony“, „čáry“ a „seznamy“, aby byla vaše domovská stránka zajímavější!