Jak používat Elementor – příručka začátečníka/ice

Elementor je plugin pro WordPress, který vám umožní vytvořit moderní a visuálně úchvatné webové stránky, aniž byste se museli zabývat CSS nebo HTML kódováním. S Elementorem získáte vizuální editor typu drag-and-drop. Stránky vytvoříte jednoduše přidáváním jednotlivých elementů (nazývané widgety) z panelu widgetů do oblasti plátna. S Elementorem upravíte jak vzhled stránek tak i vzhled příspěvků na vašem blogu.

Jak používat Elementor: Začínáme

Než se pustíte do vytváření stránek, seznamte se se 3 základními prvky, které najdete v Elementoru:

  1. Widget: Designový prvek/element (např. Tlačítko, Box s ikonou)
  2. Section (Sekce): Kontejner/oblast, ve které najdete sloupce
  3. Column (Sloupec): Menší kontejner/oblast v rámci Section (Sekce) pro umístění jednotlivých widgetů

wppagebuilders.com

Chcete-li začít používat Elementor, jednoduše vytvořte novou stránku ve WordPressu (Stránky -> Přidat nový). Dejte své stránce název a klikněte na tlačítko Edit with Elementor (Upravit pomocí Elementoru). Tím se otevře editor Elementor.

wppagebuilders.com

Jak upravit požadovanou sekci. To provedete kliknutím na tlačítko plus na ploše plátna.

Při přidávání nové sekce můžete vybrat strukturu a počet sloupců. Elementor pracuje se strukturou až 12 sloupců.

Máte sekci a sloupce připravené? Můžete začít přidávat widgety. Elementor ve své verzi zdarma nabízí více než 40 widgetů, které najdete na panelu widgetů – to menu vlevo ;). Chcete-li nějaký přidat, jednoduše přetáhněte widget z panelu widgetů do vybraného sloupce v oblasti plátna.

Úpravy sekce, sloupce a widgetu

Sekce, sloupce a widgety můžete upravovat v  panelu widgetů.

Úpravy sekce

Sekci, kterou chcete upravit, označíte kliknutím na úchyt sekce. Tím se panel widgetů umístěný vlevo přepne do režimu úprav.

Jakmile je sekce přepnuta do režimu úprav, můžete ji upravit na panelu widgetů.

Existují tři záložky, se kterými budete pracovat:

  • Layout/Content (Rozvržení/Obsah)
  • CSS (v dřívějších verzích Style)
  • Advanced (Pokročilé)

Každá záložka se skládá z několika bloků pro úpravu a každý blok obsahuje několik možností nastavení.

Uvedeme si příklad.

Řekněme, že chcete přidat efekt Shape Divider (Tvarovaný oddělovač). Označte sekci, které chcete oddělovač přidat, přejděte na kartu CSS a otevřete blok Shape Divider. Nastavte umístění oddělovače (nahoře nebo dole) a vyberte požadovaný tvar. Po výběru oddělovače můžete nastavit jeho barvu, šířku a výšku.

Chcete-li upravit nastavení padding (vnitřní odsazen) a margin (vnější okraje), najdete ho pod záložkou Advanced (Pokročilé).

Úpravy sloupce

Než budete moci sloupec upravit tak musíte – stejně jako sekci – přepnout sloupec do režimu úpravu. Opět tak provedete kliknutím na úchyt sloupce.

I tady najdete tři hlavní záložky, se kterými můžete pracovat – Layout (Rozvržení), CSS a Advanced (Pokročilé).

Šířku sloupce můžete upravit na záložce Layout > blok Layout > pod parametrem Column Width (Šířka sloupce). A nebo (a toto je kouzlo drag-n-drop editorů) můžete změnit šířku sloupce přímo na plátně Elementoru . Jednoduchým tažením ohraničení sloupce doleva nebo doprava.

Změnu pozadí sloupce nebo sekce provedete na záložce CSS v bloku Background (Pozadí). Můžete změnit barvu, vložit obrázek, slideshow nebo i video (stačí vám jeho odkaz na YouTube).

Úpravy widgetu

Než začnete widget upravovat, nejprve ho přepněte do režimu prav. Ano, opět tak provedete kliknutím na modrý úchyt 😉

Dostupné možnosti nastavení se u každého widgetu liší.

Níže vidíte příklad na widgetu Formulář, který má 5 bloků k nastavení pod záložkou Content (Obsah). 

A tady jsou možnosti nastavení pro widget Button (Tlaítko), který má pouze jeden blok.

Chcete-li upravit vzhled widgetu (barvy, písmo, ohraničení), přejděte na záložku CSS. I tady se možnosti a množství bloků pro úpravu liší v závislosti na widgetu, který upravujete. Čím více komponent má widget, tím více bloků a možnost stylingu nabízí.

Ukážeme si příklad.

Řekněme, že chcete změnit barvu textu a typ textu widgetu Button (Tlačítko).

Klikněte na chyt widgetu tlačítka a přejděte na záložku CSS v panelu widgetů. Chcete-li změnit typografii (velikost písma, styl psma a font), klikněte na ikonu tužky u možnosti Typography (Písmo). Chcete-li nastavit barvu textu, klikněte na výběr barvy u možnosti Text Color (Barva textu).

TIP

Chcete-li si usnadnit přecházení mezi sekcemi, sloupci a widgety, použijte funkci Navigátor. V Navigátoru se můžete pouhým kliknutím na sekci, sloupec nebo widget přepnout do režimu úprav. Navigátor je velmi užitečný, pokud máte složitou strukturu stránky, která se skládá z několika sekcí a desítek widgetů. Navigátor můžete vyvolat kliknutím na jeho ikonu na spodní straně panelu widgetů.

Elementor vám umožňuje zobrazit náhled stránky pro tři různé typy zařízení (počítač, tablet a mobil). Kliknutím na ikonu zařízení vedle ikony oka můžete vybrat typ zařízení, na kterém chcete zobrazit náhled své stránky.

Stránku nemusíte okamžitě publikovat, ale můžete si ji uložit jako koncept. Provedete tak kliknutím na šipku vedle tlačítka PUBLISH (Publikovat) a kliknutím na Save as a draft (Uložit jako koncept).

Chcete-li se vrátit do administrace WordPress, klikněte na třířádkovou ikonu v levém horním rohu panelu widgetů a klikněte na tlačítko Exit to dashboard (Odejít na nástěnku).

Music

is medicinal
the power of the universe

Music

in the soul can be heard by the universe.

0
    Your registration
    Your registration is emptyBack to events
    Scroll to Top