Slide 1

Slide 1 text

WordPress Meetup @岡山 #3 「テーマのカスタマイズ」 2019.06.01 WooCommerce のテーマカスタマイズ

Slide 2

Slide 2 text

今日の目次 ▹ WooCommerce について ▹ 公式推奨のカスタマイズ ▹ 公式非推奨のカスタマイズ ▹ WooCommerce の注意点 2

Slide 3

Slide 3 text

HELLO! I am Shohei Tanaka I am here because I love to give presentations. You can find me at @tshowhey 3

Slide 4

Slide 4 text

1. WooCommerce について 基本知識

Slide 5

Slide 5 text

“ WooCommerce ご存知ですか? 5

Slide 6

Slide 6 text

WooCommerce って 開発元 WordPress の開発元 の automattic が開発 世界的シェア 現在、第2位(11%) オープンソース WordPressのカスタマ イズなどが出来る方に は比較的簡単に導入 ができる 6 シェア参考サイト https://trends.builtwith.com/shop/traffic/Entire-Internet

Slide 7

Slide 7 text

2. 公式推奨の カスタマイズ ちょっと技術力が必要

Slide 8

Slide 8 text

公式推奨カスタマイズ ▹ WooCommerce Theme Developer Handbook ■ Using woocommerce_content() ■ Using hooks ■ Declaring WooCommerce Support 8

Slide 9

Slide 9 text

商品ページの例 /plugins/woocommerce/templates/content-sin gle-product.php Action hook ▹ woocommerce_before_single_product ▹ woocommerce_before_single_product_s ummary ▹ woocommerce_single_product_summar y ▹ woocommerce_after_single_product_su mmary ▹ woocommerce_after_single_product 9

Slide 10

Slide 10 text

3. 公式非推奨の カスタマイズ 子テーマを作れたら 比較的簡単。

Slide 11

Slide 11 text

公式非推奨カスタマイズ ▹ WooCommerce Theme Developer Handbook ■ Using template overrides ※WooCommerceのアップデートに伴いテンプレートファ イルが変更されたときに都度対応が必要 11

Slide 12

Slide 12 text

商品ページの例 /plugins/woocommerce/templates/single-prod uct/ Template files ▹ title.php ▹ rating.php ▹ price.php ▹ short-description.php ▹ add-to-cart/simple.php ※ファイルを読み解く必要があるが子テーマを 作った経験があれば比較的理解して作りやすい 12

Slide 13

Slide 13 text

4. WooCommerce の注意点 開発・運営する人たちへの注 意点

Slide 14

Slide 14 text

EC は セキュリティーが大 事 WordPress のセキュリティー対策を 必ず行う。 あと、ステージングサイトの利用。 14

Slide 15

Slide 15 text

15 WordPress コア 常にアップデートをする。 ステージングサイト アップデートチェックのために必要 Plugins & Themes 信頼できるものを利用、アップデート

Slide 16

Slide 16 text

THANKS! Any questions? You can find me at: @tshowhey [email protected] https://wc.artws.info/ WooCommerce 使い方動画 16