Articles

Jak přidat vlastní pole na stránky produktů WooCommerce

Hledáte způsob, jak přidat vlastní pole na stránky produktů WooCommerce?

Ať už chcete přidat podrobné specifikace na stránku produktu WooCommerce, nebo máte zájem o zobrazení alternativních variant produktu kliknutím na tlačítko, přidání vlastních polí ve WooCommerce vám zabere jen pár okamžiků času.

Poté můžete přizpůsobit všechny části ovládacího panelu WooCommerce a rychle začlenit informace o webu, které by obvykle vyžadovaly ruční zadávání dat.

V tomto článku vám krok za krokem ukážeme, jak přidat vlastní pole k produktům WooCommerce pomocí bezplatného pluginu Advanced Custom Fields (ACF).

Příklady použití vlastních polí pro WooCommerce

Kdy mohou být vlastní pole ve WooCommerce užitečná?

  • Pro přidání dodatečných informací o produktu například u počítačů, kde by se zobrazovaly technické specifikace, jako je paměť RAM a výpočetní výkon.
  • Propagační sdělení, která můžete rychle změnit na něco jiného.
  • Jedinečné mediální prvky, které nelze vložit pomocí standardních funkcí WooCommerce, například další video.
  • Data a časy pro případ, že máte odpočítávání, aukci nebo datum vydání produktu.
  • Další možnosti produktu kromě variant, které si zákazníci mohou prohlédnout.
  • Odstavce pro vysvětlení podrobného návodu k použití položky.
  • Přídavné nabídky, kdy se uživateli zobrazí několik upsellů, které doplňují aktuální produkt. Příkladem mohou být nástavce na elektronické zubní kartáčky nebo různé přívěsky k náramku.
  • Jakékoli neobvyklé nebo dodatečné údaje, které byste chtěli začlenit na stránku produktu a které buď nejsou podporovány prostřednictvím WooCommerce, nebo je jednodušší je doplnit pomocí vlastních polí.

Jak přidat vlastní pole na stránky produktu WooCommerce

V tomto příkladu vytvoříme maketu obchodu s počítači, který prodává notebooky. Zadávání specifikací počítače pro každý nový notebook by zabralo značné množství času, proto místo toho zahrneme pole pro výběr těchto specifikací podle typů prodávaných počítačů.

Chcete-li do produktů WooCommerce přidat vlastní pole, musíte si na svůj web WordPress nainstalovat bezplatný doplněk Advanced Custom Fields. Zde pak najdete návod, jak jej nastavit…

Advanced Custom FieldsPokročilá vlastní pole

Autor(i): Elliot Condon

Aktuální verze: 5.9.5

Posledně aktualizováno: 11. února 2021

advanced-custom-fields.5.9.5.zip

Podívejte se, jak krok za krokem přidat vlastní pole na stránky produktů WooCommerce:

  1. Vytvořte novou skupinu polí
  2. Přidejte vlastní pole
  3. Konfigurujte další nastavení skupiny polí
  4. Přidejte informace k produktům
  5. Zobrazte informace o vlastním poli na front-endu

Vytvořte novou skupinu polí

V ovládacím panelu WordPress přejděte na novou kartu Vlastní pole. Poté klikněte na tlačítko Přidat nové vedle položky Skupiny polí.

add new custom fields WooCommerce

Pojmenujte skupinu polí. Například „Pole počítače“. Skupina polí je soubor polí, která budete mít pro jeden produkt nebo část webu, například seznam specifikací, které se mají zobrazovat na všech stránkách produktů pro notebooky.

Přidejte vlastní pole (pole)

Klepnutím na tlačítko Přidat pole přidáte pole do této skupiny.

add a field

Vytvořte:

  1. Popisek pole – slouží především pro vaši vlastní referenci.
  2. Název pole – slouží jako písmena, která umístíte do vlastního kódu, nebo v našem případě zkratky. Můžete jej ponechat jako výchozí, který generuje zásuvný modul.
  3. Typ pole – formát, který pro dané pole vytváříte. Můžete si vybrat z možností, jako je výběr data, zaškrtávací políčka, rozevírací seznamy a rádiová tlačítka.

Můžete také vložit nějaké pokyny pro sebe nebo vývojáře spolu s uvedením, zda je toto pole povinné, nebo ne.

