Upgrade to Pro — share decks privately, control downloads, hide ads and more …

正しいテーマの作り方 これができたらテーマ制作の上級者！

567e1272bd038860f64c3c1c8dd5dfdb?s=47 Shinichi Nishikawa
July 10, 2016
Technology
13
3.2k

正しいテーマの作り方 これができたらテーマ制作の上級者！

WordCamp Kansai 2016 で使ったスライドです：D

567e1272bd038860f64c3c1c8dd5dfdb?s=128

Shinichi Nishikawa

July 10, 2016
Tweet

More Decks by Shinichi Nishikawa

See All by Shinichi Nishikawa
567e1272bd038860f64c3c1c8dd5dfdb?s=48 shinichin
0
780
567e1272bd038860f64c3c1c8dd5dfdb?s=48 shinichin
0
210
567e1272bd038860f64c3c1c8dd5dfdb?s=48 shinichin
0
730

Other Decks in Technology

See All in Technology
609308e6510e41133d30460eef1ccd36?s=48 no24oka
0
160
9fdb6e5b532d7fa8687faebc4e70a865?s=48 ryysud
0
120
7cd783377515bdf8207062840b7b2f4e?s=48 soracom
0
400
275fa343348e7dd4f5f7abfe09bb19d4?s=48 nishiodens
0
270
3aeee885003e0a7406ba970fb015c4bb?s=48 sakuracloud
0
100
64a4ba69d50590e592cd8e572454daa8?s=48 olegkovalov
1
340
E8ac626646da35420ffba5da02f4787d?s=48 ohsawa0515
0
240
Fccbd625997f63e7b251d9725cb905a5?s=48 futo23
1
1.6k
Cdfff9be12b12849f1eeb94b2196aca5?s=48 chizuchizu
1
260
D8e79ab09f15e69d600c00131bf7d2a9?s=48 yfutamura
0
900
Ddac93a4fdff089ff3c641b7c1d02255?s=48 imdigitallab
0
620
E53046bb9794560f541fcf2cf0b9d526?s=48 sayokomiura
0
520

Featured

See All Featured
20bfe76b3d6105641f879fe45cfc9272?s=48 bkeepers
PRO
322
54k
6804f1775cb4babfcc3851298566fbce?s=48 tanoku
259
24k
282d599b414022eba5096510f675b6e2?s=48 chrislema
173
14k
B6a8f005f39d23ffc930508ac9da68b9?s=48 vanstee
118
4.9k
C86443373fbfe92996aa882d0d7a59f8?s=48 imathis
479
150k
5ce91fa49a613cbc3e20d5f96856473f?s=48 edds
56
9.4k
56c4053438af8e8b90d6f53cbb7573be?s=48 jakevdp
776
200k
15f2b8221f247985a27a627d2ece72f0?s=48 pauljervisheath
195
15k
1f74b13f1e5c6c69cb5d7fbaabb1e2cb?s=48 sferik
612
55k
95d9f37115fbb0d13135d0f77132f856?s=48 morganepeng
22
1.3k
8081b26e05bb4354f7d65ffc34cbbd67?s=48 chriscoyier
146
20k
433acaea1012b25d97ae66da9b998dad?s=48 malarkey
119
16k

