先週、8月31日は「CMSMix Sapporo Vol.13・a-blog cmsの回」を開催しました。

札幌での勉強会の参加は、今週末の「CSS Nite in Sapporo, vol.23『北海道限定！ブランディング』」で、当分お休みになります。二年以上に渡ってCMS Mixを共同運営していた、西山さん、白根さん、ありがとうございます。俺流のザンギは最高です (๑´ڡ`๑)

さて、Vol.13のテーマは、a-blog cmsの「組み込みJS」について、ハンズオン形式で紹介しました。
a-blog cmsには、インストール時点で制作を補助するJavaScriptライブラリが、多数読み込まれています。これらは簡単なclassやdata属性の付与で起動することができます。

ハンズオンで使用したバージョンから一部修正した学習用テーマを、GitHubで公開します。

https://github.com/webbingstudio/acms_builtin_js_handson

インストール直後のa-blog cmsにこのテーマを反映するだけで、画面の指示に従って以下のライブラリを体験できます。

• 指定した管理画面URLをポップアップで表示
• スムーズスクロール
• コンテンツの折りたたみ
• 動画のポップアップ
• 最低限のタグのみ使用できるリッチテキストエディタ
• カスタムフィールドの文字数をカウントする
• 表を簡単に入力できるカスタムフィールドを作る
• 組み込みJSの設定を変更する

組み込みJSの立ち位置

勉強会で「この組み込みJSを使うということは、うぇびんさんは、CMSのサイトを作るときにJSも書くんですか？」と聞かれました。制作会社とフリーランスの温度差を感じる質問でした。

CMSを扱う制作会社の場合、コーディング担当とCMS構築担当という切り分けになることが多いですが、私のようなフリーランスの制作者は「ワンストップでやってほしい」と、しばしば希望されます。やはりその方が手戻りが少ないからで、コーディングが完了したデータをいただいて作業するのは、大企業さんの案件くらいです。

問題は、ウェブサイトにはJavaScriptの演出が欠かせないというところです。ライブラリを探して組み込んで、デザインを合わせる工数だけでもばかになりません。私はある程度JavaScriptを書くことができますが、デザイン＋HTML＋CSS＋WordPressというスキルセットの制作者はいつも大変です。

そういう、JavaScriptを通常業務としていない人でも、ある程度の演出を気軽に使用できるのは、a-blog cmsの強みではないかと思います。また、a-blog cmsは公式テーマでサイト構造だけ作ってからデザインを考える手法を勧めているので、イメージしている演出を組み込みJSでさくっと組んでしまうこともできます。XDみたいな感じですね。

逆に、コーディングが先にあって、かつJavaScriptのスキルが高い人だと、必要のないライブラリが多数読み込まれてしまうa-blog cmsの仕様は不便に感じるかもしれません。

ハンズオン素材を作る目的

勉強会では、時間が許す限りハンズオン素材を制作しています。また、素材は配布可能にしたいと考えています。
これは勉強会を楽しく進めるのに必要なのはもちろんなのですが、少なからずいる、勉強会に物理的・時間的な理由で来られない人にアプローチしたいからです。

というか、そういう潜在的な参加予備軍の方がはるかに多いはずです。「勉強会に行くと参加者とつながりができたり、そのCMSを使わざるを得なくなるのでめんどくさい」という、現実的な理由があるのも察しています。
そういう人たちにも気軽に使ってもらって、「a-blog cms便利だな！！」となってもらえるとうれしいです。他のCMSのユーザーの人も偵察にお使いくださいw

勉強会の後半ではヘッドレスCMS「microCMS」を試しました。それはまた次の記事で書きます。