required options for custom fields WooCommerce

Pracujete-li s polem, které má více možností (například rádiová tlačítka), budete muset dále přidat pole Volby. Jedná se o možnosti výběru, které chcete zobrazit na zadní straně stránky produktu, například různé procesory jádra.

field choices for custom fields WooCommerce

Zbytek nastavení je obvykle volitelný, například výchozí hodnota, rozložení a to, zda chcete zobrazit hodnotu nebo popisek.

extra settings

Kdykoli jste s polem nebo skupinou hotovi, klikněte na tlačítko Publikovat nebo Aktualizovat, abyste zajistili jejich uložení.

update a field group

Chcete-li do skupiny přidat další pole, klikněte znovu na tlačítko Přidat pole.

Takto to vypadá se čtyřmi poli v této skupině pro:

  • CPU
  • Paměť
  • Operační systém
  • Datum vydání
add field

Konfigurace dalších nastavení skupiny polí

Po dokončení skupiny polí přejděte na modul Umístění. Zde určíte, kde se má skupina polí zobrazovat na ovládacím panelu WordPressu.

Nastavte Typ příspěvku na hodnotu Produkt. Nebo, pokud chcete být konkrétnější, můžete také zvolit konkrétní kategorii produktů.

setting the location of the custom fields WooCommerce

V části Nastavení zkontrolujte, zda je skupina polí aktivní. To vám umožní zobrazit ji na stránkách těchto produktů a případně zobrazit výběr polí svým zákazníkům.

Styl závisí na vašich vlastních preferencích. Totéž lze říci o poloze, umístění štítků a umístění pokynů. To vše jsou osobní preference a to, jak chcete formátovat svůj backend. V případě pochybností je prostě ponechte jako výchozí.

Nastavte číslo objednávky, pokud máte na stránkách produktu zobrazeno více skupin polí. Tím se řídí pořadí, v jakém se různé skupiny polí zobrazují.

Můžete také nastavit popis a skrýt některé podrobnosti na obrazovce.

settings

Přidání informací k produktům

Dále přejděte do editoru produktu, kam chcete přidat vlastní pole.

Jsou-li všechna nastavení správně nakonfigurována, měla by se pod polem s údaji o produktu zobrazit vlastní pole.

Pro náš příklad, pokud byste chtěli přidat novou stránku produktu notebooku, můžete vybrat CPU, Paměť, Operační systém a Datum vydání.

viewing the custom fields WooCommerce

Zobrazení informací z vlastních polí na front-endu

Pro dokončení je třeba zobrazit informace z vlastních polí na front-endu jedné stránky produktu. Tyto informace můžete přidat kamkoli, ale dobrým výchozím místem je dlouhý nebo krátký popis produktu.

Pro zobrazení informací o polích na front-endu použijte zkrácený kód . Název pole přidejte mezi uvozovky:

placing the shortcodes

Název pole pro každé pole najdete v rozhraní editoru skupin polí:

field name - custom fields WooCommerce

Chcete-li vše dokončit, stiskněte tlačítko Publikovat nebo Aktualizovat.

Když otevřete svůj produkt ve front-endu, měli byste vidět svá vlastní pole, do kterých jste přidali zkratky:

frontend product

Nějaké otázky ohledně přidávání vlastních polí?

Výhodou použití Advanced Custom Fields oproti alternativním pluginům pro tvorbu polí je, že svá nová pole můžete umístit na libovolné místo na webu, včetně produktových stránek, příspěvků a modulů košíku – přizpůsobíte si tak ovládací panel a urychlíte proces tvorby obsahu.

Je to skvělá možnost, jak rozšířit svou kreativitu a zjednodušit si únavnou práci s tvorbou produktových stránek.

Chápeme, že doplněk Advanced Custom Fields je trochu náročný na učení, takže pokud máte nějaké nápady nebo dotazy ohledně přidávání vlastních polí ve WooCommerce, dejte nám vědět v komentářích níže!

Můžete se také podívat na náš kompletní návod ACF, kde se dozvíte více o tom, jak tento flexibilní plugin používat.

Bezplatný průvodce

5 základních tipů pro zrychlení webu WordPress

Snížíte dobu načítání i o 50-80 %
jen tím, že se budete řídit jednoduchými tipy.