Transcript

  1. “ਖ਼͍͠” ςʔϚͷ࡞Γํ Shinichi Nishikawa WordCamp Kansai 2016 ͜Ε͕Ͱ͖ͨΒςʔϚ੍࡞ͷ্ڃऀ

  2. “ਖ਼͍͠”ʁ

  3. ελϯμʔυ͕͋Γɺ ཧ༝͕͋Γɺ ϝϦοτ΋͋Δɻ

  4. ࠓ೔ͷ࿩ ۩ମతʹɺίʔυΛݟͳ͕ΒɺϕετϓϥΫ ςΟεΛֶͼɺࠓޙࣗ෼ͰεΩϧΛ޲্ͯ͠ ͍͚ΔΑ͏ʹɺϦιʔε΍ͦͷௐ΂ํΛֶͿɻ

  5. Shinichi Nishikawa @shinichiN

  6. None

  7. ͜ͷ3݄·Ͱ

  8. None

  9. 3݄͔Β

  10. None
  11. None
  12. None

  13. http://ogi.osampo-radio.com/

  14. ϒϩά http://nskw-style.com

  15. ӳޠ൛ http://th-daily.shinichi.me

  16. ձࣾ http://nobil.cc

  17. Ҡॅϒϩά & Podcast http://thai.osampo-radio.com http://journey.osampo-radio.com

  18. WordPress ͱͷؔ܎

  19. WordCamp Tokyo 2012 ࣮ߦҕһ௕

  20. Bangkok WordPress Meetup ্ཱͪ͛ɻӳޠʗλΠޠάϧʔϓɺ೔ຊޠάϧʔϓ

  21. WordBench உ໦ౡ

  22. WordCamps

  23. ຊ೔ͷΰʔϧ

  24. ۩ମతʹɺίʔυΛݟͳ͕ΒɺϕετϓϥΫςΟε Λֶͼɺࠓޙࣗ෼ͰεΩϧΛ޲্͍͚ͯ͠ΔΑ͏ʹɺ Ϧιʔε΍ͦͷௐ΂ํΛֶͿɻ

  25. ࡢ೥ͷςʔϚ͸ɺ ʮςʔϚ੍࡞ͷϕετϓϥΫςΟεʯ Ͱɺͦͷ݁࿦͸ɺ

  26. 1. ݟͨ໨ʹప͢Δ 2. ͲΜͳϓϥάΠϯͱ΋ػೳ͢ΔͨΊͷ࡞๏Λ஌Δ 3. WordPress ͷػೳΛϑϧ׆༻ 4. ίϯςϯπʹ৮Βͳ͍ Ͱͨ͠ɻ

    4ͭͷϕετϓϥΫςΟε http://www.slideshare.net/NSKW/ learning-from-theme-review-requirements

  27. ͦͷଓ͖తͳҐஔ͚ͮͰ͢

  28. େ -> খ ͷॱ൪Ͱ͍͖·͢Ͷ

  29. WordPress ࣗମ͕ ਐԽ͍ͯ͘͠ͷΛ஌Δ

  30. wp_title() Λ΍ΊΔ͜ͱʹͳͬͨ

  31. ςʔϒϧɺ1ݸ૿͑ͨ

  32. wordpress.org/news ָ͕

  33. ςʔϚͷछྨ

  34. ςʔϚͷछྨ • ਌ςʔϚ • ࢠςʔϚ • ελʔλʔςʔϚ • _s •

    ϑϨʔϜϫʔΫతͳ΋ͷ • roots.io/sage ख़஌ͯ͠ɺ ໨తʹԠͯ͡ɺ ࢖͍෼͚͕Ͱ͖ΔΑ͏ʹ

  35. ͨͱ͑͹ɺɺ ʮ ϚϧναΠτͰࢧళϖʔδΛͨ͘͞Μ࡞Δʯͱ͍͏৔߹ɺ - ϕʔεʹͳΔςϯϓϨʔτ਌ςʔϚΛͰ࡞੒ - indexͷϖʔδΛࢠςʔϚɺࢧళͷϖʔδΛผͷࢠςʔϚ - ͋Δ͍͸਌αΠτ͸ಠཱͷςʔϚɺࢧళͷ਌ςʔϚΛઃஔ͠ɺ֤ࢧళ͸ඞཁʹ Ԡͯ͡ࢠςʔϚΛ࡞੒ͯࠩ͠෼ͷΈ࡞Δ

    - ػೳ͸શ෦ϓϥάΠϯʹམͱ͜͠ΜͰɺબ୒తʹ༗ޮԽ

  36. ςϯϓϨʔτ֊૚ ͱ get_template_parts()

  37. ख़஌͠Α͏ʂ

  38. get_template_parts() ศར

  39. ͨͱ͑͹ɺ

  40. URL ؔ࿈

  41. ςʔϚ΁ͷURI IUUQFYBNQMFDPNXQDPOUFOUUIFNFTNZUIFNFJNHBQOH ͱ͔ XQDPOUFOUUIFNFTNZUIFNFJNHBQOH ͱ͔ॻ͔ͳ͍ɻ ҧ͏؀ڥ΍44-Խͨ࣌͠ͱ͔ࠔΔɻ

  42. αΠτͷURL ͱ͔BCPVUͱ͔͠ͳ͍ɻ  QIQCMPHJOGP lVSMz  ͱ͔͠ͳ͍ɻ

  43. <head />

  44. underscores ͷ head ෦෼

  45. ۃ୺ʹݴ͑͹ɺ͜ΕͰ΋͍͚Δ ಈతʹ͢Δ͜ͱͰɺ ͍͍͜ͱ͕͋Δɻ

  46. ͍͍͜ͱ • ͲΜͳ؀ڥͰ΋ಈ͘ • ϓϥάΠϯͱڞଘͰ͖ΔʗίϯϑϦΫτͳ͠ • ϓϥάΠϯ΍ࢠςʔϚ͔Βग़ྗΛม͑ΒΕΔ • ʢͳΜ͔ؾ΋͕͍͍ͪؾ͕͢Δʣ

  47. <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

  48. wp_head() / wp_footer() ͦΕͧΕ</head> ͷ௚લɺ</body>ͷ௚લʹ Կ͔Λग़ྗ͢Δࡍʹ࢖͏ɻ

  49. wp_head() / wp_footer() IFBE಺ʹԿ͔Λ௚઀ग़ྗ͍ͤͨ࣌͞ͳͲʹɻ

  50. wp_head() / wp_footer() ιʔεΛݟΔͱɺͨͩͷEP@BDUJPOͰ͢ɻ

  51. wp_enqueue_script / wp_enqueue_style ͷ஥ؒ Javascript, stylesheet ΛಡΈࠐΉͱ͖ʹ࢖͏ɻ ςʔϚͱϓϥάΠϯͷ྆ํ͔Β jQuery ͕ݺ͹Ε

    ͨ࣌ɺґଘ͢ΔεΫϦϓτ͕͋ΔࡍͳͲʹศརɻ

  52. wp_enqueue_script / wp_enqueue_style

  53. wp_register_script / wp_enqueue_script

  54. wp_dequeue_script / wp_dequeue_script ࢠςʔϚ΍ϓϥάΠϯ͔Βɺ ͢Ͱʹొ࿥͞Ε͍ͯΔ +BWBTDSJQU΍TUZMFTIFFUΛ আ੶͢Δ࣌ʹ࢖͏ɻ

  55. wp_add_inline_script / wp_add_inline_style

  56. ίΞʹಉࠝ͞Ε͍ͯΔεΫϦϓτ K2VFSZ΍ͦͷ஥ؒɺ6OEFSTDPSFKT #BDLCPOFKTͳͲ͸ 8PSE1SFTTʹ͸͡Ί͔Βೖ͍ͬͯͯɺϋϯυϧ໊ͷΈͷ ࢦఆFORVFVFͰಡΈࠐ·ΕΔɻ ͜ΕͰɺ XQJODMVEFTKTKRVFSZKRVFSZKT XQJODMVEFTKTKRVFSZKRVFSZNJHSBUFNJOKT XQJODMVEFTKTKRVFSZVJF⒎FDUNJOKT XQJODMVEFTKTKRVFSZVJF⒎FDUCMJOENJOKT

    ͷ͕ͭಡΈࠐ·ΕΔɻ IUUQTEFWFMPQFSXPSEQSFTTPSHSFGFSFODFGVODUJPOTXQ@FORVFVF@TDSJQU

  57. ηΩϡϦςΟ

  58. ςʔϚͰؾΛ͚ͭΔ͜ͱ • ςʔϚ͸ݟͨ໨ͷ͜ͱͳͷͰɺग़ྗɻʢͭ· ΓɺԿ͔Λอଘ͠ͳ͍ʣ • ͳͷͰɺόϦσʔγϣϯͱΤεέʔϓ͕ओɻ

  59. όϦσʔγϣϯ • ஋ͷݕࠪͷ͜ͱ • ૝ఆͯͨ͠ͷͱҧ͏ͷ͕དྷͯɺڍಈ͕͓͔͘͠ͳ ΔͷΛ๷͙ • ਺ࣈͳΒ਺ࣈɺจࣈྻͳΒจࣈྻɺϝΞυͳΒϝ ΞυͰ͋Δ͜ͱΛ֬ೝ͢Δɻ •

    ͦΕ༻ͷؔ਺ɺϗϫΠτϦετɺϒϥοΫϦετ ͳͲͷํ๏͕͋ΔͷͰݟͯΈ·͠ΐ͏

  60. ϗϫΠτϦετʗϒϥοΫϦετ • ϗϫΠτϦετ • OKͳ஋܈ΛϦετ͓͍ͯͯ͠ɺೖྗ஋ʢࠓ͔Β ݕࠪ͠Α͏ͱ͍ͯ͠Δର৅ʣ͕ɺ͜ͷϦετʹೖͬ ͍ͯΔ͔Ͳ͏͔Λ֬ೝ͢Δํ๏ • ϒϥοΫϦετ •

    NGͳ஋܈ΛϦετ͓͍ͯͯ͠ɺೖྗ஋͕͜Εʹ ͋ͨΔ͔Ͳ͏͔Λ֬ೝ͢Δํ๏

  61. ϗϫΠτϦετ

  62. Τεέʔϓ • esc_* ؔ਺Λ཈͑Δ • wp_kses() Λ֮͑Δ

  63. esc_*()

  64. wp_kses() • ͋Β͔͡Ίఆٛ͞Εͨ html λάͱଐੑͷΈΛ ڐՄ͠ɺͦΕҎ֎͸ফͯ͠ɺ҆શͳ html จࣈ ྻΛฦ͢ɻ •

    ϑΟϧλϦϯάͰ͖Δɻ • a λάΛؚΊ͍͚ͨͲΤεέʔϓ͍ͨ࣌͠ͳͲ ʹศར

  65. ԿΛΤεέʔϓ͢Δͷ͔ • ʮ֎͔Βདྷͨɺ৴པͰ͖ͳ͍஋͸શ෦ʯ
 
 ͨͱ͑͹ɺɺɺ • GET ΍ POST ͳͲͰૹ৴͞Ε͖ͯͨ஋

    • σʔλϕʔε͔ΒऔΓग़ͨ͠஋ • RSSϑΟʔυ΍APIܦ༝ͳͲ֎෦αʔϏε͔ΒऔΓग़͠ ͨ஋

  66. Ͳ͏Τεέʔϓ͢Δͷ͔ • ͳͥɺecho ͷதͰΤεέʔϓ͠ͳ͍ͷ͔ͱ͍ ͏ͱɺग़ྗ͞ΕΔจ຺ʹΑͬͯɺΤεέʔϓͷ ํ๏͕ҟͳͬͯ͘Δ͔Βɻ • ͳͷͰɺจ຺ʹΑͬͯطଘͷؔ਺Λ࢖͍෼͚ Δ͜ͱ͕େࣄɻ

  67. ςϯϓϨʔτλά ͱ WordPress ͷؔ਺ ͷҧ͍

  68. ͨͱ͑͹ɺ • the_content(); ͱ echo get_the_content();
 ͸ಉ͡Ͱ͸ͳ͍ɻ • echo get_permalink();

    ͱ the_permalink();
 ͸ಉ͡Ͱ͸ͳ͍

  69. the_content() ͱ͸

  70. the_content ϑΟϧλʔͱ͸ XQJODMVEFTEFGBVMUpMUFSTQIQ

  71. ςϯϓϨʔτλάͱͦͷଞͷؔ਺ • ςϯϓϨʔτλά͸ɺ͍Ζ͍ΖͱؾΛ࢖ͬͯ ͘Ε͍ͯΔͷͰɺ҆৺ͯ͠࢖͍͍ͬͯɻ
 the_ Ͱ͸͡·Δ΋ͷ • ͦ͏Ͱͳ͍΋ͷ͸ɺ஫ҙ͠ͳ͍ͱࢥΘ͵ڍಈ ʹͳΔ͔΋͠Εͳ͍ɻϑΟϧλʔΛ௨Βͳ͍ɻ ϓϥάΠϯ͔Βมߋ͕ޮ͍ͯͳ͔ͬͨΓͱ͔

    ͢Δɻ

  72. ΢ΟδΣοτɺΧελϜ౤ߘλΠϓɺΧ ελϜλΫιϊϛɺWP_*_Query ͳͲ ͷొ࿥༻ͷίʔυ͸δΣωϨʔλΛ࢖͏ɻ

  73. generatewp.com

  74. ςʔϚ੍࡞ͷ্ڃऀͱ͸ʁ

  75. 1. ݟͨ໨ʹప͢Δ 2. ͲΜͳϓϥάΠϯͱ΋ػೳ͢ΔͨΊͷ࡞๏Λ஌Δ 3. WordPress ͷػೳΛϑϧ׆༻ 4. ίϯςϯπʹ৮Βͳ͍ Ͱͨ͠ɻ

    ڈ೥ͷ 4ͭͷϕετϓϥΫςΟε http://www.slideshare.net/NSKW/ learning-from-theme-review-requirements

  76. ্ڃऀ • ݟͨ໨ʹప͢Δɻcss, Javascript ؤுΔɻ • WordPress తͳॻ͖ํΛ஌Δɻ • ηΩϡϦςΟʹؾΛ࢖͏ɻ

    • δΣωϨʔλɺεχϖοτͳͲΛ׆༻͢Δɻ • ࢠςʔϚɺελʔλʔςʔϚɺϑϨʔϜϫʔΫͳͲΛ׆༻͢Δɻ • ػೳ͸ϓϥάΠϯʹৡΔɻ PHP ͷଆ໘͔ΒݟΔͱɺ ςʔϚ੍࡞ͱͯ͠஌Βͳ͍ͱ͍͚ͳ͍͜ͱ͸ɺ ࣮͸ͦΜͳʹͳ͍ɻ

  77. ͓͠·͍

  78. Ϧιʔε • wordpress.org/news • developer.wordpress.org/themes/getting- started/ • developer.wordpress.org • ίσοΫε

    ͱ codex