Elementor : Váš kompletní průvodce nástrojem WordPress Page Builder

Maddy Osman Poslední aktualizace 08.07.2021
10 min.
Jak používat Elementor : Průvodce nastavením od začátku do konce
Poslední aktualizace 08.07.2021

Elementor je v současné době jedním z nejoblíbenějších nástrojů pro tvorbu stránek WordPress . A to z dobrého důvodu: Elementor je nabitý funkcemi, díky kterým je tvorba vlastních webových stránek jednodušší než kdykoli předtím. V tomto příspěvku se dozvíte vše, co potřebujete vědět o webu Elementor .

Pokud vás zajímá, jak používat web Elementor , jste na správném místě. Dnes se dozvíte vše o Elementor - včetně tipů pro instalaci a nejlepších Themes a doplňků. Protože zejména na začátku může být používání stránek Elementor matoucí. Podíváme se blíže na následující témata:

  • Elementor : Co je Elementor a jak funguje nástroj pro tvorbu stránek
  • Výhody používání Elementor jako WordPress Page Builder
  • Rozdíly mezi Elementor a Elementor Pro
  • Jak nainstalovat nástroj Elementor Page Builder na WordPress
  • Jak používat Elementor : vysvětleno krok za krokem
  • Nejlepší Elementor Themes a jak je používat
  • Doporučené doplňky pro Elementor
  • Závěr: Jak používat Elementor - komplexní průvodce

Elementor : Co to je a jak to funguje

Co je vlastně page builder?

Nástroj pro tvorbu stránek je srovnatelný se "stavebnicí" pro obsah vašich webových stránek, ve které můžete přetahovat jednotlivé prvky na požadovaná místa a naplnit je vlastním obsahem. V našem článku se dozvíte nejdůležitější výhody a nevýhody nástrojů pro tvorbu stránek.

Elementor je nástroj pro tvorbu webových stránek Plugin určený pro WordPress . Elementor přidává celou řadu funkcí přetahování. I nováčci tak mohou vytvářet úžasné webové stránky, které vypadají profesionálně.

Největší výhodou webu Elementor je, že získáte kompletní živý náhled na své webové stránky - během provádění změn.

Elementor vytváří intuitivní design, zejména pro začátečníky. K tomu Plugin využívá desítky widgetů, kompletní knihovnu šablon a funkci historie změn. 

Jádro Plugin Elementor je zdarma a obsahuje mnoho základních prvků. Pokud potřebujete pokročilejší funkce, je k dispozici aplikace Elementor Pro. Tato prémiová verze Elementor má několik cenových úrovní, od 49 USD/rok za jednu webovou stránku až po 999 USD/rok za 1 000 webových stránek.

Výhody používání Elementor jako WordPress Page Builder

Jak jste již možná uhodli, web Elementor má několik výhod. Než se pustíme do samotného výukového programu Elementor , prozkoumáme jich několik. Mezi nejdůležitější výhody patří: 

  • Snadné použití. Vizuální editace frontendu v kombinaci s widgety umožňuje neuvěřitelně snadnou práci s nástrojem Elementor Page Builder, a to i nováčkům. 
  • Flexibilní a rozšiřitelný pro vývojáře. Díky robustní knihovně šablon, editoru bloků a plné kontrole nad výstupem se i zkušenější vývojáři mohou naučit používat a pracovat s nástrojem Elementor Theme Builder. 
  • Tuny možností stylingu. Pomocí panelu editoru s posuvníky můžete upravovat nastavení návrhu v rámci pohodlných úprav.  
  • Globální widgety, které šetří čas. Můžete měnit, přizpůsobovat, ukládat a používat widgety na více webových stránkách. 
  • Vytváření stránek Theme přetažením myší. Vytvořte si Elementor Theme od začátku pomocí vestavěných widgetů - nebo použijte jako základ šablony Elementor Pro. 
  • Integrace elektronického obchodu. Pomocí panelu widgetů můžete vytvořit internetový obchod s plným responzivním ovládáním, na které jste zvyklí u jiných tvůrců stránek s kompatibilitou WooCommerce .
  • Vestavěné marketingové nástroje. Zejména při začátcích práce s webem Elementor si hned všimnete následujících věcí: Můžete si přizpůsobit styly formulářů, vytvořit vstupní stránku Elementor a používat widgety Plugin a budovat tak svou webovou prezentaci a marketingovou strategii zároveň. 
  • Velká komunita třetích stran a tržiště. Velkou výhodou webu Elementor je velká komunita vývojářů, která za ním stojí. Můžete strávit hodiny procházením všech šablon stránek Elementor , WordPress Themes a doplňků, které rozšiřují základní funkce Elementor . 
