スタイリッシュでモダンな「Gin」管理テーマの紹介 #drupal_haneda

https://drupal-meetup-haneda.connpass.com/event/278964/

Transcript

1. スタイリッシュでモダンな
   「Gin」管理テーマの紹介
   まるやま ひかる
   Drupal Meetup Haneda #50 (2023-04-27)
   

   View Slide

2. 自己紹介
   丸山 ひかる
   アクイアジャパン テクニカルトランスレーター
   ● 1991年10月29日 生まれ
   ● 独立系ソフトウェア開発会社でソフトウェアエンジ
   ニア
   ● のちエバンジェリストとしてプロダクトの啓蒙活動
   ● 2019年8月 アクイアにジョイン
   ● ウェブサイトのコンテンツの技術翻訳やローカライ
   ズを担当
   Ruby / Rails / Web API / Docker / AWS
   ラーメン / スイーツ / キャンプ飯 / 登山
   

   View Slide

3. 最近のトピック①
   OSC2023 Online/Nagoyaに
   Drupal Meetup 豊田として
   登壇します！
   5月20日(土) 10時〜
   https://event.ospn.jp/osc2023-online-nagoya/
   

   View Slide

4. 技術書典14でDrupal 10本を出します！
   5月21日(日)@池袋でオフライン即売会にも出
   展予定なので遊びに来てね
   表紙チラ見せ→
   https://techbookfest.org/event/tbf14
   最近のトピック②
   

   View Slide

5. Drupalの管理テーマの話
   

   View Slide

6. ● Drupalの管理テーマについて
   ● Ginテーマとは
   ● 導入方法
   ● デモ
   アジェンダ
   

   View Slide

7. Drupalのテーマについて
   

   View Slide

8. Drupalのテーマには・・・
   フロントテーマ
   訪問者が閲覧する画面のレイアウトを
   賄う。
   例：Bartik, Olivero
   管理テーマ
   サイト管理者が閲覧する画面のレイア
   ウトを賄う。
   例：Seven, Claro
   

   View Slide

9. コントリビュートテーマでは
   Drupal.orgに掲載されているコントリビュートテーマ
   は、ほとんどがフロントテーマだと思って良いです。
   管理テーマを探す場合は、「Admin」で検索をかける
   と出てきます。
   

   View Slide

10. Drupalの管理テーマは
    何を使ってますか？
    

    View Slide

11. 携わっているDrupalプロジェクトでは
    1. コアのSeven管理テーマを使っている
    2. コアのClaro管理テーマを使っている
    3. コントリビュート管理テーマを使っている
    4. 管理テーマをカスタマイズしている
    

    View Slide

12. ちなみに私は
    1. コアのSeven管理テーマを使っている
    2. コアのClaro管理テーマを使っている
    3. コントリビュート管理テーマを使っている
    4. 管理テーマをカスタマイズしている
    Gin Admin Theme
    というコントリビュー
    トテーマを使ってい
    ます。
    

    View Slide

13. Ginテーマ
    について
    

    View Slide

14. Gin Admin Theme とは
    ● モダンなDrupalの管理テーマ。
    ● 以降Ginテーマと呼びます。
    ● プロジェクトページ：
    https://www.drupal.org/project/gin
    ● 最新バージョンはRC。
    ● Drupal 9, 10で利用可能。
    

    View Slide

15. Ginテーマのここがすごい
    ● コア管理テーマ「Claro」のリードデザイナーが作成/メンテし
    ている。
    ○ GinはClaroをベースに開発されており、 Claroの範囲外のものや、将
    来的に実験中のカスタマイズが含まれる。
    ● ダークモード対応や、アクセントカラーの変更など色々設定
    が用意されている。
    ● プロジェクトにスポンサーがついている。
    ● RCなのに結構使われている。
    

    View Slide

16. Ginテーマの歴史
    ● 2019年：Ginプロジェクトの開始。Drupal 8.8との互換性を
    2.xで提供。
    ● 2020年：3.xリリース。
    

    View Slide

17. Ginテーマの
    導入方法
    

    View Slide

18. インストールと有効化
    1. Composerでインストール
    $ composer require drupal/gin_toolbar:^1.0@rc
    drupal/gin:^3.0@rc
    2. テーマ管理画面でGinを有効化
    

    View Slide

19. 関連モジュール
    ● Gin Toolbar：上部にある管理ツールバーを常時
    Gin仕様にする場
    合に必要。RCリリースのみ。
    ● Gin Login：Gin仕様のDrupalログイン画面を提供。安定リリースあ
    り。
    ● Gin Dashboard：Gin仕様のダッシュボードを作成する機能のようだ
    が、現時点で利用可能なリリースはない。
    ● Gin Layout Builder：コアのレイアウトビルダーをGin仕様にする。
    RCリリースのみ。
    ● Gin Gutenberg：コントリビュートプロジェクトのGutenbergをGin仕
    様にする。安定リリースあり。
    

    View Slide

20. デモ
    

    View Slide

21. まとめ
    

    View Slide

22. まとめ
    ● 「Gin Admin Theme」は急成長中の管理テーマです。
    ● Claroをベースに開発されており、Ginのフィードバックが
    Claroに反映されると思われます。
    ● お客様先で導入するのはハードルが高いと思いますが、自
    社でハンドリングできる小さいプロジェクトや、自分のプロ
    ジェクトなら気軽に試せるのではと思います。
    

    View Slide

23. ● Gin Admin Themeのプロジェクトページ
    ○ Gin Admin Theme | Drupal.org
    ○ https://www.drupal.org/project/gin
    ● ドキュメント
    ○ Gin Admin Theme | Drupal Wiki
    ○ https://www.drupal.org/docs/contributed-themes/gin-admin-theme
    ● DrupalCon Europe 2021のセッション動画
    ○ USERS & EDITORS - Gin Admin Theme- The Past, The Present &
    The Future
    ○ https://www.youtube.com/watch?v=Ze1jeQzCWNQ
    参考資料
    

    View Slide

24. Thank you!
    

    View Slide