Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
WordPress と WooCommerece による ECサイト構築セミナー
Search
Shohei Tanaka
February 24, 2018
Programming
0
75
WordPress と WooCommerece による ECサイト構築セミナー
2018年2月23日開催時資料
Shohei Tanaka
February 24, 2018
Tweet
Share
More Decks by Shohei Tanaka
See All by Shohei Tanaka
Tokyo WordPress Meetup 2022 Fall
shoheitanaka
0
30
WordCampOsaka 2019 - voluntary organization
shoheitanaka
0
220
WordPress Meetup @Shimane #7 「ECサイト開発の注意点と、WooCommerceの導入の利点」
shoheitanaka
0
280
WordPress Meetup Toyama 2019/07/25
shoheitanaka
0
87
WooCommerce による EC サイトの 新しいカタチ
shoheitanaka
0
63
WordPress Meetup @岡山 #3 「WooCommerceテーマのカスタマイズ」
shoheitanaka
0
630
JP_Stripe Okayama 201906 EC in the future
shoheitanaka
1
230
Localization Beyond Translation in E-Commerce Plugins
shoheitanaka
0
36
WooCommerceのテーマカスタマイズ
shoheitanaka
0
110
Other Decks in Programming
See All in Programming
Immutable ActiveRecord
megane42
0
130
GitHub Actions × RAGでコードレビューの検証の結果
sho_000
0
230
昭和の職場からアジャイルの世界へ
kumagoro95
1
330
SwiftUIで単方向アーキテクチャを導入して得られた成果
takuyaosawa
0
250
最近のVS Codeで気になるニュース 2025/01
74th
1
250
iOSエンジニアから始める visionOS アプリ開発
nao_randd
3
110
chibiccをCILに移植した結果 (NGK2025S版)
kekyo
PRO
0
210
Grafana Loki によるサーバログのコスト削減
mot_techtalk
1
110
社内フレームワークとその依存性解決 / in-house framework and its dependency management
vvakame
1
550
Kubernetes History Inspector(KHI)を触ってみた
bells17
0
190
2024年のkintone API振り返りと2025年 / kintone API look back in 2024
tasshi
0
200
時計仕掛けのCompose
mkeeda
1
270
Featured
See All Featured
Building Flexible Design Systems
yeseniaperezcruz
328
38k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
7
620
Building Better People: How to give real-time feedback that sticks.
wjessup
366
19k
Mobile First: as difficult as doing things right
swwweet
223
9.3k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
365
25k
Practical Orchestrator
shlominoach
186
10k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.1k
Keith and Marios Guide to Fast Websites
keithpitt
410
22k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
114
50k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.3k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3k
Bootstrapping a Software Product
garrettdimon
PRO
305
110k
Transcript
WordPress ͱ WooCommerece ʹΑΔ ECαΠτߏஙηϛφʔ 20182݄23
ߨࢣհ ాதɹণฏ WooCommerceͷίΞίϯτϦϏϡʔλʔ WooCommerceͷຊޠฤूऀ WooCommerce for Japanͷ։ൃऀ WordPressٴͼWooCommerceͷϓϥάΠϯ։ൃऀ ECαΠτܦӦܦݧऀʢ࠷େ݄࣌2ԯ5ઍສʣ EC
cube, CS-cart, Magento ։ൃܦݧ͋Γ
ୈҰ෦࣍ 1. ECͷجຊ ཧతͳͱσδλϧσʔλͱαʔϏεΛചΔ ྲྀ࠷ॳʹߟ͑Δඞཁ͕͋Δ ECηΩϡϦςΟʔͱද໋͕ࣔ 2.WooCommerceͷجຊ WordPress͕ແ͍ͱಈ͔ͳ͍جຊͷʮΩʯ WordPressͷϓϥάΠϯͳͷͰɺ৭Μͳࣄ͕࣮Մೳ ੈքͰҰ൪ΘΕ͍ͯΔ͚ͲɺຊͰʁ
3.WooCommerceͷجຊૢ࡞ Πϯετʔϧ͔Βجຊઃఆʢૹྉઃఆʣ ొ จཧ
1. ECͷجຊ ཧతͳとσδλϧσʔλとαʔϏεΛചΔ • ཧతͳͷൢചʢҰൠతͳECʣ • σδλϧσʔλͷൢചʢԻָϑΝΠϧɺը૾ϑΝΠϧɺ ϓϩάϥϜͳͲʣ • αϩϯ॓ധͷ༧͔Βίϯςϯπൢച
1. ECͷجຊ ྲྀ࠷ॳʹߟ͑Δඞཁ͕͋Δ • ૹۀऀͷબผ • ࡏݿͲ͜ͰཧΛ͢Δͷ͔ɻग़ՙۀ୭͕͢Δͷ͔ɻ • ೖՙ͔Βग़ՙ·ͰͷϦʔυλΠϜͲͷ͘Β͍͔ɻ
1. ECͷجຊ &$ηΩϡϦςΟʔͱද໋͕ࣔ • ݸਓใ͕͋Δ͔ΒɺαΠτͷͬऔΓݸਓใͷྲྀ ग़ͱಉ͡ɻ • Ξοϓσʔτඞͣग़དྷΔମ੍ٴͼ։ൃΛߦ͏ɻ • දࣔৗʹҙࣝ͢ΔɻҰൠతʹ2ඵҎԼɻ
2. WooCommerceͷجຊ WordPress が無いと動かない基本の「キ」 • WooCommerce ͨͩͷ WordPress ͷϓϥάΠϯ •
WordPress ͷηΩϡϦςΟʔରࡦ͕ͦͷ··WooCommerce ͷηΩϡϦςΟʔରࡦ • WooCommerce ͷ֦ுػೳWordPressͷϓϥάΠϯ • αΠτͷσβΠϯςʔϚΛར༻WordPress͕ແ͍ͱಈ͔ͳ ͍
2. WooCommerceͷجຊ WordPress のプラグインなので、৭Μͳࣄ͕࣮Մೳ • WordPress ͷϓϥάΠϯͰग़དྷΔ͜ͱͳΜͰग़དྷΔ • action hook
filter hook ͷར༻͕Մೳ • طଘͷϓϥάΠϯซ༻͢Δ͜ͱՄೳ • ͢ͰʹੈքͰඦͷWooCommerceͷػೳ֦ுϓϥάΠ ϯ͕͋Δ
2. WooCommerceͷجຊ 世界で一番使われているけど、日本では? • ੈքͷ40%Ҏ্ͷΦϯϥΠϯγϣοϓͰΘΕ͍ͯΔɻ (stats from Builtwith) • ຊͰ
3,000 αΠτҎ্͕࣮Քಇத • 3લ͔Βຖഒʹͳ͍ͬͯΔ • 2ޙʹ10,000αΠτ͕Քಇ͍ͯ͠Δʢ͔ʁʣ
3. WooCommerceͷجຊૢ࡞ • Πϯετʔϧ͔Βجຊઃఆʢૹྉઃఆʣ • ରԠςʔϚ Storefront ͷઃఆ • ొ
• จཧ • WooCommerce for Japan ͷΠϯετʔϧ
ࢀߟ URL • WooCommerce For Japan • ຊ͚μϛʔσʔλ • WooCommerceެࣜ༗ྉػೳ֦ுϓϥάΠϯ
• ৬ਓͷαΠτ
ୈೋ෦࣍ 4. ςʔϚ࡞ͷجຊ WordPressͷςʔϚ࡞ͱجຊҰॹ WooCommerceಠࣗͷσβΠϯΛςʔϚͰௐ͢Δ ςϯϓϨʔτϑΝΠϧΛৗʹ࠷৽ঢ়ଶ 5.WooCommerce ͷ filter hook
ٴͼ action hook Ճػೳ֦ுػೳϓϥάΠϯΛར༻ ػೳతͳग़དྷΔ͚ͩ functions.php ʹͯ filter hook ͔ action hook Λ͏
4. ςʔϚ࡞ͷجຊ 8PSE1SFTTͷςʔϚ࡞ͱجຊҰॹ • style.css ͳͲ͔Βɺheader.phpͳͲجຊߏҰॹ • ςʔϚͰWooCommerceʹରԠ͍ͯ͠ΔࣄΛએݴ͢Δ • طଘͷςʔϚʢୈࡾऀ࡞ʣ͕͋Δ߹ࢠςʔϚར༻
• action hook ͳͲͰσβΠϯΛ৮Δ͜ͱग़དྷΔ͚Ͳɺج ຊతʹtemplate fileͷར༻ΛΦεεϝ
4. ςʔϚ࡞ͷجຊ 8PP$PNNFSDFಠࣗͷσβΠϯΛςʔϚͰௐ͢Δ • جຊςϯϓϨʔτ /woocommerce/template/ • ςʔϚʹ /your-theme/woocommerce/
ͱ͍͏ϑΥϧμΛ࡞Δ • ςϯϓϨʔτͷ action hook ઈରʹআͨ͠Βμϝɻ • PHP։ൃ͕ग़དྷΔͷͳΒग़དྷΔ͔͗ΓtemplateϑΝΠϧΛ৮ Βͳ͍Α͏ʹ͢ΔɻʢຊՈਪʣ
4. ςʔϚ࡞ͷجຊ ςϯϓϨʔτϑΝΠϧΛৗʹ࠷৽ঢ়ଶ • όʔδϣϯΞοϓͷࡍʹ݁ߏͳසͰมߋ͞ΕΔ • όʔδϣϯΞοϓͷࡍʹςϯϓϨʔτϑΝΠϧ͕ݹ͘ͳͬ ͍ͯͳ͍͔νΣοΫ • ରԠ͠ͳ͍ͱ͑ͳ͍ϓϥάΠϯͳͲ͕ग़ͯ͘Δ
5. WooCommerce ͷ filter hook ٴͼ action hook Ճػೳ֦ுػೳϓϥάΠϯΛར༻ •
ػೳ֦ுϓϥάΠϯଟ͋ΔͷͰɺ·ͣ୳ͦ͏ɻ • جຊతʹެࣜαΠτͷϓϥάΠϯͷํ͕҆৺ɻ • functions.php ͰػೳՃΛ͢Δ߹͔ͬ͠ΓͱཧΛɻ
5. WooCommerce ͷ filter hook ٴͼ action hook ػೳతͳग़དྷΔ͚ͩGVODUJPOTQIQʹͯpMUFSIPPL͔BDUJPOIPPLΛ͏ •
σβΠϯجຊతʹςϯϓϨʔτϑΝΠϧͱCSSͰɻ • javascript ͷίϯϑϦΫτʹҙ͕ඞཁɻ • ػೳ֦ுϓϥάΠϯ͕ແ͍߹functions.phpͰ࣮ɻ
ࢀߟ URL • ςʔϚͷ࡞ - WordPress Codex ຊޠ൛ • ࢠςʔϚ
- WordPress Codex ຊޠ൛ • WooCommerce४ڌςʔϚ࡞ํ๏ʢӳޠʣ WooCommerce 3.0.x Code Reference (API) • WooCommerce ։ൃऀϒϩά • WooCommerce ։ൃGITHUB • WooCommerce ςϯϓϨʔτҰཡ