Srovnání 15 nejoblíbenějších WordPress page builderů

Existuje více než jen jeden nástroj pro tvorbu stránek WordPress . Právě teď vám představíme 15 různých Plugins , které vám pomohou rychleji se pohybovat s WordPress . Seznamte se s nejlepšími nástroji pro tvorbu stránek WordPress , které jsou dnes na trhu.

Rozdíly mezi Elementor a Elementor Pro

Než budeme pokračovat, je důležité zmínit, že existuje verze Pro Elementor . S bezplatnou verzí se dostanete poměrně daleko, ale pokud hledáte ještě více funkcí, měli byste zvážit Elementor Pro. 

Bezplatná verze Elementor obsahuje vše, co potřebujete k vytvoření webových stránek, včetně funkcí pro tvorbu:

  • Záhlaví 
  • Textová pole 
  • Widgety obrázků 
  • Video widgety 
  • Widgety galerie
  • Zkušenosti 
  • Rozdělovací widgety 
  • Widgety akordeonu 

Elementor Pro přidává několik funkcí určených pro podniky, včetně:

  • Formuláře 
  • Slides 
  • Portfolio 
  • Cenové tabulky 
  • Obrázkové kolotoče 
  • Widgety počítadla 
  • vyskakovací okna 
  • Tlačítka sociálních sítí Widgety
  • Vlastní zápatí a hlavička 
  • výzva k akci

Můžete také přidat vlastní písma a body zlomu a používat mnoho prémiových widgetů. Zde najdete srovnání bezplatné verze Elementor a Elementor Pro: 

Rozdíly mezi Elementor  a Elementor  Pro
Infografika porovnávající funkce Elementor a Elementor Pro

Jak nainstalovat nástroj Elementor Page Builder v aplikaci WordPress

Proinstalaci Elementor potřebujete nainstalovaný WordPress shostingovým plánem adoménovým jménem . Po přihlášení na řídicí panel webu WordPress přejděte na Plugins > Přidat nový. 

Jak nainstalovat nástroj Elementor  Page Builder v aplikaci WordPress
WordPress Plugins Vyhledávací obrazovka v panelu nástrojů

Vyhledejte stránku Elementor a nainstalujte ji. Poté klikněte na tlačítko Aktivovat

Jak nainstalovat Elementor  plugin
Nainstalujte a aktivujte Elementor Plugins na ovládacím panelu WordPress .

Pokud se rozhodnete pro Elementor Pro (nebo chcete provést upgrade ze základní verze Elementor Plugin ), přejděte na webové stránky Elementor na adrese. Můj účet a klikněte na tlačítko ke staženíPlugin . Tím se do počítače uloží soubor ZIP. 

Zobrazení účtuElementor
Zobrazení účtuElementor , přístup do nabídky Stažené soubory

Poté se přihlaste na svůj řídicí panel WordPress a přejděte na Plugins > Přidat nový. Nahrajte právě uložený soubor ZIP do počítače, klikněte na tlačítko Instalovat a poté na tlačítko Aktivovat. Aby tato funkce fungovala, musíte mít nainstalovanou a aktivovanou bezplatnou verzi webu Elementor Plugins . 

