Seznam produktů v Elementor s tabulkou produktů WooCommerce

V tomto příspěvku vám ukážeme, jak zkombinovat tabulku produktů Elementor a WC, abyste vytvořili přizpůsobenější web WordPress a zároveň zvýšili prodej vašeho obchodu WooCommerce.

WordPress zjednodušuje proces tvorby webu a jeho rychlého zprovoznění. WooCommerce je plugin WordPress, který vám umožní proměnit jakýkoli web WordPress na plně funkční internetový obchod. Riskujete, že vytvoříte napodobeninu webu, ale pokud budete pokračovat s jejich výchozími možnostmi a funkcemi, nemusí to být vhodné pro vaše obchodní potřeby. Je důležité najít ty nejlepší nástroje pro navrhování a přizpůsobení vašeho webu, dokud nebude to, co chcete.

Pro vylepšení funkčnosti vašeho obchodu je k dispozici plugin WordPress a WooCommerce amp je nejpřímější nástroj pro přizpůsobení vaší produktové stránky WooCommerce. I když je to jedna z jeho nejvýznamnějších výhod, má také některé významné nevýhody. Například , když zkombinujete WordPress plugin od různých autorů, riskujete, že narazíte na chyby kompatibility a další komplikace amp toto není případ, kdy používáte WooCommerce Product Table a plugin pro weby WordPress. plugin budete mít větší kontrolu nad vzhledem a funkčností svých stránek a lze je použít ve spojení k dosažení ještě lepších výsledků.

Rychlý přehled tabulky produktů WooCommerce a rámců Elementor

Jak již bylo uvedeno, k dispozici je široký výběr plugin WordPress, které vám pomohou vytvořit lepší web WordPress, který je přizpůsoben vašim konkrétním požadavkům. Některé plugin jsou navrženy pro použití ve velkém měřítku, zatímco jiné jsou navrženy tak, aby přidaly konkrétní aspekt nebo funkci.

Elementor je amp prvního typu aplikace:

Náš plugin pro tvorbu stránek vám nabízí zcela nové rozhraní pro vytváření webových stránek a vytváření vašeho webu WordPress. Získáte velkou kontrolu nad tím, jak jsou vaše webové stránky sestaveny, výběrem a přizpůsobením rozsáhlé knihovny widgetů, bloků a rozvržení.

Zatímco tabulka produktů WooCommerce je obecnějším řešením, je také více cílená:

Tento plugin vám umožňuje vytvářet dynamické, plně přizpůsobitelné tabulky, které obsahují vaše produkty a služby WooCommerce. Vzhledem k jejich interakci s WooCommerce jsou však tyto tabulky obzvláště vhodné pro zobrazování položek a služeb uživatelsky přívětivým a vizuálně přitažlivým způsobem pro online nakupující. plugin Posts Table Pro spolupracuje stejně s Elementorem a místo toho lze použít jakýkoli typ obsahu WordPress v tabulce namísto jednoduchých produktů WooCommerce (pokud chcete zobrazit něco jiného než produkty – jako jsou příspěvky, stránky nebo dokumenty).

Při použití ve vzájemném spojení poskytují Elementor a WooCommerce Product Table výrazně rozmanité možnosti. Můžete je využít k vytvoření některých velmi významných dopadů, které pomohou zvýšit počet prodejů pro váš obchod WooCommerce.

Nyní je čas pustit se do práce. V následujících částech se podíváme na některé amp ze skutečného světa, jak můžete využít tabulku produktů WooCommerce a Elementor k vytvoření efektů podobných těm, které jsou uvedeny výše.

Pokud jde o kombinaci těchto dvou plugin , nebe je limit – a to je jen několik možností. S trochou pokusů a omylů můžete sestavit různé stránky pomocí stejného základního přístupu, který si ukážeme.

V první řadě se budete chtít ujistit, že oba plugin jsou na vašem webu správně nainstalovány. Je dobře, že instalace Elementor a konfigurace tabulky produktů WooCommerce je bezbolestná a přímočará. Než budete moci pokračovat v tomto kroku, musí být také nainstalován a povolen samotný WooCommerce. Pak budete připraveni začít pracovat na svém projektu.

Chcete-li začlenit tabulku produktů WooCommerce do textového editoru nebo widgetu krátkého kódu, postupujte takto:

Začněme tou nejzásadnější a nejpřínosnější aplikací. Případně, pokud chcete na svém webu Elementor jednoduše použít dynamickou tabulku produktů, můžete ji přidat do widgetu a nechat ji zobrazit na přední straně webu.

Ujistěte se, že používáte editor Elementor, když otevřete jakoukoli stránku nebo příspěvek, abyste toho dosáhli. Pokud se vám zobrazí známé rozhraní WordPress, klikněte na tlačítko Upravit pomocí Elementor a přepněte do rozhraní Elementor:

Pokud s Elementorem spolupracujete poprvé, udělejte si malou prohlídku platformy. Vpravo se objeví velká oblast, kde se bude zobrazovat váš obsah, a bude aktualizován v reálném čase, jak jej budete přidávat a upravovat. Na levé straně obrazovky je seznam „widgetů“, které můžete přetáhnout do určené oblasti a poté je reorganizovat a nakonfigurovat podle potřeby:

