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
正しいテーマの作り方 これができたらテーマ制作の上級者!
Search
Shinichi Nishikawa
July 10, 2016
Technology
13
4.2k
正しいテーマの作り方 これができたらテーマ制作の上級者!
WordCamp Kansai 2016 で使ったスライドです:D
Shinichi Nishikawa
July 10, 2016
Tweet
Share
More Decks by Shinichi Nishikawa
See All by Shinichi Nishikawa
Personal Projects run by WordPress
shinichin
0
1.1k
WordCamp Singapore: Offloading Calculations from WordPress onto Outer Services, such as AWS and Google.
shinichin
0
300
第一回バンコクWordPress勉強会 / WordPress Meet-up in Bangkok Vol.1
shinichin
0
800
Other Decks in Technology
See All in Technology
Visualize, Visualize, Visualize and rclone
tomoaki0705
9
83k
Amazon Aurora のバージョンアップ手法について
smt7174
2
150
Potential EM 制度を始めた理由、そして2年後にやめた理由 - EMConf JP 2025
hoyo
2
2.7k
Autonomous Database Serverless 技術詳細 / adb-s_technical_detail_jp
oracle4engineer
PRO
17
45k
自分だけの仮想クラスタを高速かつ効率的に作る kubefork
donkomura
0
100
技術スタックだけじゃない、業務ドメイン知識のオンボーディングも同じくらいの量が必要な話
niftycorp
PRO
0
110
偏光画像処理ライブラリを作った話
elerac
1
170
【5分でわかる】セーフィー エンジニア向け会社紹介
safie_recruit
0
19k
ディスプレイ広告(Yahoo!広告・LINE広告)におけるバックエンド開発
lycorptech_jp
PRO
0
380
依存パッケージの更新はコツコツが勝つコツ! / phpcon_nagoya2025
blue_goheimochi
3
220
【内製開発Summit 2025】イオンスマートテクノロジーの内製化組織の作り方/In-house-development-summit-AST
aeonpeople
2
670
LINE NEWSにおけるバックエンド開発
lycorptech_jp
PRO
0
250
Featured
See All Featured
How GitHub (no longer) Works
holman
314
140k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
59k
Building a Scalable Design System with Sketch
lauravandoore
461
33k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Fireside Chat
paigeccino
34
3.2k
Faster Mobile Websites
deanohume
306
31k
Build your cross-platform service in a week with App Engine
jlugia
229
18k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3k
Stop Working from a Prison Cell
hatefulcrawdad
267
20k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
129
19k
Building Adaptive Systems
keathley
40
2.4k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
27
1.9k
Transcript
“ਖ਼͍͠” ςʔϚͷ࡞Γํ Shinichi Nishikawa WordCamp Kansai 2016 ͜Ε͕Ͱ͖ͨΒςʔϚ੍࡞ͷ্ڃऀ
“ਖ਼͍͠”ʁ
ελϯμʔυ͕͋Γɺ ཧ༝͕͋Γɺ ϝϦοτ͋Δɻ
ࠓͷ ۩ମతʹɺίʔυΛݟͳ͕ΒɺϕετϓϥΫ ςΟεΛֶͼɺࠓޙࣗͰεΩϧΛ্ͯ͠ ͍͚ΔΑ͏ʹɺϦιʔεͦͷௐํΛֶͿɻ
Shinichi Nishikawa @shinichiN
None
͜ͷ3݄·Ͱ
None
3݄͔Β
None
None
None
http://ogi.osampo-radio.com/
ϒϩά http://nskw-style.com
ӳޠ൛ http://th-daily.shinichi.me
ձࣾ http://nobil.cc
Ҡॅϒϩά & Podcast http://thai.osampo-radio.com http://journey.osampo-radio.com
WordPress ͱͷؔ
WordCamp Tokyo 2012 ࣮ߦҕһ
Bangkok WordPress Meetup ্ཱͪ͛ɻӳޠʗλΠޠάϧʔϓɺຊޠάϧʔϓ
WordBench உౡ
WordCamps
ຊͷΰʔϧ
۩ମతʹɺίʔυΛݟͳ͕ΒɺϕετϓϥΫςΟε ΛֶͼɺࠓޙࣗͰεΩϧΛ্͍͚ͯ͠ΔΑ͏ʹɺ ϦιʔεͦͷௐํΛֶͿɻ
ࡢͷςʔϚɺ ʮςʔϚ੍࡞ͷϕετϓϥΫςΟεʯ Ͱɺͦͷ݁ɺ
1. ݟͨʹప͢Δ 2. ͲΜͳϓϥάΠϯͱػೳ͢ΔͨΊͷ࡞๏ΛΔ 3. WordPress ͷػೳΛϑϧ׆༻ 4. ίϯςϯπʹ৮Βͳ͍ Ͱͨ͠ɻ
4ͭͷϕετϓϥΫςΟε http://www.slideshare.net/NSKW/ learning-from-theme-review-requirements
ͦͷଓ͖తͳҐஔ͚ͮͰ͢
େ -> খ ͷॱ൪Ͱ͍͖·͢Ͷ
WordPress ࣗମ͕ ਐԽ͍ͯ͘͠ͷΛΔ
wp_title() ΛΊΔ͜ͱʹͳͬͨ
ςʔϒϧɺ1ݸ૿͑ͨ
wordpress.org/news ָ͕
ςʔϚͷछྨ
ςʔϚͷछྨ • ςʔϚ • ࢠςʔϚ • ελʔλʔςʔϚ • _s •
ϑϨʔϜϫʔΫతͳͷ • roots.io/sage ख़ͯ͠ɺ తʹԠͯ͡ɺ ͍͚͕Ͱ͖ΔΑ͏ʹ
ͨͱ͑ɺɺ ʮ ϚϧναΠτͰࢧళϖʔδΛͨ͘͞Μ࡞Δʯͱ͍͏߹ɺ - ϕʔεʹͳΔςϯϓϨʔτςʔϚΛͰ࡞ - indexͷϖʔδΛࢠςʔϚɺࢧళͷϖʔδΛผͷࢠςʔϚ - ͋Δ͍αΠτಠཱͷςʔϚɺࢧళͷςʔϚΛઃஔ͠ɺ֤ࢧళඞཁʹ Ԡͯ͡ࢠςʔϚΛ࡞ͯࠩ͠ͷΈ࡞Δ
- ػೳશ෦ϓϥάΠϯʹམͱ͜͠ΜͰɺબతʹ༗ޮԽ
ςϯϓϨʔτ֊ ͱ get_template_parts()
ख़͠Α͏ʂ
get_template_parts() ศར
ͨͱ͑ɺ
URL ؔ࿈
ςʔϚͷURI IUUQFYBNQMFDPNXQDPOUFOUUIFNFTNZUIFNFJNHBQOH ͱ͔ XQDPOUFOUUIFNFTNZUIFNFJNHBQOH ͱ͔ॻ͔ͳ͍ɻ ҧ͏ڥ44-Խͨ࣌͠ͱ͔ࠔΔɻ
αΠτͷURL ͱ͔BCPVUͱ͔͠ͳ͍ɻ QIQCMPHJOGP lVSMz ͱ͔͠ͳ͍ɻ
<head />
underscores ͷ head ෦
ۃʹݴ͑ɺ͜ΕͰ͍͚Δ ಈతʹ͢Δ͜ͱͰɺ ͍͍͜ͱ͕͋Δɻ
͍͍͜ͱ • ͲΜͳڥͰಈ͘ • ϓϥάΠϯͱڞଘͰ͖ΔʗίϯϑϦΫτͳ͠ • ϓϥάΠϯࢠςʔϚ͔Βग़ྗΛม͑ΒΕΔ • ʢͳΜ͔ؾ͕͍͍ͪؾ͕͢Δʣ
<head /> Ͱ͓͖͍ͬͯͨ • wp_head() / wp_footer() • wp_enqueue_script /
wp_enqueue_style • wp_register_script / wp_register_style • wp_dequeue_* / wp_deregister_* • wp_add_inline_script / wp_add_inline_style
wp_head() / wp_footer() ͦΕͧΕ</head> ͷલɺ</body>ͷલʹ Կ͔Λग़ྗ͢Δࡍʹ͏ɻ
wp_head() / wp_footer() IFBEʹԿ͔Λग़ྗ͍ͤͨ࣌͞ͳͲʹɻ
wp_head() / wp_footer() ιʔεΛݟΔͱɺͨͩͷEP@BDUJPOͰ͢ɻ
wp_enqueue_script / wp_enqueue_style ͷؒ Javascript, stylesheet ΛಡΈࠐΉͱ͖ʹ͏ɻ ςʔϚͱϓϥάΠϯͷ྆ํ͔Β jQuery ͕ݺΕ
ͨ࣌ɺґଘ͢ΔεΫϦϓτ͕͋ΔࡍͳͲʹศརɻ
wp_enqueue_script / wp_enqueue_style
wp_register_script / wp_enqueue_script
wp_dequeue_script / wp_dequeue_script ࢠςʔϚϓϥάΠϯ͔Βɺ ͢Ͱʹొ͞Ε͍ͯΔ +BWBTDSJQUTUZMFTIFFUΛ আ੶͢Δ࣌ʹ͏ɻ
wp_add_inline_script / wp_add_inline_style
ίΞʹಉࠝ͞Ε͍ͯΔεΫϦϓτ K2VFSZͦͷؒɺ6OEFSTDPSFKT #BDLCPOFKTͳͲ 8PSE1SFTTʹ͡Ί͔Βೖ͍ͬͯͯɺϋϯυϧ໊ͷΈͷ ࢦఆFORVFVFͰಡΈࠐ·ΕΔɻ ͜ΕͰɺ XQJODMVEFTKTKRVFSZKRVFSZKT XQJODMVEFTKTKRVFSZKRVFSZNJHSBUFNJOKT XQJODMVEFTKTKRVFSZVJF⒎FDUNJOKT XQJODMVEFTKTKRVFSZVJF⒎FDUCMJOENJOKT
ͷ͕ͭಡΈࠐ·ΕΔɻ IUUQTEFWFMPQFSXPSEQSFTTPSHSFGFSFODFGVODUJPOTXQ@FORVFVF@TDSJQU
ηΩϡϦςΟ
ςʔϚͰؾΛ͚ͭΔ͜ͱ • ςʔϚݟͨͷ͜ͱͳͷͰɺग़ྗɻʢͭ· ΓɺԿ͔Λอଘ͠ͳ͍ʣ • ͳͷͰɺόϦσʔγϣϯͱΤεέʔϓ͕ओɻ
όϦσʔγϣϯ • ͷݕࠪͷ͜ͱ • ఆͯͨ͠ͷͱҧ͏ͷ͕དྷͯɺڍಈ͕͓͔͘͠ͳ ΔͷΛ͙ • ࣈͳΒࣈɺจࣈྻͳΒจࣈྻɺϝΞυͳΒϝ ΞυͰ͋Δ͜ͱΛ֬ೝ͢Δɻ •
ͦΕ༻ͷؔɺϗϫΠτϦετɺϒϥοΫϦετ ͳͲͷํ๏͕͋ΔͷͰݟͯΈ·͠ΐ͏
ϗϫΠτϦετʗϒϥοΫϦετ • ϗϫΠτϦετ • OKͳ܈ΛϦετ͓͍ͯͯ͠ɺೖྗʢࠓ͔Β ݕࠪ͠Α͏ͱ͍ͯ͠Δରʣ͕ɺ͜ͷϦετʹೖͬ ͍ͯΔ͔Ͳ͏͔Λ֬ೝ͢Δํ๏ • ϒϥοΫϦετ •
NGͳ܈ΛϦετ͓͍ͯͯ͠ɺೖྗ͕͜Εʹ ͋ͨΔ͔Ͳ͏͔Λ֬ೝ͢Δํ๏
ϗϫΠτϦετ
Τεέʔϓ • esc_* ؔΛ͑Δ • wp_kses() Λ֮͑Δ
esc_*()
wp_kses() • ͋Β͔͡Ίఆٛ͞Εͨ html λάͱଐੑͷΈΛ ڐՄ͠ɺͦΕҎ֎ফͯ͠ɺ҆શͳ html จࣈ ྻΛฦ͢ɻ •
ϑΟϧλϦϯάͰ͖Δɻ • a λάΛؚΊ͍͚ͨͲΤεέʔϓ͍ͨ࣌͠ͳͲ ʹศར
ԿΛΤεέʔϓ͢Δͷ͔ • ʮ֎͔Βདྷͨɺ৴པͰ͖ͳ͍શ෦ʯ ͨͱ͑ɺɺɺ • GET POST ͳͲͰૹ৴͞Ε͖ͯͨ
• σʔλϕʔε͔ΒऔΓग़ͨ͠ • RSSϑΟʔυAPIܦ༝ͳͲ֎෦αʔϏε͔ΒऔΓग़͠ ͨ
Ͳ͏Τεέʔϓ͢Δͷ͔ • ͳͥɺecho ͷதͰΤεέʔϓ͠ͳ͍ͷ͔ͱ͍ ͏ͱɺग़ྗ͞ΕΔจ຺ʹΑͬͯɺΤεέʔϓͷ ํ๏͕ҟͳͬͯ͘Δ͔Βɻ • ͳͷͰɺจ຺ʹΑͬͯطଘͷؔΛ͍͚ Δ͜ͱ͕େࣄɻ
ςϯϓϨʔτλά ͱ WordPress ͷؔ ͷҧ͍
ͨͱ͑ɺ • the_content(); ͱ echo get_the_content(); ಉ͡Ͱͳ͍ɻ • echo get_permalink();
ͱ the_permalink(); ಉ͡Ͱͳ͍
the_content() ͱ
the_content ϑΟϧλʔͱ XQJODMVEFTEFGBVMUpMUFSTQIQ
ςϯϓϨʔτλάͱͦͷଞͷؔ • ςϯϓϨʔτλάɺ͍Ζ͍ΖͱؾΛͬͯ ͘Ε͍ͯΔͷͰɺ҆৺͍͍ͯͬͯ͠ɻ the_ Ͱ͡·Δͷ • ͦ͏Ͱͳ͍ͷɺҙ͠ͳ͍ͱࢥΘ͵ڍಈ ʹͳΔ͔͠Εͳ͍ɻϑΟϧλʔΛ௨Βͳ͍ɻ ϓϥάΠϯ͔Βมߋ͕ޮ͍ͯͳ͔ͬͨΓͱ͔
͢Δɻ
ΟδΣοτɺΧελϜߘλΠϓɺΧ ελϜλΫιϊϛɺWP_*_Query ͳͲ ͷొ༻ͷίʔυδΣωϨʔλΛ͏ɻ
generatewp.com
ςʔϚ੍࡞ͷ্ڃऀͱʁ
1. ݟͨʹప͢Δ 2. ͲΜͳϓϥάΠϯͱػೳ͢ΔͨΊͷ࡞๏ΛΔ 3. WordPress ͷػೳΛϑϧ׆༻ 4. ίϯςϯπʹ৮Βͳ͍ Ͱͨ͠ɻ
ڈͷ 4ͭͷϕετϓϥΫςΟε http://www.slideshare.net/NSKW/ learning-from-theme-review-requirements
্ڃऀ • ݟͨʹప͢Δɻcss, Javascript ؤுΔɻ • WordPress తͳॻ͖ํΛΔɻ • ηΩϡϦςΟʹؾΛ͏ɻ
• δΣωϨʔλɺεχϖοτͳͲΛ׆༻͢Δɻ • ࢠςʔϚɺελʔλʔςʔϚɺϑϨʔϜϫʔΫͳͲΛ׆༻͢Δɻ • ػೳϓϥάΠϯʹৡΔɻ PHP ͷଆ໘͔ΒݟΔͱɺ ςʔϚ੍࡞ͱͯ͠Βͳ͍ͱ͍͚ͳ͍͜ͱɺ ࣮ͦΜͳʹͳ͍ɻ
͓͠·͍
Ϧιʔε • wordpress.org/news • developer.wordpress.org/themes/getting- started/ • developer.wordpress.org • ίσοΫε
ͱ codex