Gutenberg で「かんたん入力機能」~さよなら入力補助としてのカスタムフィールド~

by Yoshiaki Ogata

Slide 1

Slide 1 text

(VUFOCFSHͰʮ͔ΜͨΜೖྗػೳʯʂ d͞ΑͳΒೖྗิॿͱͯ͠ͷΧελϜϑΟʔϧυd (VONB8PSE1SFTT.FFUVQ !ZPTJBLBUTVLJ

Slide 2

Slide 2 text

ࣗݾ঺հ

Slide 3

Slide 3 text

•ඌܗ ٛڿʢ͓͕ͨ Α͖͋͠ʣ •ϑϦʔϥϯε •8PSE1SFTT)5.-$44 •5XJUUFS!ZPTJBLBUTVLJ

Slide 4

Slide 4 text

• 8PSE1SFTTΛ࢖ͬͨ8FCαΠτ੍࡞ • ೥ʹຊΛग़͠·ͨ͠

Slide 5

Slide 5 text

׆ಈ • (VONB8PSE1SFTT.FFUVQʢ܈അݝʣ • 8PSE1SFTT΋͘΋͘ษڧձ!ຊঙʢ࡛ۄݝʣ

Slide 6

Slide 6 text

׆ಈ ϒϩά޲͚ແྉ8PSE1SFTTςʔϚ

Slide 7

Slide 7 text

ࠓ೔͓࿩͢Δ͜ͱ

Slide 8

Slide 8 text

ࠓ೔͓࿩͢Δ͜ͱ •ೖྗิॿͱͯ͠ͷΧελϜϑΟʔϧυ •ʮܾΊΒΕ߲ͨ໨Λೖྗ͢Δ͚ͩʯΛ(VUFOCFSHͰ • ʮ#MPDL-BCʯΛ࢖ͬͯΈΔ •ײ૝

Slide 9

Slide 9 text

ೖྗิॿͱͯ͠ͷΧελϜϑΟʔϧυ

Slide 10

Slide 10 text

ೖྗิॿͱͯ͠ͷΧελϜϑΟʔϧυ ʮදࣔ͞Ε߲ͨ໨Λೖྗ͢Ε͹ϖʔδ͕׬੒ʂʯͳϠπ

Slide 11

Slide 11 text

ೖྗิॿͱͯ͠ͷΧελϜϑΟʔϧυ Α͘࢖ΘΕΔϓϥάΠϯ •"EWBODFE$VTUPN'JFMET •4NBSU$VTUPN'JFMET ͳͲͳͲʜ

Slide 12

Slide 12 text

ೖྗิॿͱͯ͠ͷΧελϜϑΟʔϧυ ʲ࡞ΓࠐΈʳ • ೖྗଆ • ϓϥάΠϯઃఆͳͲ • දࣔଆ • ςϯϓϨʔτϑΝΠϧͷ࡞੒ɾΧελϚΠζ • カスタム投稿タイプとの合わせ技で single-{slug}.php を作ったり

Slide 13

Slide 13 text

ೖྗิॿͱͯ͠ͷΧελϜϑΟʔϧυ ʲ࡞ΓࠐΈʳ • ೖྗଆ • ϓϥάΠϯઃఆͳͲ • දࣔଆ • ςϯϓϨʔτϑΝΠϧͷ࡞੒ɾΧελϚΠζ • カスタム投稿タイプとの合わせ技で single-{slug}.php を作ったり入力とページ全体としての表示が密に関係しがち

Slide 14

Slide 14 text

ʮܾΊΒΕ߲ͨ໨Λೖྗ͢Δ͚ͩʯ Λ(VUFOCFSHͰ

Slide 15

Slide 15 text

(VUFOCFSHͰ؆୯ೖྗ ฤूը໘ʹೖྗ߲໨͕ग़Ε͹͍͍ͱ͍͏Θ͚Ͱ͸ͳ͘ʜ カスタムフィールドも Gutenbergの編集エリアと別に表示されるけど…

Slide 16

Slide 16 text

(VUFOCFSHͰ؆୯ೖྗ ؆୯ೖྗػೳΛϒϩοΫͱͯ͠༻ҙ͍ͨ͠

Slide 17

Slide 17 text

ʮ#MPDL-BCʯΛ࢖ͬͯΈΔ

Slide 18

Slide 18 text

खॱᶃɿϒϩοΫΛఆٛ "EWBODFE$VTUPN'JFMETͳͲͷ࢖͍উ खʹࣅͨײ͡

Slide 19

Slide 19 text

खॱᶄɿ࡞੒ͨ͠ϒϩοΫΛެ։ ೖྗ߲໨Λ֬ఆͨ͠Β࣍͸ςϯϓϨʔτΛ࡞Δ

Slide 20

Slide 20 text

खॱᶅɿςϯϓϨʔτϑΝΠϧΛ࡞੒ •ࢦࣔ͞Ε໊ͨલͷϑΝΠϧΛςʔϚ಺ʹ࡞੒

Slide 21

Slide 21 text

खॱᶆɿදࣔ෦෼Λ࡞੒ ʮCMPDL@GJFMEʯͰೖྗ஋Λදࣔ ˞ͦͷଞͷؔ਺ʹ͍ͭͯ͸Լه IUUQTHJUIVCDPNHFUCMPDLMBCCMPDLMBCXJLJ5FNQMBUF 'VODUJPOT

Slide 22

Slide 22 text

࢖ͬͯΈΔ ϒϩοΫҰཡ͔Β ࡞ͬͨϒϩοΫΛબͿ

Slide 23

Slide 23 text

࢖ͬͯΈΔ ೖྗ߲໨͕දࣔ͞Εͨʂ

Slide 24

Slide 24 text

࢖ͬͯΈΔ දࣔ΋0,ʂ ˞ඞཁʹԠͯ͡)5.-΍$44Λ ੔͑Δ

Slide 25

Slide 25 text

ײ૝

Slide 26

Slide 26 text

ײ૝ • 1)1ͰͷΧελϚΠζ͕Ͱ͖Ε͹ϒϩοΫ࡞ΕΔʂ • ʮ؆୯ʹೖྗ͍͚ͨͩ͠ʯͷղܾࡦͱ͍͍ͯ͠ͷͰ͸ʁ • ೖྗ஋ʹΑͬͯ৚݅෼ذͳͲʹ͸ෆ޲͖

Slide 27

Slide 27 text

ʮ؆୯ʹೖྗ͍͚ͨͩ͠ʯͷղܾࡦͱͯ͠ 難しいことはわからないけどこれならページ更新できる〜 ΧελϜϑΟʔϧυͰೖྗ߲໨Λ༻ҙͨ͠৔߹ʜ ߋ৽୲౰ऀ͕1$ʹ׳Ε͍ͯͳͯ͘΋ ʮ؆୯ͳೖྗͱϘλϯૢ࡞Ͱϖʔδ͕࡞ΕΔʂʯ

Slide 28

Slide 28 text

ʮ؆୯ʹೖྗ͍͚ͨͩ͠ʯͷղܾࡦͱͯ͠ このページにはバナー入れたいあれもしたい！これもしたい！もっと柔軟にページを作れるようにしたい〜 αΠτͷߋ৽࡞ۀʹ׳Εͯ͘Δͱʜ

Slide 29

Slide 29 text

ʮ؆୯ʹೖྗ͍͚ͨͩ͠ʯͷղܾࡦͱͯ͠ ʮͳΜͰ΋ೖΕΒΕΔʯ߲໨͕ ͋Δ೔ಥવ௥Ճ͞ΕΔʂʁ

Slide 30

Slide 30 text

ʮ؆୯ʹೖྗ͍͚ͨͩ͠ʯͷղܾࡦͱͯ͠ ʮͳΜͰ΋ೖΕΒΕΔʯ߲໨͕ ͋Δ೔ಥવ௥Ճ͞ΕΔʂʁ 入力側もなおして、テンプレートもなおさなきゃ… 過去のページへの影響は？…

Slide 31

Slide 31 text

ʮ؆୯ʹೖྗ͍͚ͨͩ͠ʯͷղܾࡦͱͯ͠ • ϒϩοΫͳΒલޙʹίϯςϯπ Λࣗ༝ʹ௥ՃͰ͖Δ • ୲౰ऀͷϨϕϧʹ߹Θͤͯॊೈ ʹϖʔδΛ࡞Γ΍͘͢ͳΔ

Slide 32

Slide 32 text

ʮ؆୯ʹೖྗ͍͚ͨͩ͠ʯͷղܾࡦͱͯ͠ 8PSE1SFTTd ϒϩοΫϚωʔδϟʔΛ׆༻ͯ͠ ࢖͏ϒϩοΫ͚ͩදࣔͤ͞Ε͹ ͞Βʹฤू͠΍͘͢ͳΔʂ ͸ͣ

Slide 33

Slide 33 text

ʮ؆୯ʹೖྗ͍͚ͨͩ͠ʯͷղܾࡦͱͯ͠ ͨͩʜ QBHFYYYQIQ TJOHMFYYYQIQͳ ͲΛ͍͡Δඞཁ͸ͳ͍͕ ߲໨Λ૿΍ͤ͹ςϯϓϨʔτଆ ͷվम͸ඞཁ

Slide 34

Slide 34 text

·ͱΊ

Slide 35

Slide 35 text

·ͱΊ ʮ؆୯ʹೖྗͰ͖Δ࢓૊Έʯ ͱͯ͠ͷΧελϜϑΟʔϧυ͸ ʮ#MPDL-BCʯͰ୅༻Ͱ͖Δ͔΋͠Εͳ͍

Slide 36

Slide 36 text

͓ΘΓ