Tabulku produktů lze použít s řadou různých widgetů Elementor. Pokud však chcete na stránce zobrazit pouze jednu tabulku produktů, můžete toho dosáhnout zahrnutím úvodní textové části do kódu HTML stránky. Vezměte widget Textový editor a přesuňte jej na prázdné místo následovně:

Poté můžete kliknutím do widgetu odstranit výchozí text a nahradit jej libovolným obsahem. Pokud jde o samotnou tabulku produktů, můžete ji zahrnout vložením tohoto jednoduchého krátkého kódu:

[tabulka produktů]

Když na svou stránku vložíte krátký kód, tabulka se objeví na vámi určeném místě, které si můžete ověřit zobrazením na frontendu:

Pokud chcete použít prvek pouze pro samotný kód, můžete použít widget Shortcode.

Po dokončení umístění stolu nikdy nezapomeňte stránku uložit, bez ohledu na to, kam se ji rozhodnete umístit. Poté pravděpodobně budete chtít provést nějaké změny ve vzhledu a fungování tabulky.

Vraťte se na svůj ovládací panel WordPress a přejděte na kartu WooCommerce > Nastavení a dokončete tento úkol. Tabulky produktů najdete výběrem Produkty v horní části obrazovky a poté Produktové tabulky:

Podrobný seznam možností pro konfiguraci tabulky produktů WooCommerce naleznete přímo zde. Máte úplnou kontrolu nad informacemi, které se zobrazují v tabulce, a můžete si je přizpůsobit mimo jiné přidáním filtrů a proměnných. Další informace o různých možnostech naleznete v dokumentaci plugin .

Právě vytvořenou tabulku produktů budete moci upravit pomocí Elementor, aniž byste museli dělat cokoli jiného. Jakmile dokončíte přizpůsobení tabulky vašim specifikacím, jednoduše změny uložte a můžete začít!

Akordeony, záložky a přepínače lze použít k uspořádání několika tabulek produktů.

Výše uvedené řešení funguje dobře, pokud chcete se svými produkty WooCommerce prezentovat jeden stůl. Pokud budete konstruovat mnoho tabulek, z nichž každá má jinou kategorii objektů, není to nejlepší volba.

V Elementoru existuje několik různých způsobů, jak toho dosáhnout. Ke generování stejného efektu, jaký jsme viděli v poslední případové studii, lze amp použít widget Accordion. Začněte z oblasti úprav na pravé straně a přesuňte widget Akordeon do oblasti úprav na levé straně.

Kliknutím na znaménka plus můžete vytvořit libovolný počet samostatných karet a v každé z nich můžete upravit nadpisy a text. Kromě toho můžete přidat tabulku produktů na jednu nebo více karet pomocí stejného krátkého kódu, jak bylo uvedeno výše.

Pouhé přidání základního krátkého kódu samozřejmě povede k řadě podobných produktových tabulek, což s největší pravděpodobností není to, co jste původně hledali. Místo toho budete muset přizpůsobit každý krátký kód tak, aby zobrazoval pouze určité produkty – amp položky z konkrétní kategorie – namísto všech produktů.

Metoda, kterou použijete, bude určena produkty, které chcete zahrnout a vynechat z každé příslušné tabulky. Další informace naleznete v úplném průvodci přizpůsobením krátkých kódů tabulky produktů WooCommerce.

Stojí za zmínku, že podobného efektu můžete dosáhnout pomocí některých dalších užitečných widgetů Elementor; to mimo jiné zahrnuje widget Toggle a widget Tabs. Pokud jde o prezentaci několika tabulek produktů WooCommerce přitažlivým a dobře organizovaným způsobem, Elementor je váš oblíbený nástroj.

Vyčistěte své nedbalé značení díky bezplatným online organizátorům HTML, CSS a JavaScript!

Pokud chcete, aby se vaše firma odlišovala od konkurence, zamyslete se nad návrhem svého webu elektronického obchodu. amp budete chtít určit nejúčinnější způsob prezentace svých produktů, ideálně ve stylu, který je uživatelsky příjemný a vizuálně přitažlivý.

Naštěstí pomocí plugin WooCommerce Product Table s Elementor je to jednoduchý úkol. Krátký kód vaší tabulky produktů lze použít k zobrazení všeho, co váš web nabízí (nebo jen výběru), skutečně dynamickým způsobem.

Hanson F.

Poslední příspěvky

Jak používat záhlaví a zápatí s Elementorem

Záhlaví a zápatí webu jsou základními prvky. Ve většině případů záhlaví poskytuje navigaci…

6. ledna 2022

Porovnání témat WordPress: Astra vs OceanWP

Dvě z nejpopulárnějších témat WordPress na trhu jsou Astra a OceanWP. Profesionální…

2. ledna 2022

Porovnání témat zpráv WordPress: Noviny vs. Astra

Vytvoření vynikajícího zpravodajského webu z vás nevyžaduje, abyste se stali webdesignérem. My…

25. října 2021

Vytvořte webové stránky související se zprávami s tématem novin

Téma Noviny je jedním z nejvýznamnějších témat WordPress navržených tagDiv, a…

18. října 2021

Jak vytvořit eCommerce pomocí Avada WooCommerce Builder

Pokud jde o nastavení internetového obchodu, WooCommerce je plugin . To…

4. října 2021

Jak používat efekty lepivé hlavičky a rolování s Elementorem

Záhlaví je obecně první věc, kterou člověk uvidí, když navštíví váš web,…

21. září 2021