WooCommerce Templates. Come usarli.

Francesco Grasso Developer @ YITH Trainer @ Your Inspiration Co-Organizer @ WordPress Meetup Catania WordPress Lover 2 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

oltre 59.552.153 download 3 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

WooCommerce motorizza oltre il 28% di tutti gli store online. 4 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Prerequisiti Per realizzare o personalizzare un tema WooCommerce 5 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Prerequisiti 6 1 WordPress e WooCommerce Installati - Un buon editor per analizzare e scrivere codice Buona conoscenza di HTML e CSS - PHP per modifiche più avanzate 2 Conoscenza base dei template di WooCommerce e gerarchia template WordPress - Action e filter hooks 3 Capacità di apprendere dalle documentazioni e sperimentare 4 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Come dare uno stile unico al proprio sito WooCommerce ? Layout di pagina specifici con elementi nuovi o ordinati diversamente 7 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Tre differenti approcci ● Modifiche CSS ● Aggancio agli action hooks ● Sovrascrittura dei template 8 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Modifiche CSS ● Sovrascrivere le regole di woocommerce.css sul file style.css del tema ● Sovrascrivere le regole di woocommerce.css su un nuovo file appositamente creato ● Rimuovere il foglio di stile di woocommerce 9 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Modifiche CSS Documentazione ufficiale di WooCommerce ● https://docs.woocommerce.com/document/disable-t he-default-stylesheet/ 10 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Action e filter hooks ● Rimuovere porzioni di layout ● Aggiungere nuovi porzioni di layout ● Cambiare il contenuto di porzioni di layout 11 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Action e filter hooks ● Rimuovere porzioni di layout Es. remove_action( 'woocommerce_before_shop_loop_item_title', 'woocommerce_show_product_loop_sale_flash', 10 ); 12 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Action e filter hooks ● Aggiungere nuovi porzioni di layout Es. add_action( 'woocommerce_before_shop_loop_item_title', 'wpcatania_custom_action', 15 ); function wpcatania_custom_action() { echo 'Titolo prodotto:'; } 13 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Action e filter hooks ● https://businessbloomer.com/woocommerce-visual-hook-g uide-single-product-page/ ● https://businessbloomer.com/woocommerce-visual-hook-g uide-archiveshopcat-page/ 14 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Sovrascrittura template I template WooCommerce contengono markup di pagine e sezioni ecommerce del tuo sito (email incluse). Oltre ad elementi html e php, contengono hook e filtri. Utilizzare hook e filtri (dove possibile) è il miglior modo per apportare modificare. 15 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Sovrascrittura template I template possono essere trovati all'interno della directory wp-content/plugins/woocommerce/templates/ 16 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Non modificare mai un template di WooCommerce! 17 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Sovrascrittura template Copia il template di tuo interesse in una directory all’interno del tuo tema chiamata /woocommerce Mantenendo la stessa struttura file e lo stesso nome ma rimuovendo la sottorirectory /templates/ 18 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Sovrascrittura template Es: wp-content/plugins/woocommerce/templates/content-single-product.php Sovrascritto in: wp-content/themes/yourtheme/woocommerce/content-single-product.php 19 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Non rimuovere gli hook di WooCommerce dai template! 20 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Templates Pagina prodotto ● single-product.php ● content-single-product.php ● /single-product/** 21 WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

Place your screenshot here 22 Esempi pratici WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania

23 Thanks! Domande? Slack > @francgrasso Facebook > https://www.facebook.com/francesco.aci Mail > [email protected] WooCommerce Templates: come usarli - Francesco Grasso - WordPress Meetup Catania