Advertisement
  1. Code
  2. WooCommerce
Code

Jak nainstalovat a nastavit nové WordPress WooCommerce téma

by
Difficulty:BeginnerLength:LongLanguages:

Czech (Čeština) translation by Karel Krkoska (you can also view the original English article)

WooCommerce je nejoblíbenější a nejvíce přizpůsobitelná platforma eCommerce pro budování vašeho online obchodu. Můžete si zdarma stáhnout WooCommerce, ale jeho opravdovou sílu poznáte až když začnete používat pluginy a témata WordPress WooCommerce.

Ale opravdu potřebujete použít téma WooCommerce?

Ačkoli to není nutné, velmi to doporučuji.

Nejen, že témata WooCommerce jsou eCommerce-centric od návrhu, celé téma je soustředěno kolem stylů WooCommerce. CSS, který WooCommerce používá k určení, jak se produkty zobrazují, je používán tématem WordPress WooCommerce, který skutečně vytáhne vše společně - což činí některé z nejkrásněji navržených e-shopů.

Nemluvě o tom, že instalace a nastavení nového WordPress WooCommerce tématu není o nic obtížnější než nastavení jakékoliv jiné tématu WordPress.

Dovolte mi, abych vám ukázal, jak to udělat.

Jak nainstalovat a nastavit nové WordPress WooCommerce Téma

Pokud už máte WooCommerce nainstalován, je to skvělé! Pokud ne, doporučuji Beginner's Guide to Using WooCommerce od Rachel McCollin. To vás seznámí s WooCommerce a provede vás všemi kroky potřebnými k tomu, abyste se dostali do provozu.

Nyní začneme s návodem na instalaci a nastavení nového tématu WordPress WooCommerce.

Krok 1: Nainstalujte Dummy Data

Pokud jste již produkty přidali do WooCommerce, doporučuji tento krok přeskočit a začít s krokem 2.

Instalace fiktivních dat přidává do obchodního domu fiktivní produkty, které vám pomohou vizualizovat váš obchod s produkty. Po dokončení instalace a nastavení nového tématu WordPress WooCommerce, budete chtít před přidáním svých produktů vymazat všechna fiktivní data. V opačném případě riskujete nechtěné smazání vlastních údajů o produktech.

Falešné údaje jsou součástí pluginu WooCommerce. Pokud jste nainstalovali aplikaci WooCommerce v administrátorovi aplikace WordPress, pokračujte a stáhněte plugin z adresáře Plugin WordPress do počítače. Bude to jednodušší než přihlášení na FTP, přechod do adresáře pluginů a stahování fiktivních dat.

Jakmile je stahování dokončeno, rozbalte soubor, abyste mohli importovat soubor dummy-data.xml.

Přejděte do Tools a klikněte na Import:

How to Install and Setup a New WordPress WooCommerce Theme

Nenechte se "daňové sazby WooCommerce (CSV)" ošálit. To lze provést později, pokud chcete. Pro WooCommerce Dummy Data si budete chtít vybrat WordPress.

How to Install and Setup a New WordPress WooCommerce Theme

Je pravděpodobné, že nebudete mít nainstalovaný WordPress plugin importer, takže si ho nainstalujte nyní.

How to Install and Setup a New WordPress WooCommerce Theme

Jakmile je nainstalován, pokračujte Activate Plugin & Run Importer.

Pamatuješ si, kde jste stáhli a rozbalili plugin WooCommerce? Skvělé! Nyní musíte kliknout na tlačítko Choose File a vyrazit na něj.

How to Install and Setup a New WordPress WooCommerce Theme

Vaše fiktivní data by měla být ve vaší rozbalené složce: (woocommerce.version.number)> woocommerce> dummy-data.

How to Install and Setup a New WordPress WooCommerce Theme

Otevřete složku fiktivních dat, vyberte dummy-data.xml a jste připraveni nahrát soubor a importovat.