Přidání stránky plugins do WordPress
Přidejte adresu Plugins do WordPress

Odtud je třebaaktivovat licenci na adrese . Chcete-li tak učinit, přejděte na stránku Elementor > Licence a klikněte na možnost Připojit a aktivovat. 

Aktivace licence Elementor  Pro na ovládacím panelu WordPress  .]
Aktivace licence Elementor Pro na ovládacím panelu WordPress

Na další obrazovce klikněte na tlačítko Připojit a přihlaste se ke svému účtu Elementor . 

Propojení licence Elementor  s webovou stránkou WordPress
Připojení licence Elementor k webové stránce WordPress

Budete přesměrováni zpět na ovládací panel. Zpráva v horní části obrazovky s výzvou k aktivaci licence by měla zmizet. 

Jak používat Elementor : vysvětleno krok za krokem

Po dokončení instalace je čas začít pracovat na tom, jak používat web Elementor v praxi. Elementor doporučuje nainstalovat Envato Elements Plugin , který vám v panelu nástrojů poskytne výběr šablon stránek Elementor . Ujistěte se, že máte nainstalovaný a aktivovaný výchozí web WordPress Theme . 

Stažení aplikace Envato Elements plugin na ovládacím panelu WordPress
Stáhněte si Envato Element Plugins z WordPress Dashboard

Chcete-li začít, přejděte na palubní desku WordPress do části Prvky. Můžete si vybrat mezi bezplatnými a prémiovými sadami šablon. Rozhodněte se, kterému z nich dáte přednost. Pak si vyberte šablonu, která vám vyhovuje.

Seznam bezplatných sad šablon od společnosti Envato Elements in WordPress
Seznam bezplatných sad šablon z Envato Elements v sekci WordPress

Přejděte dolů do nabídky šablon a vyberte motiv domovské stránky, který chcete importovat. Tento postup opakujte pro každou konkrétní novou šablonu stránky, kterou chcete vytvořit. Mnoho lidí se často rozhoduje pro vytvoření stránek jako O nás, Servis a Kontakt - ale to je na vás.

Seznam bezplatných sad šablon od společnosti Envato Elements in WordPress
Možnosti šablony domovské stránky v sadě šablon CoWorking Space

Po vytvoření stránek je můžete upravovat pomocí stránky Elementor . To provedete tak, že přejdete do nabídky Stránky > Vše, najedete na stránku, kterou chcete upravit, a kliknete na možnost Upravit pomocí Elementor . 

Po načtení stránky byste měli vidět editor Elementor v akci. Na levé straně obrazovky se zobrazí aktivovaný režim editoru. Na pravé straně se zobrazí náhled editoru. Jedná se v podstatě o živé zobrazení vašich webových stránek, které můžete přímo měnit, přeformátovávat a upravovat. 

Elementor : Váš kompletní průvodce nástrojem WordPress  Page Builder
Úprava domovské stránky v Elementor

Obsah je v režimu úprav rozdělen do sekcí. Po najetí na oddíly by měly být zvýrazněny světle modrou barvou. 

Po kliknutí na oddíl můžete přímo upravovat jeho obsah. Pokud kliknete pravým tlačítkem myši, otevře se panel sekcí. Zde vidíte, jak se po kliknutí na obrázek v šabloně zobrazí na levé straně ovládací panel pro obrázek: 

Úpravy obrázků v Elementor
Úpravy obrázků v Elementor

Práce s widgety probíhá podobně: pokud je již v šabloně přítomen, stačí kliknout na šedou ikonu tužky a otevřít režim úprav daného widgetu. Ten se pak znovu objeví na levé straně. 

Pokud chcete provést změny ve widgetu karuselu obrázků, můžete na něj kliknout v předem připravené šabloně a poté provést změny nastavení úpravou velikosti, přidruženého textu a obrázků. 

Přidání widgetu karuselu obrázků v aplikaci Elementor
Přidání widgetu karuselu obrázků v aplikaci Elementor

