Save 37% off PRO during our Black Friday Sale! »

カスタムブロック作成手順のベタープラクティス

 カスタムブロック作成手順のベタープラクティス

2021年11月13日(土)にオンライン開催されたMTDDC Meetup TOKYO 2021のセッションで使用したスライドです。

42bb3169f708bebf80653cbce796c311?s=128

Yausufmi Nishiyama

November 13, 2021
Tweet

Transcript

  1. Hello! ΧελϜϒϩοΫ࡞੒खॱͷ ϕλʔϓϥΫςΟε MTDDC Meetup TOKYO 2021

  2. #mtddc ࡾ౓ͷ൧ΑΓ৯΂Δ͜ͱɺ ͦͯ͠ҿΉ͜ͱ͕޷͖ גࣜձࣾδϟΫελϙδγϣϯɹ୅දऔక໾ʗσΟϨΫλʔ ೥݄૑ۀɺ೥݄๏ਓԽʢ๏ਓظ໨ʣ .PWBCMF5ZQFΛϓϥοτϑΥʔϜʹ΢ΣϒαΠτΛߏங ೥ɹ1SP/FUʢγοΫεɾΞύʔτࣾύʔτφʔʣՃໍ ೥ɹ.5՜ҔΛελʔτ ೥ɹ.5%%$.FFUVQ)0,,"*%0։࠵ ೥ɹ.5%%$.FFUVQ)0,,"*%0։࠵

    ੢ࢁɹହ࢙ ʢʹ͠΍·ɹ΍͢;Έʣ
  3. #mtddc σΟϨΫλʔɹ໊ σβΠφʔɹ໊ .5ςϯϓϨʔτΤϯδχΞɹ໊ ओͳۀ຿ ɾ΢ΣϒαΠτߏங ɾ΢ΣϒίϯαϧςΟϯά ɾࣗࣾ։ൃ੡඼ൢച ɾ΢ΣϒγεςϜ։ൃ ɾҹ࡮෺σβΠϯ

  4. #mtddc ࣗࣾϓϩμΫτ4,&-&50/$"35ͷ։ൃɾൢച .5Ϋϥ΢υରԠʂ

  5. #mtddc %ZOBNJD1SFWJFX *NBHF6QMPBE6UJMJUZ .PWBCMF5ZQF༻ϓϥάΠϯͷ։ൃɾൢച

  6. #mtddc %BTICPBSE6UJMJUZGPSNPWBCMFUZQFOFU

  7. #mtddc ຊ೔ͷΞδΣϯμ

  8. #mtddc  ϒϩοΫΤσΟλͱΧελϜϒϩοΫ  σϑΥϧτϒϩοΫͷ)5.-ʹ͋ΘͤΔ͔ 
 σβΠϯ͞Εͨ)5.-ʹ͋ΘͤΔ͔  ΧελϜεΫϦϓτͱNU#MPDL&EJUPS#MPDLT 

    ΧελϜεΫϦϓτΛར༻ͨ͠ 
 ΧελϜϒϩοΫ࡞੒खॱ  ӡ༻͠΍͍͢ϒϩοΫΤσΟλ
  9. #mtddc ϒϩοΫΤσΟλͱΧελϜϒϩοΫ

  10. #mtddc ϒϩοΫΤσΟλͰར༻Ͱ͖ΔϒϩοΫ ϓϦηοτ͞Ε͍ͯΔ΋ͷ ʢσϑΥϧτϒϩοΫʣ ςΩετϒϩοΫ ը૾ ϑΝΠϧ )5.- P&NCFE ܩઢ

    ςʔϒϧ ϚϧνΧϥϜ ΦϦδφϧͰ৽͘͠࡞Δ΋ͷ ʢΧελϜϒϩοΫʣ ΧελϜεΫϦϓτ NU#MPDL&EJUPS#MPDLT
  11. #mtddc σϑΥϧτϒϩοΫͷ)5.-ʹ͋ΘͤΔ͔ 
 σβΠϯ͞Εͨ)5.-ʹ͋ΘͤΔ͔

  12. #mtddc σϑΥϧτϒϩοΫʢྫɿϚϧνΧϥϜʣΛར༻͢Δ <div class="mt-be-columns" style="display: fl ex" > <div class="mt-be-column"

    > <h2>ޗഐ͸ೣͰ͋Δ</h2 > <p>ޗഐ͸ೣͰ͋Δɻ໊લ͸·ͩແ͍ɻͲ͜Ͱɾɾɾɹ</p> </div > <div class="mt-be-column" > <p > <img src="https://example.movabletype.io/.assets/cat.jpg " alt="͵͜͞· " width="640 " height="640 " class="asset asset-image " style="max-width:100%;height:auto;display:block" > </p > </div > </div> )5.-ߏ଄ΛมߋͰ͖ͳ͍ͨΊɺ ͜ͷ)5.-ʹ͋ΘͤͯελΠϧʢσβΠϯʣΛ༻ҙ͢Δ
  13. #mtddc ΧελϜϒϩοΫΛ࢖͍ͨ͘ͳΔ <div class="mt-be-columns" style="display: fl ex" > <div class="mt-be-column"

    > <h2>ޗഐ͸ೣͰ͋Δ</h2 > <p>ޗഐ͸ೣͰ͋Δɻ໊લ͸·ͩແ͍ɻͲ͜Ͱɾɾɾɹ</p> </div > <div class="mt-be-column" > <p > <img src="https://example.movabletype.io/.assets/cat.jpg " alt="͵͜͞· " width="640 " height="640 " class="asset asset-image " style="max-width:100%;height:auto;display:block" > </p > </div > </div> ผͷDMBTTΛೖΕ͍ͨ TUZMFଐੑ͸ආ͚͍ͨ IʹDMBTTΛ௥Ճ͍ͨ͠ ೖΕࢠͷEJWΛ௥Ճ͍ͨ͠ σβΠϯ͞Εͨ)5.-Λ४උ͠ɺ ͦΕʹ͋Θͤͨ)5.-ߏ଄Λ࡞Δ
  14. #mtddc ϒϩοΫΤσΟλͰར༻Ͱ͖ΔϒϩοΫ ϓϦηοτ͞Ε͍ͯΔ΋ͷ ʢσϑΥϧτϒϩοΫʣ ςΩετϒϩοΫ ը૾ ϑΝΠϧ )5.- P&NCFE ܩઢ

    ςʔϒϧ ϚϧνΧϥϜ ΦϦδφϧͰ৽͘͠࡞Δ΋ͷ ʢΧελϜϒϩοΫʣ ΧελϜεΫϦϓτ NU#MPDL&EJUPS#MPDLT ࠓ೔ɺ͓࿩͢Δ෦෼
  15. #mtddc ΧελϜεΫϦϓτͱ NU#MPDL&EJUPS#MPDLT

  16. #mtddc ϒϩοΫΤσΟλͰར༻Ͱ͖ΔϒϩοΫ ϓϦηοτ͞Ε͍ͯΔ΋ͷ ʢσϑΥϧτϒϩοΫʣ ςΩετϒϩοΫ ը૾ ϑΝΠϧ )5.- P&NCFE ܩઢ

    ςʔϒϧ ϚϧνΧϥϜ ΦϦδφϧͰ৽͘͠࡞Δ΋ͷ ʢΧελϜϒϩοΫʣ ΧελϜεΫϦϓτ NU#MPDL&EJUPS#MPDLT
  17. #mtddc ΧελϜεΫϦϓτ NU#MPDL&EJUPS#MPDLT ‣ +BWB4DSJQUͰෳࡶͳՃ޻Λߦ͏͜ͱ͕Ͱ͖Δ ‣ ฤूը໘Ͱ΋ग़ྗͱಉ݁͡ՌΛදࣔ͢Δ͜ͱ͕Ͱ͖Δ ‣ ΧελϜεΫϦϓτΛมߋͯ͠΋ग़ྗͨ͠಺༰͸มߋ͞Εͳ͍ ‣

    .5λάΛ૊Έ߹ΘͤͨΧελϚΠζΛߦ͏͜ͱ͕Ͱ͖Δ ‣ ͭͷιʔε͔Βɺෳ਺ͷग़ྗΛಘΔ͜ͱ͕Ͱ͖Δ ‣ .5.-ͷมߋͰޙ͔Βग़ྗͨ͠಺༰ΛมߋͰ͖Δ
  18. #mtddc ΧελϜεΫϦϓτ NU#MPDL&EJUPS#MPDLT ‣ +BWB4DSJQUͰෳࡶͳՃ޻Λߦ͏͜ͱ͕Ͱ͖Δ ‣ ฤूը໘Ͱ΋ग़ྗͱಉ݁͡ՌΛදࣔ͢Δ͜ͱ͕Ͱ͖Δ ‣ ΧελϜεΫϦϓτΛมߋͯ͠΋ग़ྗͨ͠಺༰͸มߋ͞Εͳ͍ ‣

    .5λάΛ૊Έ߹ΘͤͨΧελϚΠζΛߦ͏͜ͱ͕Ͱ͖Δ ‣ ͭͷιʔε͔Βɺෳ਺ͷग़ྗΛಘΔ͜ͱ͕Ͱ͖Δ ‣ .5.-ͷมߋͰޙ͔Βग़ྗͨ͠಺༰ΛมߋͰ͖Δ K2VFSZͰ΋0, ׬੒ޙ͕ΠϝʔδͰ͖Δ
  19. #mtddc ϒϩοΫΤσΟλͰར༻Ͱ͖ΔϒϩοΫ ϓϦηοτ͞Ε͍ͯΔ΋ͷ ʢσϑΥϧτϒϩοΫʣ ςΩετϒϩοΫ ը૾ ϑΝΠϧ )5.- P&NCFE ܩઢ

    ςʔϒϧ ϚϧνΧϥϜ ΦϦδφϧͰ৽͘͠࡞Δ΋ͷ ʢΧελϜϒϩοΫʣ ΧελϜεΫϦϓτ NU#MPDL&EJUPS#MPDLT ࠓ೔ɺ͓࿩͢Δ෦෼
  20. #mtddc ΧελϜεΫϦϓτΛར༻ͨ͠ 
 ΧελϜϒϩοΫ࡞੒खॱ

  21. #mtddc ΧελϜϒϩοΫͷ৽ن࡞੒ʢجຊʣ

  22. #mtddc αϯϓϧʢ׬੒൛ʣ IUUQTXXXOJKQIJTUPSZPGNUEEDDPNQMFUFIUNM ࠓճ͸.PWBCMF5ZQFOFUͰ࡞੒͠·͢

  23. #mtddc )5.-ΛϒϩοΫ୯Ґʹ෼͚Δ 01 STEP

  24. #mtddc <div class="timeline"> <div class="block"> <div class="year">2010 </div> <div class="detail">

    <dl class="group"> <dt class="month">11.06</dt> <dd class="description"> <a href="http://mtddc.d-s-b.jp/2010/">MTDDC Meetup FUKUSHIMA 2010</a> </dd> </dl> <div class="comment"> <p> Movable Type MTDDC Mee <div class="img-block left"> < fi gure class="img-block__img"> <img src="https://www.ni4.jp/demo_html/2010_fukushima.png" alt="" width="1 </ fi gure> <div class="img-block__text"> MTDDC Meetup FUKUSHIMA 2010 </div> </div> </div> </div> </div> <div class="block"> <div class="year">2011 </div> <div class="detail"> <dl class="group"> <dt class="month">04.16</dt> <dd class="description">MTDDC Meetup NAGOYA 2011</dd> <dt class="month">06.25</dt> <dd class="description"> <a href="https://www.movabletype.jp/blog/mtddc_meetup_tokyo_2011.html">M </dd> </dl>
  25. #mtddc <div class="timeline"> <div class="block"> <div class="year">2010 </div> <div class="detail">

    <dl class="group"> <dt class="month">11.06</dt> <dd class="description"> <a href="http://mtddc.d-s-b.jp/2010/">MTDDC Meetup FUKUSHIMA 2010</a> </dd> </dl> <div class="comment"> <p> Movable Type MTDDC Mee <div class="img-block left"> < fi gure class="img-block__img"> <img src="https://www.ni4.jp/demo_html/2010_fukushima.png" alt="" width="1 </ fi gure> <div class="img-block__text"> MTDDC Meetup FUKUSHIMA 2010 </div> </div> </div> </div> </div> <div class="block"> <div class="year">2011 </div> <div class="detail"> <dl class="group"> <dt class="month">04.16</dt> <dd class="description">MTDDC Meetup NAGOYA 2011</dd> <dt class="month">06.25</dt> <dd class="description"> <a href="https://www.movabletype.jp/blog/mtddc_meetup_tokyo_2011.html">M </dd> </dl>
  26. #mtddc <div class="timeline"> <div class="block"> <div class="year">2010 </div> <div class="detail">

    <dl class="group"> <dt class="month">11.06</dt> <dd class="description"> <a href="http://mtddc.d-s-b.jp/2010/">MTDDC Meetup FUKUSHIMA 2010</a> </dd> </dl> <div class="comment"> <p> Movable Type MTDDC Mee <div class="img-block left"> < fi gure class="img-block__img"> <img src="https://www.ni4.jp/demo_html/2010_fukushima.png" alt="" width="1 </ fi gure> <div class="img-block__text"> MTDDC Meetup FUKUSHIMA 2010 </div> </div> </div> </div> </div> <div class="block"> <div class="year">2011 </div> <div class="detail"> <dl class="group"> <dt class="month">04.16</dt> <dd class="description">MTDDC Meetup NAGOYA 2011</dd> <dt class="month">06.25</dt> <dd class="description"> <a href="https://www.movabletype.jp/blog/mtddc_meetup_tokyo_2011.html">M </dd> </dl> EJWCMPDL
  27. #mtddc Πϕϯτ։࠵೔ͱͦͷ಺༰ ςΩετ ը૾ͱςΩετ ίϝϯτ Πϕϯτ։࠵೥ λΠϜϥΠϯશମ ࡞੒͢ΔϒϩοΫ

  28. #mtddc Πϕϯτ։࠵೔ͱͦͷ಺༰ ςΩετ ը૾ͱςΩετ ίϝϯτ Πϕϯτ։࠵೥ λΠϜϥΠϯશମ ࡞੒͢ΔϒϩοΫ ಉ͡೥ͷผͷ೔ʹ Πϕϯτ͕։࠵͞Ε͍ͯΔ

    ը૾഑ஔ͕ύλʔϯ͋Δ
  29. #mtddc ϒϩοΫ୯ҐͰΧελϜϒϩοΫΛ࡞Δ 02 STEP

  30. #mtddc ಺ଆ͔Β࡞͍ͬͯ͘ Πϕϯτ։࠵೔ͱͦͷ಺༰ ςΩετ ը૾ͱςΩετ ίϝϯτ Πϕϯτ։࠵೥ λΠϜϥΠϯશମ

  31. #mtddc <div class="timeline"> <div class="block"> <div class="year">2010 </div> <div class="detail">

    <dl class="group"> <dt class="month">11.06</dt> <dd class="description"> <a href="http://mtddc.d-s-b.jp/2010/">MTDDC Meetup FUKUSHIMA 2010</a> </dd> </dl> <div class="comment"> <p> Movable Type MTDDC Mee <div class="img-block left"> < fi gure class="img-block__img"> <img src="https://www.ni4.jp/demo_html/2010_fukushima.png" alt="" width="1 </ fi gure> <div class="img-block__text"> MTDDC Meetup FUKUSHIMA 2010 </div> </div> ᶃΠϕϯτ։࠵೔ͱͦͷ಺༰
  32. #mtddc ᶃΠϕϯτ։࠵೔ͱͦͷ಺༰

  33. #mtddc ᶃΠϕϯτ։࠵೔ͱͦͷ಺༰ ϒϩοΫɿςΩετ આ໌ɹɹɿ։࠵೔ Ϋϥε໊ɿNPOUI ϙΠϯτ ςΩετͷϒϩοΫཁૉͷλά͸ Q IʙI QSF͔Βબ୒

  34. #mtddc ᶃΠϕϯτ։࠵೔ͱͦͷ಺༰ ϒϩοΫɿςΩετϒϩοΫ આ໌ɹɹɿͰ͖͝ͱ Ϋϥε໊ɿEFTDSJQUJPO ϙΠϯτ ςΩετϒϩοΫ͸ ϒϩοΫཁૉ΍૷০Λ ೖྗ࣌ʹઃఆՄೳ

  35. #mtddc ᶃΠϕϯτ։࠵೔ͱͦͷ಺༰ ։࠵೔ͱͰ͖͝ͱɺ͋Γ·͢ʢݟ͑ͳ͍͚Ͳʣ

  36. #mtddc <dl class="group"> <dt class="month">11.06</dt> <dd class="description"> <a href="http://mtddc.d-s-b.jp/2010/">MTDDC Meetup

    FUKUSHIMA 2010</a> </dd> </dl> <div class="comment"> <p> Movable Type MTDDC Mee <div class="img-block left"> < fi gure class="img-block__img"> <img src="https://www.ni4.jp/demo_html/2010_fukushima.png" alt="" width="1 </ fi gure> <div class="img-block__text"> MTDDC Meetup FUKUSHIMA 2010 </div> </div> </div> </div> </div> <div class="block"> <div class="year">2011 </div> <div class="detail"> <dl class="group"> <dt class="month">04.16</dt> ᶄίϝϯτ಺ͷςΩετͱը૾
  37. #mtddc ᶄίϝϯτ಺ͷςΩετ ϒϩοΫɿςΩετϒϩοΫ આ໌ɹɹɿͳ͠ Ϋϥε໊ɿͳ͠ ϙΠϯτ

  38. #mtddc ᶄίϝϯτ಺ͷը૾ ϒϩοΫɿυϩοϓμ΢ϯ આ໌ɹɹɿը૾ͷ഑ஔ Ϋϥε໊ɿQPTJUJPO ΦϓγϣϯɿOPOF SJHIU MFGU ϙΠϯτ

  39. #mtddc ᶅίϝϯτ಺ͷը૾ ϒϩοΫɿυϩοϓμ΢ϯ આ໌ɹɹɿը૾ͷ഑ஔ Ϋϥε໊ɿQPTJUJPO ϙΠϯτ

  40. #mtddc ᶄίϝϯτ಺ͷը૾ ϒϩοΫɿը૾ આ໌ɹɹɿͳ͠ Ϋϥε໊ɿJNHCMPDL@@JNH ϙΠϯτ

  41. #mtddc ᶄίϝϯτ಺ͷը૾ ϒϩοΫɿςΩετϒϩοΫ આ໌ɹɹɿͳ͠ Ϋϥε໊ɿJNHCMPDL@@UFYU ϙΠϯτ

  42. #mtddc ᶄίϝϯτ಺ͷը૾ ίϯςφཁૉͰแΉɿ0/ Ϋϥε໊ɿJNHCMPDL ϙΠϯτ <div class="img-block left"> < fi

    gure class="img-block__img"> <img src="https://www.ni4.jp/demo_html/ </ fi gure> <div class="img-block__text"> MTDDC Meetup FUKUSHIMA 2010 </div> </div>
  43. #mtddc <dl class="group"> <dt class="month">11.06</dt> <dd class="description"> <a href="http://mtddc.d-s-b.jp/2010/">MTDDC Meetup

    FUKUSHIMA 2010</a> </dd> </dl> <div class="comment"> <p> Movable Type MTDDC Mee <div class="img-block left"> < fi gure class="img-block__img"> <img src="https://www.ni4.jp/demo_html/2010_fukushima.png" alt="" width="1 </ fi gure> <div class="img-block__text"> MTDDC Meetup FUKUSHIMA 2010 </div> </div> </div> </div> </div> <div class="block"> <div class="year">2011 </div> <div class="detail"> <dl class="group"> <dt class="month">04.16</dt> ᶅίϝϯτ
  44. #mtddc ᶅίϝϯτ ίϯςφཁૉͰแΉɿ0/ Ϋϥε໊ɿDPNNFOU ϒϩοΫͷ௥Ճͱ࡟আɿ0/ ϙΠϯτ ௥ՃՄೳͳϒϩοΫ ɾςΩετ ɾը૾

  45. #mtddc <div class="timeline"> <div class="block"> <div class="year">2010 </div> <div class="detail">

    <dl class="group"> <dt class="month">11.06</dt> <dd class="description"> <a href="http://mtddc.d-s-b.jp/2010/">MTDDC Meetup FUKUSHIMA 2010</a> </dd> </dl> <div class="comment"> <p> Movable Type MTDDC Mee <div class="img-block left"> < fi gure class="img-block__img"> <img src="https://www.ni4.jp/demo_html/2010_fukushima.png" alt="" width="1 </ fi gure> <div class="img-block__text"> MTDDC Meetup FUKUSHIMA 2010 </div> </div> ᶆΠϕϯτ։࠵೥
  46. #mtddc ᶆΠϕϯτ։࠵೥ ϙΠϯτ ϒϩοΫɿςΩετ આ໌ɹɹɿ։࠵೥ Ϋϥε໊ɿZFBS

  47. #mtddc ᶆΠϕϯτ։࠵೥ ϙΠϯτ ௥ՃՄೳͳϒϩοΫ ɾ݄೔ ɾίϝϯτ ίϯςφཁૉͰแΉɿ0/ Ϋϥε໊ɿCMPDL ϒϩοΫͷ௥Ճͱ࡟আɿ0/

  48. #mtddc ᶆΠϕϯτ։࠵೥ ϙΠϯτ ௥ՃՄೳͳϒϩοΫ ɾ݄೔ ɾίϝϯτ ίϯςφཁૉͰแΉɿ0/ Ϋϥε໊ɿCMPDL ϒϩοΫͷ௥Ճͱ࡟আɿ0/ <div

    class="timeline"> <div class="block"> <div class="year">2010 </div> <div class="detail"> <dl class="group"> <dt class="month">11.06</dt> <dd class="description"> <a href="http://mtddc.d-s-b.jp/2010/">MTDDC Meetup FUKUSH </dd> </dl> <div class="comment"> <p> Movable Type <div class="img-block left"> < fi gure class="img-block__img"> <img src="https://www.ni4.jp/demo_html/2010_fukushima.pn </ fi gure> <div class="img-block__text"> MTDDC Meetup FUKUSHIMA 2010 </div> </div>
  49. #mtddc <div class="timeline"> <div class="block"> <div class="year">2010 </div> <div class="detail">

    <dl class="group"> <dt class="month">11.06</dt> <dd class="description"> <a href="http://mtddc.d-s-b.jp/2010/">MTDDC Meetup FUKUSHIMA 2010</a> </dd> </dl> <div class="comment"> <p> Movable Type MTDDC Mee <div class="img-block left"> < fi gure class="img-block__img"> <img src="https://www.ni4.jp/demo_html/2010_fukushima.png" alt="" width="1 </ fi gure> <div class="img-block__text"> MTDDC Meetup FUKUSHIMA 2010 </div> </div> ᶇλΠϜϥΠϯશମ
  50. #mtddc ᶇλΠϜϥΠϯશମ ϙΠϯτ ௥ՃՄೳͳϒϩοΫ ɾ೥ ίϯςφཁૉͰแΉɿ0/ Ϋϥε໊ɿUJNFMJOF ϒϩοΫͷ௥Ճͱ࡟আɿ0/

  51. #mtddc ΧελϜϒϩοΫͷʮೖΕࢠߏ଄ʯ 03 STEP

  52. #mtddc ͜͜·Ͱ࡞ͬͨϒϩοΫΛ࢖ͬͯΈΑ͏

  53. #mtddc ౤ߘઃఆ

  54. #mtddc ౤ߘઃఆ ʮϒϩοΫΤσΟλͷදࣔઃఆʯʹ͋Δ ʮ΢Σϒϖʔδʯͷ෦෼Ͱ ʮλΠϜϥΠϯʯͷΈΛ0/ʹ͢Δ

  55. #mtddc ΢Σϒϖʔδͷ࡞੒ ΢ΣϒϖʔδͰ࢖͑ΔϒϩοΫ͸ ʮλΠϜϥΠϯʯͷΈͳͷͰɺ ௥ՃϘλϯʹ͸͜ͷΑ͏ʹදࣔ͞ΕΔ

  56. #mtddc ΢Σϒϖʔδͷ࡞੒ λΠϜϥΠϯͷϒϩοΫͰ ௥ՃͰ͖Δͷ͸೥ͷϒϩοΫͷΈ

  57. #mtddc ΢Σϒϖʔδͷ࡞੒ λΠϜϥΠϯͷϒϩοΫʹ௥ՃͰ͖ΔͷΛ ೥ͷϒϩοΫ͚ͩʹઃఆ͓͍ͯͨͨ͠Ί

  58. #mtddc ΢Σϒϖʔδͷ࡞੒ ։࠵೥ͷϒϩοΫͰ ௥ՃͰ͖Δͷ͸݄೔ͱίϝϯτͷΈ

  59. #mtddc ΢Σϒϖʔδͷ࡞੒ ଓ͍ͯίϝϯτͷϒϩοΫΛ௥Ճ

  60. #mtddc ΢Σϒϖʔδͷ࡞੒ ίϝϯτͷϒϩοΫͰ ௥ՃͰ͖Δͷ͸ςΩετͱը૾ͷϒϩοΫͷΈ

  61. #mtddc ΢Σϒϖʔδͷ࡞੒ ֤ϒϩοΫʹೖྗ͍ͯ͘͠

  62. #mtddc ΢Σϒϖʔδͷ࡞੒ ͜ͷঢ়ଶ͔ΒϓϨϏϡʔ͢Δͱɾɾɾ

  63. #mtddc $44͕ਖ਼͘͠ద༻͞Ε͍ͯͳ͍

  64. #mtddc <div class="timeline"> <div class="block"> <p class="year">2010 </p> <p class="month">11.06</p>

    <p class="description"> <a href="http://mtddc.d-s-b.jp/2010/">MTDDC Meetup FUKUSHIMA 2010</a> </p> <div class="comment"> <p> Movable Type MTDDC Meetup <div class="img-block"> <p class="position">left</p> <p class="img-block__img"> <img src="https://www.ni4.jp/.assets/2010_fukushima.png" alt="" width="1099" height="685" class="asset a </p> <p class="img-block__text"> MTDDC Meetup FUKUSHIMA 2010 80 <br> <br> <a href="http://mtddc.d-s-b.jp/2010/report/">MTDDC Meetup FUKUSHIMA </a> </p> )5.-λά͕ҧ͏͔ΒɺελΠϧ͕ద༻͞Εͳ͍ ϒϩοΫͷλά͕ҧ͏ ඞཁͳϒϩοΫ͕ͳ͍
  65. #mtddc ΧελϜεΫϦϓτΛॻ͘ 04 STEP

  66. #mtddc ΧελϜεΫϦϓτΛॻ͘ λΠΠϜϥΠϯͷϒϩοΫʹ ·ͱΊͯεΫϦϓτΛॻ͘ ʢೖΕࢠߏ଄ͷ৔߹ɺ਌ϒϩοΫʹॻ͘ʣ

  67. #mtddc <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="*****************************************" crossorigin="anonymous"></script> <script> $(function(){ if (document.body.dataset.hasCompiledHtml) {

    return; } // HTML var html = document.querySelector('.timeline').outerHTML; MTBlockEditorSetCompiledHtml(html); }); </script> ΧελϜεΫϦϓτΛॻ͘ ࢲ͕͍ͭ΋࢖͏ςϯϓϨʔτ +BWB4DSJQU ɾK2VFSZΛ࢖༻ ɾ਌ϒϩοΫͷ)5.-Λ·Δͬͱग़ྗ ɹͪͳΈʹɺࢲͷ+BWB4DSJQUεΩϧ͸௿͍Ͱ͢ʜ
  68. #mtddc // $('.year').replaceWith(function() { var year = $(this).text(); $(this).replaceWith('<div class="year">'

    + year + '</div>') }); // $('img').removeAttr('style class'); $('.img-block__img').replaceWith(function() { var img = $(this).html(); $(this).replaceWith('< fi gure class="img-block__img">' + img + '</ fi gure>') }); ࠓճॻ͍͍ͯΔ಺༰ʢൈਮʣ QλάΛEJW΍ fi HVSFʹஔ͖׵͑ TUZMFଐੑ΍DMBTTଐੑΛ࡟আ
  69. #mtddc // $('.img-block').each(function(){ var position = $(this). fi nd('.position').text(); $(this).addClass(position);});

    $('.position').remove(); // $('.block').wrapInner('<div class="detail">'); $('.detail').wrapInner('<dl class="group">'); // $('.block').each(function(){ $(this). fi nd('.year').insertBefore($(this). fi nd(".detail")); }); $('.block').each(function(){ $(this). fi nd('.comment').insertAfter($(this). fi nd(".group")); }); ࠓճॻ͍͍ͯΔ಺༰ʢൈਮʣ ը૾഑ஔ༻ͷDMBTTΛ਌ϒϩοΫʹ͚ͭΔ ϒϩοΫͰғͬͨΓɺॱংΛೖΕସ͑ͨΓ
  70. #mtddc ͋ΒͨΊͯ΢Σϒϖʔδͷฤूը໘Λ։͘ ϓϨϏϡʔʹ΋൓ө͞ΕΔͷͰ ͏·͘ಈ͔ͳͯ͘΋ ։ൃऀπʔϧͰ֬ೝͰ͖Δ

  71. #mtddc ͜͜·Ͱͷ಺༰ͰϓϨϏϡʔͯ͠ΈΔ

  72. #mtddc <div class="timeline"> <div class="block"> <div class="year">2010 </div> <div class="detail">

    <dl class="group"> <dt class="month">11.06</dt> <dd class="description"> <a href="http://mtddc.d-s-b.jp/2010/">MTDDC Meetup FUKUSHIMA 2010</a> </dd> </dl> <div class="comment"> <p> Movable Type MTDDC Meetup <div class="img-block left"> < fi gure class="img-block__img"> <img src="https://www.ni4.jp/.assets/2010_fukushima.png?" alt="" width="1099" height="685"> </ fi gure> <div class="img-block__text"> MTDDC Meetup FUKUSHIMA 2010 80 <br> <br> )5.-λά͕ॻ͖׵͑ΒΕɺελΠϧ͕ద༻͞Ε͍ͯΔ ਖ਼͍͠ϒϩοΫͷλά ඞཁͳϒϩοΫ͕ἧ͏
  73. #mtddc ฤूը໘ͰͷϓϨϏϡʔͱΤσΟλ$44 05 STEP

  74. #mtddc ͜ͷ··Ͱ΋ྑ͍͚ΕͲɺݟͨ໨͕ҧ͏ͷͰΘ͔Γʹ͍͘

  75. #mtddc ؅ཧը໘ͷΤσΟλʹద༻Ͱ͖Δ$44Λ௥Ճ IUUQTNPWBCMFUZQFOFUTVQQPSUEFTJHOFEJUDTTIUNM ৄ͘͠͸ʮΤσΟλ$44Λར༻͢ΔʯΛࢀর

  76. #mtddc ؅ཧը໘ͷΤσΟλʹద༻͞ΕΔ$44Λ௥Ճ

  77. #mtddc ؅ཧը໘ͷΤσΟλͰ΄΅ϓϨϏϡʔͰ͖Δ

  78. #mtddc ͋ͱ͸ʮ೥ʯผͷͰ͖͝ͱΛ௥Ճ͍͚ͯͩ͘͠

  79. #mtddc ͋ͱ͸ʮ೥ʯผͷͰ͖͝ͱΛ௥Ճ͍͚ͯͩ͘͠

  80. #mtddc αϯϓϧʢ׬੒൛ʣ IUUQTXXXOJKQIJTUPSZPGNUEEDDPNQMFUFIUNM

  81. #mtddc ࣮ࡍʹ͜ͷΧελϜϒϩοΫͰߏஙͨ͠ྫ גࣜձࣾγʔζɾϥϘ ձࣾԊֵ ΩϟϦΞύε

  82. #mtddc ӡ༻͠΍͍͢ϒϩοΫΤσΟλ

  83. #mtddc ϒϩοΫΤσΟλ͡Όͳͯ͘΋ྑ͍ͷͰ͸ʜ !

  84. #mtddc )5.-ϒϩοΫΛ࡞ͬͯɺ)5.-ΛషΓ෇͚Δ

  85. #mtddc )5.-ϒϩοΫΛ࡞ͬͯɺ)5.-ΛషΓ෇͚Δ

  86. #mtddc ͜ΕͰ΋Ͱ͖ͪΌ͍·͢ )5.-ϒϩοΫΛ࡞ͬͯɺ)5.-ΛషΓ෇͚Δ

  87. #mtddc ΢ΣϒϖʔδΛฤू͢Δਓ͕ )5.-Λॻ͚ΔͳΒ ϒϩοΫΤσΟλ͡Όͳͯ͘΋ྑͦ͞͏ʜʁ

  88. #mtddc ϒϩοΫΤσΟλΛར༻͠ɺࣗ෼ͨͪͰߋ৽͍ͯ͠Δ ฐࣾΫϥΠΞϯτͷօ͞Μ

  89. #mtddc ϒϩοΫΤσΟλΛར༻͠ɺࣗ෼ͨͪͰߋ৽͍ͯ͠Δ ฐࣾΫϥΠΞϯτͷօ͞Μ &$ػೳͱ࿈ܞͨ͠঎඼ϖʔδ ਺ेϖʔδʹ౉Δίϯςϯπ ݚमࢿྉʢಈըʣͷܝࡌ

  90. ΧελϜϒϩοΫ࡞੒खॱͷ ϕλʔϓϥΫςΟε גࣜձࣾδϟΫελϙδγϣϯɹ୅දऔక໾ɹ੢ࢁɹହ࢙  .5%%$.FFUVQ50,:0 See you! 1IPUPCZ.BUU)VETPOPO6OTQMBTI