To je poslední věc, kterou musíte udělat před importováním všech fiktivních dat.

Některé z nich jsou osobní preference, ale tady je to, co dělám (screenshot níže):

Importovat výchozího autora "wooteam" namísto vytvoření nového autora nebo pomocí předcházejícího autora. Tímto způsobem víte, jaký obsah byl v tomto procesu importován / vytvořen na základě jména autora (doporučuji vymazat autora při odstranění fiktivních dat po dokončení instalace a nastavení nového tématu WordPress WooCommerce).

Doporučuji také, abyste si stáhli a importovali přílohy tak, aby byly k jednotlivým produktům přidruženy obrázky (znovu budete chtít zajistit, aby médium bylo odstraněno, až skončíte s fiktivními údaji).

Jakmile provedete tyto výběry, odešlete:

How to Install and Setup a New WordPress WooCommerce Theme

Navštivte stránku yourwebsite.com/shop/ a měli bystevidět na plně importovaný testovací obchod:

How to Install and Setup a New WordPress WooCommerce Theme

Ano! Zvládli jste to!

Není to moc dobře navržené, že? Je dobře, že nainstalujeme skvělou WordPress WooCommerce šablonu, jako je Savoy.

(POZNÁMKA: Po dokončení instalace a nastavení motivu nezapomeňte produkty a obrázky vymazat z importu fiktivních dat dříve, než začnete přidávat vlastní produkty.)

Krok 2: Nainstalujte téma WordPress WooCommerce

Nyní se podívejme, jak nainstalovat téma WooCommerce. Pokud jste ještě nestáhli WordPress Commerce téma, pokračujte a stáhněte si ho do svého počítače (ujistěte se, že víte, kam ho stahujete, abyste měli přístup).

Existují dva různé způsoby, jak můžete motiv nainstalovat:

  1. Přístup k webu pomocí FTP
  2. Přes správce WordPress

FTP vaše téma

Pokud jste spokojeni s FTP, pokračujte a připojte se k serveru a přejděte do adresáře wp-content> themes. Sem budete chtít umístit svůj motiv. Před odesláním rozbalovaného adresáře na server se však ujistěte, že posíláte svůj motiv. Podíváme se blíže pomocí našeho příkladu tématu WordPress od společnosti ThemeForest.

Po rozbalení vašeho stahování uvidíte, že existuje několik různých složek:

How to Install and Setup a New WordPress WooCommerce Theme

Ne každé stažené téma bude takto zabaleno. Někdy je zabalená složka se složkou tématu. Vždy je dobré to zkontrolovat, protože se to liší v každém stažení.

Savoy - Minimalist AJAX WooCommerce Theme obsahuje některé další věci, jako je dokumentace, zdroje atd. Pokud se podíváte do složky Theme Files pro Savoy, najdete svůj motiv (savoy.zip).

Pokud instalujete pomocí protokolu FTP, pokračujte a nahrajte složku s rozloženými motivy (například: "savoy") do adresáře témat. Pokud si nejste jisti používáním FTP nebo byste raději instalovali z administrátora WordPress, je to v pořádku. Dávám přednost používání Správce WordPressu.

Ze správce WordPress

Instalace šablony WordPress z administrátora vyžaduje, aby byla složka s tématikou zip (themefolder.zip). Jak jsme již dříve diskutovali, budete se chtít ujistit, že pracujete s aktuální složkou motivu a ne se složkou, ve které může být vaše téma zabaleno.

Z Administrátora WordPress klikněte na položku Themes v části Appearance:

How to Install and Setup a New WordPress WooCommerce Theme

Přidat nové téma:

How to Install and Setup a New WordPress WooCommerce Theme

Nahrát téma:

Pamatujete, kde se nachází váš zip soubor?

(Naše příkladové téma má název: savoy.zip)

Klepněte na tlačítko Choose File a přejděte k němu:

Po instalaci můžete navštívit Appearance > Themes v administrátorovi aplikace WordPress, abyste zjistili, zda je nainstalován, nebo klepnutím jej okamžitě aktivovat.