Až se naučíte používat šablony Elementor a navrhnete rozvržení stránky podle svých představ, můžete začít přemýšlet o stylování. Barvy můžete přizpůsobit na globální úrovni (pro celý web, pokud používáte verzi Pro) a také na základě widgetů. 

Změna barvy textu v nadpisech je hračka:

Změna barvy, písma a stylu textu v aplikaci Elementor
Změnit barvu, písmo a styl textu v aplikaci Elementor

Můžete upravit styly a velikosti písma, zda má text vržený stín (a jeho neprůhlednost) a různá další nastavení stylů pro mezery, okraje a okraje. Můžete dokonce upravit velikost a vzor dělicího widgetu. 

Můžete vkládat ikony sociálních médií, přizpůsobit jejich barvu a velikost a určit jejich umístění. Můžete také měnit jejich tvar, přidávat sloupce a měnit jejich orientaci. 

Přidání ikon sociálních médií pomocí Elementor
Přidání ikon sociálních médií pomocí Elementor .

Celý pracovní postup s Elementor je uživatelsky přívětivý. Pokud uděláte chybu, snadno ji napravíte, protože si vždy můžete zobrazit historii revizí a jedním kliknutím se vrátit ke starší verzi webu. 

Zobrazení Historie revizí a Navigátor v Elementor
Zobrazení Historie revizí a Navigátor v Elementor

Stejně tak navigátor usnadňuje zobrazení všech sekcí, vnitřních oblastí a widgetů najednou, takže nemusíte donekonečna rolovat nahoru nebo dolů. Manipulace s jakoukoli částí webu je podobná na adrese Elementor . Vyberte část nebo widget, proveďte změny a uložte práci. A až budete připraveni, můžete své webové stránky zveřejnit. 

Pokud chcete přidat další funkce nebo chcete ještě robustnější startovací verzi Theme , můžete použít Elementor Themes a doplňky - a právě k tomu se dostaneme příště. Nyní, když jste pochopili základy používání Elementor , se podívejme na některé z nejoblíbenějších Themes , které jsou pro tuto platformu k dispozici. 

Nejlepší Elementor Themes

  • Dobrý den,: Hello je bezplatný a snadno použitelný Theme, určený pro Elementor . Hello je skutečný Theme začít s Elementor . Hello neobsahuje žádné styly ani skripty, ale je dodáván s hlavním WordPress Plugins kompatibilní. 
  • Layers: Elementor převzal Layers, takže je nyní kompatibilní s Plugin a nabízí možnosti designu vhodné pro profesionály - zcela zdarma. 
  • Astra: Astra je známá jako nejoblíbenější WordPress Theme všech dob, je lehká, rychlá a snadno se přizpůsobuje pomocí Elementor . Bezplatná verze je velmi bohatá na funkce, ale k dispozici je také verze Pro, která nabízí větší výběr předpřipravených widgetů a možností přizpůsobení. Cena začíná na 47 dolarech za rok.
  • Hestia: Hestia je další Theme, která je kompatibilní s Elementor . Nabízí moderní design zdarma. Můžete však také přejít na verzi Pro, která vám nabídne více možností widgetů a lepší kompatibilitu s webem Elementor . Ceny začínají na 69 USD/rok.
  • GeneratePress: Tento bezplatný a otevřený zdrojový kód WordPress Theme je solidní volbou pro tvorbu jakéhokoli typu webových stránek. K dispozici je také verze Pro s více funkcemi, jejíž cena začíná na 44 dolarech ročně. 
  • OceanWP: Tento prémiový WordPress Theme nabízí plnou kompatibilitu s Elementor , včetně několika ukázek, rozšíření a widgetů, a to již od 39 USD/rok. 
  • Přizpůsobení: Tato stránka Theme je zdarma. Díky integraci se stránkou Elementor a nástroji Header & Footer Builder nabízí spoustu možností přizpůsobení. Můžete také přejít na verzi Pro, která je k dispozici za 59 USD ročně a nabízí další moduly, aktualizace a podporu.
  • Neve: Tento web Theme má design Mobile First , který funguje s webem Elementor a je zdarma. K dispozici je verze Pro s ještě více funkcemi za cenu od 59 USD ročně.
  • Phlox Pro: Tento prémiový web Theme je k dispozici na adrese ThemeForest za 49 USD a obsahuje více než 150 šablon Elementor . 
  • Zakra: Tento web Theme je navržen pro rychlost a SEO a obsahuje více než 65 šablon pro spuštění. Verze Pro zahrnuje prémiové ukázky a širší sadu funkcí, cena začíná na 59 dolarech ročně. 

