$30 off During Our Annual Pro Sale. View Details »

最近作ったプラグインをせっかくなので紹介する #wpshinshu / 2019-01-12 WPShinshu

最近作ったプラグインをせっかくなので紹介する #wpshinshu / 2019-01-12 WPShinshu

信州 WordPress Meetup vol.9 登壇資料です。

Toro_Unit (Hiroshi Urabe)

January 12, 2019
Tweet

More Decks by Toro_Unit (Hiroshi Urabe)

Other Decks in Technology

Transcript

  1. ࠷ۙ࡞ͬͨϓϥάΠϯΛ
    ͔ͤͬ͘ͳͷͰ঺հ͢Δ
    Toro_Unit@ Shinshu WP Meetup
    vol.9
    1

    View Slide

  2. $ whoami
    2

    View Slide

  3. Toro_Unit
    ઎෦ ߛ (͏Β΂ ͻΖ͠)
    • Frontend Engineer
    • WordPress Plugin and Theme
    Developer
    Github: @torounit
    Twitter: @Toro_Unit
    3

    View Slide

  4. ࡳຈͷձࣾͰϦϞʔτϫʔΫͯ͠·͢
    4

    View Slide

  5. 5

    View Slide

  6. Contribution
    • WordPress 5.0.1 and 5.1 (Α͍ͯ)
    • WordCamp Kyoto 2017 / Osaka
    2018 / Ogijima 2018 ࣮ߦҕһ
    • WordCamp Osaka 2018 Speaker.
    • etc...
    6

    View Slide

  7. Plugins and Themes
    • Custom Post Type Permalinks
    • Simple Post Type Permalinks
    • Powerful Posts Per Page (PPPP)
    • Smart PWA <- new!
    • Vanilla
    • and more...
    7

    View Slide

  8. ͚͋·͓ͯ͠ΊͰͱ͏͍͟͝·͢ɻ
    8

    View Slide

  9. ೥຤೥࢝Կͯ͠·ͨ͠ʁ
    9

    View Slide

  10. ࣮ՈͰೣٔΕͨΓ
    10

    View Slide

  11. 11

    View Slide

  12. χϡʔΠϠʔӺ఻ݟͨΓ
    ஍ݩ͕܈അݝଠాࢢ
    12

    View Slide

  13. 13

    View Slide

  14. ϓϥάΠϯ࡞ͬͨ
    Γͯ͠·ͨ͠
    14

    View Slide

  15. ΍Δ͜ͱ͕ͳ͗ͯ͢͞…
    15

    View Slide

  16. ࡞ͬͨϓϥάΠϯ
    • Advanced Posts Blocks
    • Advanced Archive Blocks
    • Code Editor Blocks
    • Review Mode
    16

    View Slide

  17. Advanced Posts Blocks
    17

    View Slide

  18. 18

    View Slide

  19. Advanced Posts Blocks
    https://wordpress.org/plugins/advanced-posts-blocks/
    • ʮ࠷৽ͷ౤ߘʯϒϩοΫΛڧԽͨ͠Ϡπͱ͔ͦͷ΄͔΋Ζ΋
    Ζɻ
    • ςʔϚʹPHPϑΝΠϧΛઃஔ͢Δ͜ͱͰݟͨ໨ͷΧελϚΠ
    ζ͕Մೳɻ
    • WEB੍࡞Ͱ͍Ζ͍Ζ࢖ͬͨϒϩοΫΛ·ͱΊͨɻ
    19

    View Slide

  20. Posts Blocks
    • ౤ߘλΠϓɾΧςΰϦʔɾλάɾλΫιϊϛʔ ͰߜΓࠐΜͩ
    ౤ߘҰཡΛදࣔɻ
    • τοϓϖʔδ΍ɺࣄۀ঺հϖʔδͰͷؔ࿈χϡʔεͱ͔ɻ
    20

    View Slide

  21. Post Blocks
    • ಛఆͷ౤ߘΛબΜͰදࣔɻ
    • ؔ࿈هࣄͱ͔Λखಈઃఆ͢Δͱ͖ͱ͔ɻ
    21

    View Slide

  22. Children Blocks
    • ಛఆͷ౤ߘͷࢠϖʔδΛ͢΂ͯදࣔɻ
    • ݻఆϖʔδͳͲͰαϒϝχϡʔΛ࡞ͬͨΓɻ
    22

    View Slide

  23. Advanced Archive Blocks
    23

    View Slide

  24. 24

    View Slide

  25. Advanced Archive Blocks
    https://wordpress.org/plugins/advanced-archive-blocks/
    • ௨ৗͷΞʔΧΠϒϒϩοΫ͸݄ผ͔͠ग़དྷͳ͍ͷͰɺ೥ɾ
    ݄ɾ೔ɾि ͷΞʔΧΠϒ࢖͑ΔΑ͏ʹͨ͠Ϡπɻ
    25

    View Slide

  26. Code Editor Blocks
    26

    View Slide

  27. 27

    View Slide

  28. Code Editor Blocks
    https://wordpress.org/plugins/code-editor-blocks/
    • ΧελϜHTMLϒϩοΫͷϓϨϏϡʔ͕ iframe ͳͷͰɺී௨
    ʹϨϯμϦϯά͢ΔΑ͏ʹͨ͠ɻϝσΟΞΫΤϦʔͳͲ͕ద
    ༻͞Ε͍ͯͯ΋ྑ͍ײ͡ʹϓϨϏϡʔ͢ΔΑ͏ʹɻ
    • λμͷςΩετΤϦΞͰ͸ͳͯ͘ɺΤσΟλʔ(CodeMirror)
    Λ࢖͏Α͏ʹͯ͠ΤϥʔͳͲΛݕ஌Ͱ͖ΔΑ͏ʹɻ
    28

    View Slide

  29. Review Mode
    29

    View Slide

  30. 30

    View Slide

  31. Review Mode
    https://wordpress.org/plugins/review-mode/
    • ϨϏϡʔϞʔυ͕༗ޮʹͳ͍ͬͯΔ৔߹ʹɺެ։ࡁΈʹՃ͑
    ͯʮϨϏϡʔ଴ͪʯͷ౤ߘ΋ؚΊͯදࣔ͢ΔΑ͏ʹ͢Δɻ
    • ϨϏϡʔϞʔυͷઃఆ͸Ϣʔβʔ͝ͱʹɻ΋ͪΖΜϩάΠϯ
    ͍ͯ͠ͳ͍Ϣʔβʔ΍ଞͷϢʔβʔͷը໘ʹ͸Өڹ͠ͳ͍ɻ
    ެ։͍ͨ͠هࣄ͕ΞʔΧΠϒ΍ҰཡͳͲͰͲͷΑ͏ʹݟ͑Δ
    ͷ͔Λ֬ೝ͢ΔͨΊͷϓϥάΠϯɻ
    31

    View Slide

  32. ײ૝
    • ஌ࣝͷ୨Է͠΋݉Ͷͯɺ࢓ࣄͰ࡞ͬͨػೳͰසग़ͨ͠ϠπΛϓϥάΠϯʹɻ
    • খ͞ͳ୯ҐͰϓϥάΠϯʹ͓ͯ͘͠ͱϝϯςφϯε΋ָͰখճΓ΋ޮ͍ͯྑ
    ͍ײ͡ɻ
    • All in One ͳϞϊ͕ྑ͍͔Ͳ͏͔͸έʔεόΠέʔε͚ͩͲɺϒϩοΫप
    Γ͸খ෼͚ʹͨ͠ํ͕࢖͍উखྑͦ͞͏ɻ
    • ৭Μͳػೳ͕ೖͬͯΔϞϊ͸ػೳ͕ڝ߹ͨ͠ͱ͖໘౗͍͘͞ɻ
    • ཉ͍͠΋ͷ͚ͩΠϯετʔϧ͢Ε͹͍͍ɻ
    32

    View Slide

  33. ΧελϜϒϩοΫͷϓϥάΠϯʹ͍ͭͯ
    • Gutenberg ͷιʔείʔυɺಘʹ block-library ลΓͷιʔείʔυΛ໓஡
    ۤ஡ಡΜͩํ͕͍͍ɻ࣮૷ྫͳͲ͕গͳ͍ͷͰιʔεΛಡΉͱࢀߟʹͳΔɻ
    • HOC ౳ɺReact ͷษڧʹ͸ͳΔ͠ɺศརͳϥΠϒϥϦ΋ଟ͍ͷͰ WP API
    Λ࢖͏ͱ͖ʹ໾ʹཱͭ஌͕͍ࣝΖ͍Ζɻ (@wordpress/data,@wordpress/
    api-fetch)
    • ΧελϜϒϩοΫΛҊ݅͝ͱʹຖճ࡞Δͷ͸ຊ౰ʹۤߦɻʢϒϩοΫ͝ͱͷ
    ೖྗͷ࢓༷ܾΊͳͲ͕େมʣ
    • γϯϓϧͳίϯϙʔωϯτΛ࡞ͬͯϓϥάΠϯʹ͓ͯ͘͠ͷ͕ྑ͍ɻ
    33

    View Slide

  34. Thanks!
    Github: @torounit
    Twitter: @Toro_Unit
    Facebook: fb.me/torounit
    Blog: https://torounit.com
    34

    View Slide