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
5.8k
テーマレビューの現場から見た、抑えておくべきテーマ制作のセオリーと基礎知識
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
3k
Other Decks in Programming
See All in Programming
Modern Functional Fluent CFML REST by Luis Majano
ortus24
0
140
Progressive Web Apps for Rails developers
siaw23
2
540
ビット演算の話 / Let's play with bit operations
kaityo256
PRO
4
170
複数プロダクトの技術改善・クラウド移行に向き合うチームのフレキシブルなペア・モブプログラミングの実践 / Flexible Pair Programming And Mob Programming
honyanya
0
200
DevFest Android in Korea 2024 - 안드로이드의 문단속 : 앱을 지키는 암호화 이야기
mdb1217
1
140
M5Stack に色々な M5ユニットをつないで扱う為の新たなアプローチ
gob
0
210
AWS CDKを用いたセキュアなCI/CDパイプラインの構築 / Build a secure CI/CD pipeline using AWS CDK
seike460
PRO
3
600
pytest プラグインを開発して DRY に自動テストを書こう
inuatsu
2
250
5年分のツケを一気に払った話
soogie
3
1.3k
Subclassing, Composition, Python, and You
hynek
3
130
"noncopyable types" の使いどころについて考えてみた
andpad
0
140
RDBの世界をぬりかえていくモデルグラフDB〜truncus graphによるモデルファースト開発〜
jurabi
0
170
Featured
See All Featured
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9k
Designing on Purpose - Digital PM Summit 2013
jponch
114
6.9k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
37
1.7k
For a Future-Friendly Web
brad_frost
174
9.3k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
4
110
How GitHub Uses GitHub to Build GitHub
holman
473
290k
A Modern Web Designer's Workflow
chriscoyier
692
190k
Code Reviewing Like a Champion
maltzj
519
39k
Documentation Writing (for coders)
carmenintech
65
4.3k
Robots, Beer and Maslow
schacon
PRO
157
8.2k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
31
2.6k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
26
1.3k
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