Doporučené doplňky pro Elementor 

StránkaElementor je nabitá funkcemi. Nyní víte, jak používat stránky Elementor Themes . Měli byste ale také zvážit různé populární doplňky, které dále rozšiřují funkce. 

Až se budete učit používat web Elementor , vyzkoušejte následující doplňky:

  • Ultimate Addons: Rozšiřuje Elementor o další doplňky, widgety a bloky za cenu od 55 USD. 
  • Essential Addons for Elementor : Jedná se o nejoblíbenější knihovnu Elementor pro Elementor , která obsahuje více než 70 možností a jejíž cena začíná na 39,97 USD za jeden web. 
  • Elementor Pack: Tento balíček obsahuje bezplatné widgety a doplňky Elementor . Verze Pro nabízí ještě více widgetů, podporu a aktualizace za cenu od 29 USD ročně.
  • Prime Slider: Pomocí tohoto doplňku můžete vytvořit posuvník v záhlaví a v oblasti hrdinů svých webových stránek Elementor . Stránku Plugin si můžete stáhnout zdarma nebo si vybrat verzi Pro, která zahrnuje podporu a aktualizace a stojí od 7,92 USD ročně.
  • ToolKit pro Elementor : Cílem ToolKitu je zjednodušit tvorbu webových stránek Elementor díky vylepšení výkonu a intuitivnějším nástrojům pro správu. S tímto doplňkem můžete začít pracovat až na třech webových stránkách za 49 dolarů ročně.
  • Happy Addons: V neposlední řadě je tu Happy Addons. Tento doplněk přidává na web Elementor nové widgety, sekce a předvolby. K dispozici je bezplatná verze a verze pro. Druhá varianta obsahuje další funkce, jako je Live Copy, nepřetržitá podpora a aktualizace. Cena začíná na 29 dolarech za rok. 

Závěr o nástroji Elementor Page Builder

Elementor je často označován za nejlepší nástroj pro tvorbu stránek Plugin pro WordPress . Má to dobrý důvod: díky bohatému designu, robustní komunitě a dostupnosti stránek Themes a doplňků je Elementor flexibilní a dostupný způsob tvorby webových stránek. 

Pokud se chcete naučit používat web Elementor , musíte začít se solidním hostingovým plánem. My v RAIDBOXES nabízejí specifickýhosting WordPress , který pokrývá různé potřeby. Máte-li jakékoli dotazy týkající se stránek nebonašich plánů, neváhejte nás kontaktovat.

Vaše otázky k tématu Elementor

Jaké otázky máte na Maddy? Těšíme se na váš komentář. Zajímáte se o WordPress a webový design? Pak sledujte stránky RAIDBOXES na Twitteru a Facebooku, LinkedIn nebo prostřednictvím našeho newsletteru.

Maddy Osman je SEO Content Strategist. Spolupracuje s vybranými zákazníky v oblasti WordPressu a webhostingu. Vzhledem ke svým znalostem v oblasti webového designu a WordPressu se se SEO opravdu vyzná – a přesně ví, jak propojit značky s obsahem, který je pro SEO relevantní.

Podobné články

Komentáře k tomuto článku

Napsat komentář

Vaše e-mailová adresa nebude zveřejněna. Povinná pole jsou označena *.