Jak můžete vidět (níže), téma Savoy se úspěšně nainstalovalo a klikněte na Activate:

How to Install and Setup a New WordPress WooCommerce Theme

Nyní, když je váše WordPress WooCommerce téma úspěšně nainstalováno a aktivováno, nastavte jej.

Krok 3: Nastavte téma WordPress WooCommerce

Ne každý motiv je přizpůsoben přesně stejným způsobem. Jak je téma navrženo a vyvíjeno, je důležitým faktorem, takže mohou existovat nějaké rozdíly mezi tímto tutoriálem a tím, s čím se můžete setkat. Obecně řečeno by to ale mělo pomoci při přípravě tématu WordPress WooCommerce - bez ohledu na to, jaký motiv WooCommerce používáte od ThemeForest nebo kdekoliv jinde.

Doporučené / požadované pluginy

Po instalaci a aktivaci tématu Savoy budete upozorněni na doporučené pluginy:

How to Install and Setup a New WordPress WooCommerce Theme

Někdy vaše téma upozorňuje na doporučené pluginy, zatímco jiné obsahují doporučení v jejich dokumentaci. K dispozici mohou být funkce návrhu motivů (například volitelná posuvníky), které nejsou zahrnuty do tématu, ale jsou přizpůsobeny.

Klikněte na možnost Begin installing plugins v tématu Savoy a podívejte se na seznam doporučených pluginů:

How to Install and Setup a New WordPress WooCommerce Theme

Opět se to bude lišit od tématu k tématu, ale v tomto případě můžete nebo nemusíte instalovat všechny.

Například, zatímco Savoy doporučuje Kontaktní formulář 7 a zahrnuje styling pro něj, možná nebudete chtít použít tento plugin pro kontaktní formulář. Možná budete chtít použít něco jako Gravity Forms nebo Ninja Forms.

Plugin jako Regenerate Thumbnails je vynikající plugin pro použití pro ty, kteří mají existující obchod nastaven a mít jejich obrazy nakonfigurovány pro předchozí téma. Tento plugin projde vaší knihovnou WordPress Media Library a změní velikost všech obrázků tak, aby fungovaly s vaším novým tématem. Tuto skutečnost můžete nebo nemusíte chtít provést s fiktivními údaji a tento doplněk můžete zcela přeskočit (doporučuji však, aby se to stalo tak, aby byla všechna média správně dimenzována pro účely testování).

Plugin Envato Toolkit, je však velmi důležitý pro témata zakoupená prostřednictvím programu ThemeForest, což vám zajistí upozornění na aktualizace.

Doporučuji instalovat všechny doporučené pluginy, jakmile začnete. Pokud je nepotřebujete, můžete je kdykoli později odebrat, zatímco pokud nenainstalujete potřebný plugin, můžete být frustrovaní, protože téma "nefunguje" nebo dělá něco, co se vám nelíbí.

Jakmile nainstalujete všechny, některé nebo žádné z doporučených a / nebo požadovaných pluginů, nezapomeňte je aktivovat:

How to Install and Setup a New WordPress WooCommerce Theme

Používáte-li motiv zakoupený v ThemeForest, jako například náš příklad Savoy, nezapomeňte do Envato WordPress Toolkit zadat své uživatelské jméno na Marketplace a tajný klíč API, abyste zajistili správnou aktualizaci témat.

Přizpůsobení

To je část instalace a nastavení vašeho WordPress WooCommerce tématu, které je opravdu zábavné a uvidíte jak vaše webové stránky ožívají.

K aplikaci WordPress Customizer můžete přistupovat z nabídky v aplikaci WordPress: Appearance > Customize. Nebo přejděte na stránku Motivy pod Appearance > Themes a poté klikněte na tlačítko Customize:

How to Install and Setup a New WordPress WooCommerce Theme

Vítejte ve WordPress Customizeru:

