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

遂にキタ!MTのブロックエディタはイノベーションを起こすのか

 遂にキタ!MTのブロックエディタはイノベーションを起こすのか

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

Yausufmi Nishiyama

October 10, 2020
Tweet

More Decks by Yausufmi Nishiyama

Other Decks in Technology

Transcript

  1. MT
    MTDDC Meetup TOKYO 2020 at Zoom Webinar
    Yasufumi Nishiyama ( Juxtaposition Inc. )
    Hello!

    View Slide

  2. #mtddc

    View Slide

  3. #mtddc
    2004 4 2013 10 8

    View Slide

  4. #mtddc
    Movable Type
    2004 4 Movable Type
    2008 ProNet
    2013 MT
    2013 MTDDC Meetup HOKKAIDO 2013
    2015
    2018 MTDDC Meetup HOKKAIDO 2018

    View Slide

  5. #mtddc

    View Slide

  6. #mtddc
    SKELETON CART
    MT

    View Slide

  7. #mtddc
    DynamicPreview 2015.4
    ImageUploadUtility 2012.3
    Movable Type

    View Slide

  8. #mtddc
    DashboardUtility for movabletype.net

    View Slide

  9. #mtddc
    1. MT7 MT.net
    2. MovableType.net
    3.

    View Slide

  10. #mtddc
    Movable Type 7

    View Slide

  11. #mtddc
    Movable Type 7

    View Slide

  12. #mtddc
    Movable Type 7

    View Slide

  13. #mtddc
    Movable Type 7

    View Slide

  14. #mtddc
    Movable Type 7

    View Slide

  15. #mtddc
    Movable Type 7

    View Slide

  16. #mtddc
    Movable Type 7

    View Slide

  17. #mtddc
    Movable Type 7

    View Slide

  18. #mtddc
    Movable Type 7

    View Slide

  19. #mtddc
    Movable Type 7

    View Slide

  20. #mtddc
    Movable Type 7

    View Slide

  21. #mtddc
    Movable Type 7

    View Slide

  22. #mtddc
    Movable Type 7

    View Slide

  23. #mtddc
    Movable Type 7

    View Slide

  24. #mtddc
    MTAppjQuery
    Movable Type 7

    View Slide

  25. #mtddc
    MovableType.net

    View Slide

  26. #mtddc
    MovableType.net

    View Slide

  27. #mtddc
    MovableType.net

    View Slide

  28. #mtddc
    MovableType.net

    View Slide

  29. #mtddc
    TinyMCE
    MovableType.net

    View Slide

  30. #mtddc
    MovableType.net

    View Slide

  31. #mtddc
    MovableType.net

    View Slide

  32. #mtddc
    MovableType.net

    View Slide

  33. #mtddc
    MovableType.net

    View Slide

  34. #mtddc
    MovableType.net

    View Slide

  35. #mtddc
    MovableType.net

    View Slide

  36. #mtddc
    TinyMCE
    MovableType.net

    View Slide

  37. #mtddc
    MovableType.net

    View Slide

  38. #mtddc
    MovableType.net

    View Slide

  39. #mtddc
    MovableType.net
    class
    JavaScript CSS
    div
    class

    View Slide

  40. #mtddc

    View Slide

  41. #mtddc
    iframe
    Innovation 01

    View Slide

  42. #mtddc
    YouTube
    .YouTube iframe
    . HTML
    .div.youtube HTML
    .CSS

    View Slide

  43. #mtddc
    YouTube
    .YouTube iframe
    .
    . div.youtube
    .CSS

    View Slide

  44. #mtddc
    MovableType.net
    .

    View Slide

  45. #mtddc
    MovableType.net
    .
    . oEmbed

    View Slide

  46. #mtddc
    MovableType.net
    .
    . oEmbed
    . ON

    View Slide

  47. #mtddc
    MovableType.net
    .
    . oEmbed
    . ON
    . youtube
    . CSS div.youtube iframe { }
    QR

    View Slide

  48. #mtddc
    MovableType.net
    .

    View Slide

  49. #mtddc
    MovableType.net
    .
    . YouTube URL

    View Slide

  50. #mtddc
    MovableType.net
    .
    . YouTube URL

    View Slide

  51. #mtddc
    MovableType.net
    HTML

    frameborder="0" allow="accelerometer; autoplay;
    clipboard-write; encrypted-media; gyroscope; picture-in-
    picture" allowfullscreen="">

    View Slide

  52. #mtddc
    table
    Innovation 02

    View Slide

  53. #mtddc
    table
    . table
    CSS
    .WYSIWYG HTML
    div class

    View Slide

  54. #mtddc
    MovableType.net
    .

    View Slide

  55. #mtddc
    MovableType.net
    .
    .

    View Slide

  56. #mtddc
    MovableType.net
    .
    .
    .
    default, vertical, scroll

    View Slide

  57. #mtddc
    MovableType.net
    .
    .
    .
    default, vertical, scroll
    .
    QR

    View Slide

  58. #mtddc
    MovableType.net
    .

    View Slide

  59. #mtddc
    MovableType.net
    .
    .

    View Slide

  60. #mtddc
    MovableType.net











    View Slide

  61. #mtddc
    MovableType.net









    HTML

    View Slide

  62. #mtddc
    Innovation 03

    View Slide

  63. #mtddc
    ˡ͕͜͜ΠϯσοΫεʹͳΔ
    ˡ͜͜΁ͷϦϯΫΛ
    ɹͭ͘Γ͍ͨ

    View Slide

  64. #mtddc
    Movable Type
    . HTML
    .
    .
    .
    . MT

    View Slide

  65. #mtddc
    MovableType.net
    .

    View Slide

  66. #mtddc
    MovableType.net
    .
    .

    View Slide

  67. #mtddc
    MovableType.net
    .
    .

    View Slide

  68. #mtddc
    MovableType.net
    <$mt:PageBody$>
    .
    .
    .

    View Slide

  69. #mtddc
    MovableType.net


    folder_label="$__value__" />




    .
    .
    .

    View Slide

  70. #mtddc
    MovableType.net
    .
    .
    .
    .














    View Slide

  71. #mtddc
    MovableType.net
    .

    View Slide

  72. #mtddc
    MovableType.net
    .
    .

    View Slide

  73. #mtddc
    MovableType.net


    ձࣾ֓ཁ
    ࢧళॴࡏ஍


    HTML

    View Slide

  74. #mtddc
    HTML
    HTML MT
    Innovation!

    View Slide

  75. #mtddc

    View Slide

  76. #mtddc

    View Slide

  77. #mtddc

    View Slide

  78. #mtddc

    View Slide

  79. #mtddc

    View Slide

  80. #mtddc
    YouTube

    View Slide

  81. #mtddc

    View Slide

  82. #mtddc
    HTML/MT
    2021 MT7

    View Slide

  83. #mtddc
    MT
    URLɿwww.ni4.jp
    Twitter : nishi_yama
    MTDDC Meetup TOKYO 2020
    See you!

    View Slide