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
Toshihiro Kanai
September 14, 2018
Programming
1
6k
テーマレビューの現場から見た、抑えておくべきテーマ制作のセオリーと基礎知識
WordCamp Tokyo 2018 に登壇した際の資料です。
詳細は
https://2018.tokyo.wordcamp.org/session/gh-2b/
をご覧ください。
Toshihiro Kanai
September 14, 2018
Tweet
Share
More Decks by Toshihiro Kanai
See All by Toshihiro Kanai
14歳の中学生が WordPressに貢献するようになるまで / WordCamp 2017 LT
mirucon
0
3.1k
Other Decks in Programming
See All in Programming
dbt民主化とLLMによる開発ブースト ~ AI Readyな分析サイクルを目指して ~
yoshyum
3
1.2k
階層化自動テストで開発に機動力を
ickx
1
380
20250708_JAWS_opscdk
takuyay0ne
2
140
チームのテスト力を総合的に鍛えて品質、スピード、レジリエンスを共立させる/Testing approach that improves quality, speed, and resilience
goyoki
5
1.2k
テストから始めるAgentic Coding 〜Claude Codeと共に行うTDD〜 / Agentic Coding starts with testing
rkaga
16
5.9k
PHPUnitの限界をPlaywrightで補完するテストアプローチ
yuzneri
0
250
状態遷移図を書こう / Sequence Chart vs State Diagram
orgachem
PRO
2
240
Claude Code + Container Use と Cursor で作る ローカル並列開発環境のススメ / ccc local dev
kaelaela
12
7.3k
SwiftでMCPサーバーを作ろう!
giginet
PRO
2
180
「App Intent」よくわからんけどすごい!
rinngo0302
1
120
NEWT Backend Evolution
xpromx
1
140
[SRE NEXT] 複雑なシステムにおけるUser Journey SLOの導入
yakenji
0
620
Featured
See All Featured
Code Review Best Practice
trishagee
69
19k
The Cult of Friendly URLs
andyhume
79
6.5k
Why You Should Never Use an ORM
jnunemaker
PRO
58
9.5k
Faster Mobile Websites
deanohume
308
31k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
35
2.4k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
8
710
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.4k
We Have a Design System, Now What?
morganepeng
53
7.7k
A designer walks into a library…
pauljervisheath
207
24k
What's in a price? How to price your products and services
michaelherold
246
12k
Music & Morning Musume
bryan
46
6.7k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
357
30k
Transcript
None
ςʔϚϨϏϡʔͷݱ͔Βݟ ͨɺ͓͖͑ͯ͘ςʔϚ੍࡞ ͷηΦϦʔͱجૅࣝ 8PSE$BNQ5PLZPۚҪढ़ߒ
ࣗݾհ
ۚҪढ़ߒ NJSVDPO • ϑϦʔϥϯεͷ Web ΤϯδχΞ • ࠷ۙ Vue.js ͳͲͷϑϩϯτΤϯυ͕ϝΠ
ϯ • WordPress Core Contributor • WordPress ςʔϚ Coldbox ։ൃऀ • WordPress ςʔϚϨϏϡʔνʔϜϞσϨʔ λ • Twitter: @mirucons / Facebook & GitHub etc.: mirucon • https://www.mirucon.com/
ςʔϚͷجૅ
ςʔϚͱ
ςʔϚͱ ΣϒαΠτશମͷݟ͔ͨΒϨΠΞτɺߏɺػೳ·Ͱ༷ʑͳॴʹӨڹΛ ٴ΅͢ɺ8PSE1SFTTαΠτͷʮΩϞʯ
σΟϨΫτϦߏ • ྫ͑͜Μͳײ͡ : my-theme/ L inc/ L customizer.php L
related-posts.php L footer.php L functions.php L header.php L index.php L readme.txt L screenshot.png L single.php L style.css
ςʔϚͰԿΛ͢Δ͖
ςʔϚͰԿΛ͢Δ͖ • ςʔϚ݁ہϓϥάΠϯͱಉͨͩ͡ͷ PHP ϑΝΠϧͳͷͰɺ Ζ͏ͱࢥ͑ԿͩͬͯͰ͖Δ • ͨͩ͠ςʔϚϓϥάΠϯͱҧͬͯ1͔ͭ͠༗ޮԽͰ͖ͳ͍ • ͦͷͨΊ
WordPress.org ͷςʔϚσΟϨΫτϦͷཁٻࣄ߲Ͱ ʮςʔϚجຊతʹݟͨΛ࢘Δ͜ͱͷΈ͖͢ʯͭ·Γɺ => ݟͨʹؔͳ͍ػೳΛςʔϚʹೖΕΔ͖Ͱͳ͍
ςʔϚͰԿΛ͢Δ͖ • ͨͩ͜͠Ε WordPress.org ͷςʔϚσΟϨΫτϦͷͰ͋Γɺଞͷςʔ ϚαΠτͰҧͬͨΓ͢Δ • ݁ہݸʑͷػೳΛϓϥάΠϯԽ͢ΔͷͱɺςʔϚͰҰݩԽͯͯ͢͠Λ ཧ͢Δͷศར͞ͱͷτϨʔυΦϑ •
·ͨडୗ։ൃͳͲͰػೳࣗମʹ൚༻ੑ͕ͳ͍߹ɾͳΜΒ͔ͷࣄʹ ΑͬͯϓϥάΠϯΛ͍ʹ͍͘߹ͳͲ͋Δ => ࣗͷ੍࡞͍ͯ͠Δతɾެ։ൣғͳͲΛߟ͑ͯɺదͳͱ͜ΖΛߟ͑ Α͏
ϥΠηϯεʹ͍ͭͯ
8PSE1SFTTΦʔϓϯιʔε • WordPress ຊମ͕Φʔϓϯιʔε • GPL ϥΠηϯεΛ༻͍ͯ͠Δ • WordPress ࢥͱͯ͠ʮύϒϦογϯάͷຽओԽ
(Democratize publishing)ʯΛܝ͍͛ͯΔ • ΦʔϓϯιʔεͳͷͰ WordPress ͷ։ൃɾσΟεΧογϣϯɾ ༁ͳͲʹ୭ͰߩݙͰ͖Δ
(1-ϥΠηϯεͱͲΜͳϥΠηϯε͔ • General Public License ͷ಄จࣈΛͱͬͯ "GPL" ͱݺΕΔΦʔ ϓϯιʔεϥΠηϯεͷҰͭ •
͍͔ͳΔ੍ͳ͠ʹແอূͰ4ͭͷࣗ༝ΛೝΊΔͷ͕جຊࢥ
ͭͷࣗ༝ͱ • ͲΜͳతʹ༻͢Δࣗ༝ • ιʔείʔυΛݚڀ͠ɺվม͢Δࣗ༝ • ଞͷਓʹ࠶͢Δࣗ༝ • վมͨ͠ͷΛڞ༗͢Δࣗ༝
࠷େͷಛίϐʔϨϑτ • ίϐʔϨϑτͱɺ੍࡞ͷվม͞ΕͨͷੜϓϩμΫτ (derivative work) ʹɺͱͷ੍࡞ͱಉҰͷࣗ༝ΛೝΊΔ͖ͱ͍͏ߟ͑ํ • WordPress ͷ߹ :
• ͱͷ੍࡞ = WordPress • ੜϓϩμΫτ = ςʔϚɾϓϥάΠϯͳͲ => ͭ·ΓɺWordPress ͕ GPL Ͱ͋ΔݶΓɺ͢Δ࡞ͬͨςʔϚɾϓϥ άΠϯ GPL ʹ͢Δ͕ٛൃੜ͢Δ
͠ͳ͍߹ʹ͍ͭͯ • GPL ͢Δ߹ʹͷΈదԠ͞ΕΔϥΠηϯεͰ͋Γɺ ͠ͳ͍߹ʹ GPL ͰϥΠηϯε͢Δඞཁͳ͍ • ͦΕͰ WordPress
Λ͍ͬͯΔͱ͍͏͜ͱ GPL Λ ͍ͬͯΔͱ͍͏͜ͱͳͷͰɺੋඇօ͞Μʹ͓͍ͬͯͯΒ ͍͍ͨ
ςʔϚͷ࢝Ίํ
ελʔλʔςʔϚ
ελʔλʔςʔϚ • खؒͷ͔͔Δ࠷ॳͷઃఆɺͲΜͳςʔϚͰඞཁʹͳΔΑ͏ ͳίʔυ͕ઃఆࡁΈͷɺ੍࡞ͷͱʹ͢ΔςʔϚ • ྫ͑ : • Sass ͷίϯύΠϧઃఆ
• index.php single.php ͷϧʔϓ (ߘදࣔ෦)
@T VOEFSTDPSFT • Automattic ࣾ (JetPack ϓϥάΠϯͷ։ ൃͳͲΛ͍ͯ͠Δձࣾ) ͷ։ൃ͢Δε λʔλʔςʔϚ
• ͔ͳΓதγϯϓϧͳ PHP ςϯϓ Ϩʔτ + CSS (SCSS) • γϯϓϧʹ͍͑ͨςʔϚʹಛʹ͓͢ ͢Ί
ίʔσΟϯάن
ίʔσΟϯάن • ίʔσΟϯάن ίʔυͷॻ͖ํ ʹ͍ͭͯͷܾ·Γ͝ͱ • WordPress ʹ WordPress Coding
Standards ͱ͍͏ɺ WordPress ઐ༻ͷن͕͋Δ • ͜ΕίʔυͷϑΥʔϚοτ͚ͩͰͳ͘ɺޙͰ৮ΕΔηΩϡϦ ςΟʹؔ͢Δ͜ͱؚ·ΕΔ
8PSE1SFTT$PEJOH4UBOEBSET • ྫ͑ : if (is_single() ){ ͷΑ͏ͳͷΛҎԼͷΑ͏ʹॻ͖͘ͱنఆͰ͖Δ : if
( is_single() ) {
ཱͭͱ͖ • ෳਓ։ൃ͢Δ࣌ʹɺίʔυͷॻ͖ํͷบΛͳͤ͘Δ • Ұਓ։ൃͰɺΞοϓσʔτͷظ͕ۭ͍ؒͯ͠·ͬͨͱ͖Ͱ ίʔυͷ࣭ΛอͯΔ
ηΩϡϦςΟʹ͍ͭͯ
ͳͥηΩϡϦςΟରࡦ͕ඞཁͳͷ͔
ͳͥηΩϡϦςΟରࡦ͕ඞཁͳͷ͔ • ϓϩάϥϜʹʮಛผͳҙຯΛ࣋ͭจࣈྻʯ͕͋ͬͨΓ͢Δ • ·ͨ WordPress Ͱ HTML Λѻ͏͜ͱ͕ଟ͘ɺHTML Λ༻
Ͱ͖Δ = JavaScript Λ༻Ͱ͖Δ ͱ͍͏͜ͱͰ͋Γɺ JavaScript ʹ৭ʑͳ͜ͱ͕Ͱ͖ͯ͠·͏ͨΊɺѱ༻ͷڪΕ͕ ͋Δ
ͳͥηΩϡϦςΟରࡦ͕ඞཁͳͷ͔ ͨͱ͑ɺHTML ͷ͜Μͳจࣈྻ : < > ' " & ͜ΕΒΛڐՄͯ͠͠·͏ͱɺ༧ظ͠ͳ͍ͱ͜ΖͰ
HTML ͕ΘΕ ͯ͠·͏
ΫϩεαΠτεΫϦϓςΟϯά 944 • Ϣʔβʔ͕༧ظ͠ͳ͍ಈ࡞Λ͢Δίʔυ (ಛʹ JavaScript) Λಡ ΈࠐΉ͜ͱ • JavaScript
Ͱ࣮ࡍʹͰ͖ͯ͠·͏͜ͱ : • উखʹଞͷαΠτ (ಛʹΠϧεαΠτͳͲ) ʹసૹ • ߘ༰Λॻ͖͑
େ͖ͭ͘ͷηΩϡϦςΟରࡦ • αχλΠζ => σʔλΛอଘ͢Δͱ͖ʹσʔλΛແԽ = ৴༻Ͱ͖ͳ͍จࣈ ྻΛऔΓআ͘ • Τεέʔϓ
=> σʔλΛग़ྗ͢Δͱ͖ʹಛघจࣈྻΛม͠ಛघจࣈྻͱ͠ ͯͷޮՌΛଧͪফ͢
αχλΠζ
αχλΠζͷྫ • wp_kses() ؔ • ڐՄ͢Δ HTML ͷΫϥεɾଐੑΛࢦఆ͠ɺڐՄ͞Εͳ͍ͷ Λআ͢Δ ྫ͑͜Μͳ
HTML : ͜Μʹͪɺ<br/> <span class="my-class" style="color: red">ۚҪ</span>Ͱ͢ɻ
ී௨ʹදࣔ͢Ε͜͏ͳΔ
ී௨ʹදࣔ͢Ε͜͏ͳΔ
XQ@LTFT ؔΛ͏ͱ wp_kses()ؔΛͬͯ<span>λάͱclassଐੑͷΈΛڐՄ
XQ@LTFT ؔΛ͏ͱ
wp_kses()ؔͷ͍ํ $allowed_html = [ 'span' => [ 'class' => [],
], ]; $data = wp_kses( $data, $allowed_html );
ଞͷ8PSE1SFTTαχλΠζؔ • wp_kses_post() • wp_kses_data() • sanitize_email() • sanitize_file_name() •
sanitize_html_class() • sanitize_text_field()
ςʔϚΧελϚΠβʔͱαχλΠζ $wp_customize->add_setting( 'credit_text', [ 'default' => '©2018 ͜ͷαΠτͷӡӦऀ', 'sanitize_callback' =>
'wp_kses_post', ] ); $wp_customize->add_control( new WP_Customize_Control( $wp_customize, 'credit_text', [ 'label' => __( 'ΫϨδοτΛฤू', 'text-domain' ), 'section' => 'footer', 'type' => 'textarea', ] ) );
Τεέʔϓ
Τεέʔϓͷྫ • esc_html() ؔ => ͯ͢ͷ HTML ΛϓϨʔϯςΩετԽ͢Δ ྫ͑͜Μͳ HTML
: ͜Μʹͪɺ<br/> <span class="my-class" style="color: red">ۚҪ</span>Ͱ͢ɻ
͢Δͱ͜͏ͳΔ
Τεέʔϓͷಈ࡞ • HTML ͷಛघͳจࣈྻΛɺΤεέʔϓจࣈͱݺΕΔಛघͳҙ ຯ͕ແޮԽ͞ΕΔจࣈྻʹஔ͖͑Δ ྫ : < (খͳΓ) =>
< > (େͳΓ) => >
ଞͷ8PSE1SFTTΤεέʔϓؔ • esc_attr() • esc_url() • esc_textarea() • esc_js()
ηΩϡϦςΟରࡦͷίπ
ηΩϡϦςΟରࡦͷίπ • ͯ͢Λٙ͏͜ͱ • αχλΠζ্ͨ͠ͰΤεέʔϓ͕ඞཁͳ͜ͱ͋Δ • WordPress Coding Standards Λ͏
ηΩϡϦςΟରࡦͷίπ8PSE1SFTT$PEJOH 4UBOEBSET
ϝϯςφϯεΛ͘͢͢͠Δʹ
ʮ8PSE1SFTTͷॻ͖ํʯΛ֮͑Δ • WordPress ʹૉͷ PHP ͱҧ͏ʮWordPress తͳॻ͖ํʯ ͕͋Δ • ྫ͑͜ͷΑ͏ͳؔͳͲ
: • get_template_part() • wp_enqueue_script(), wp_enqueue_style()
υΩϡϝϯτΛॻ͘ • ΫϥεɾؔʹۃྗυΩϡϝϯτΛॻ͘ • WordPress Coding Standards Λ͏ͱίϝϯτ͕ൈ͚͍ͯΔ ͱڭ͑ͯ͘ΕΔ •
υΩϡϝϯτͷॻ͖ํͱͯ͠ phpdoc ίϝϯτ ͱ͍͏͕͋Δ
QIQEPDίϝϯτͷॻ͖ํ /** * ࢦఆ͞Εͨͷؔ࿈هࣄΛฦ͢. * * @param int $max_posts දࣔ͢Δ࠷େهࣄ.
* @since 1.0.0 **/ function theme_get_related_posts( $max_posts ) { ...
ςʔϚΛνΣοΫͰ͖ΔπʔϧɾϓϥάΠϯΛ ͏ • ςʔϚϢχοτςετ • Theme Check | WordPress.org •
WPTRT/theme-sniffer: Theme Sniffer plugin using sniffs. • Debug Bar | WordPress.org
8PSE1SFTTPSHςʔϚσΟϨΫ τϦܝࡌʹ͋ͨͬͯ
ཁٻࣄ߲ • WordPress.org ςʔϚσΟϨΫτϦʹ ཁٻࣄ߲ (Requirements) ͱ͍͏ɺܝࡌͷͨΊʹԊΘͳ͍ͱ͍͚ͳ͍ϧʔ ϧ͕͋Δ • ཁٻࣄ߲ͷৄࡉɺRequired
– Theme Review Team — WordPress Λࢀর • ຊޠ༁͋Γ·͢ : https://github.com/mirucon/required-ja
ςʔϚϨϏϡʔνʔϜ୭ͰࢀՃͰ͖Δ • Δؾ͕͋ΔਓͳΒ୭Ͱܴ • ਓͷςʔϚΛݟΔ͜ͱͰࣗͷςʔϚ੍࡞ʹͱͯʹཱͭ • ࠷ऴతʹঝೝͰ͖ΔݖݶݶΒΕͨਓʹ͔͠༩͑ΒΕͯͳ͍ͷ Ͱɺ҆৺ͯ͠ྑ͍
·ͱΊ • ςʔϚ੍࡞ʹɺελʔλʔςʔϚɺWordPress Coding Standards ͳͲศརͳπʔϧ͕ଟ͍ • GPL ϥΠηϯεࣗ༝ΛೝΊΔɺར༻ऀʹ։ൃऀʹ༏͍͠ ϥΠηϯε
• ηΩϡϦςΟʹओʹʮαχλΠζʯͱʮΤεέʔϓʯͰ ରࡦ͢Δ
͋Γ͕ͱ͏͍͟͝·ͨ͠ 5XJUUFS!NJSVDPOT IUUQTXXXNJSVDPODPN