How to Install and Setup a New WordPress WooCommerce Theme

Zde je několik kroků, než se dostaneme do detailnější konfigurace.

První věc, kterou uvidíte, je Site Identity. Toto je místo, kde můžete změnit svůj název webu a tagline.

How to Install and Setup a New WordPress WooCommerce Theme

Někdy můžete přidat vlastní obrázek záhlaví a / nebo ikonu webu (toto se bude lišit od tématu k tématu).

Nyní nakonfigurujte vaše menu:

How to Install and Setup a New WordPress WooCommerce Theme

Pokud se jedná o nové nastavení WooCommerce nebo jste nevytvořili žádné stránky, nemusí být pro vás ještě "přizpůsobit". S nainstalovaným WooCommerce se však automaticky přidávaly některé stránky, které si jistě budete chtít přidat do svého menu.

Můžete snadno přidat a vytvořit nové menu:

How to Install and Setup a New WordPress WooCommerce ThemeHow to Install and Setup a New WordPress WooCommerce Theme

Jakmile přidáte menu (nebo několik), můžete vybrat, kam chcete, aby se nabídka zobrazovala, stejně jako různé položky nabídky (například vlastní odkazy, příspěvky, stránky, produkty atd.).

How to Install and Setup a New WordPress WooCommerce Theme

To vám dává spoustu flexibility s tím, jak byste chtěli, aby vaše stránky WooCommerce fungovaly. Nebojte se si s tím hrát nebo to později měnit.

Předtím, než opustíme WordPress Customizer, budete chtít říct WordPress, aby udělal titulní stránku vaše obchodu:

How to Install and Setup a New WordPress WooCommerce Theme

Označit Front page displays  jako A static page a vyberte Front page, aby se zobrazila vaše stránka obchodu. Stránka obchodu byla automaticky vytvořena při instalaci pluginu WooCommerce.

Pokud jde o stránku Posts, závisí to na tom, kde chcete nebo nechcete mít blog na vašem webu WooCommerce. Pokud ano, budete muset vytvořit blogovou stránku a vybrat ji na této stránce WordPress Customizer nebo v WordPress Admin Settings > Reading.

Výsledky

S nějakou základní konfigurací můžete vidět, jak skvěle vypadá váš internetový obchod pomocí tématu WordPress WooCommerce:

How to Install and Setup a New WordPress WooCommerce Theme

Jednotlivé stránky produktů vypadají úžasně:

How to Install and Setup a New WordPress WooCommerce Theme

Zahrnuje dokonce související produkty:

How to Install and Setup a New WordPress WooCommerce Theme

Savoy - Minimalist AJAX WooCommerce Theme umožňuje snadno vyladit mnoho prvků v rámci vašeho webu a může jít daleko za to, čím jsem se zabýval v tomto tutoriálu (nezapomeňte si přečíst dokumentaci vašeho tématu, abyste se dozvěděli více o vašem tématu). Ukázal jsem vám pouze změny, které by mohly být provedeny v rámci programu WordPress Customizer a obvykle se mohou provádět jen na jakémkoli tématu, který byste mohli používat.

Shrnutí

Můžete jasně vidět, jak snadné mohou být tyto první kroky v konfiguraci nového tématu WordPress WooCommerce a jak to vypadá - prostě pomocí tématu WordPress navrženého speciálně pro WooCommerce.

Existuje mnoho užitečných pluginů WordPress WooCommerce dostupných na CodeCanyon a některé krásně navržené a účinné WordPress WooCommerce témata na ThemeForest.

Nejlepé prodávaná témata ThemeForest WooCommerce může být dobré místo pro začátek (Savoy je stále můj oblíbený). Jsem si jistý, že najdete něco, co perfektně vyhovuje vašemu elektronickému obchodu. Nebo si projděte naši předvedenou prezentaci, abyste našli ten správný produkt pro váš obchod:

Co prodávate přes WooCommerce?

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.