制作経緯・意図
魚町商店街振興組合さんからのご依頼で北九州市の小倉にある商店街、魚町銀天街さんのホームページをリニューアルをさせて頂きました。 魚町商店街とは日本で最初のアーケード商店街で、「銀天街」と言う呼び方は魚町商店街からはじまったとのことです。 また、SDGsの取り組み活動も行なっておりSDGsに関するアワードをいくつか受賞されている積極的な商店街さんです。
今回のリニューアルに関していくつかポイントがありましたが、a-blog cmsを導入することでスムーズ且つ、スピード感ある制作を実現することができました。
アピールポイント
メディアモジュールの公開期限機能の活用
メインビジュアルの画像は決まった画像があり季節ごとに変更したいという要望がありました。 こちらは標準で付いている公開期限を活用することで実現可能でした。 複雑な条件をテンプレートに指定することもなく管理画面の設定から年間の表示を管理することが可能です。
別で運用されているサイトの一覧を表示
SDGsの活動はa-blog cmsとは別のシステムであるWordPressですでに運用されていましたが、最新記事の一覧をトップページに表示したいという要望がありました。 トップページ一覧表示の部分は a-blog cms とは切り離してJavaScriptのVue.jsを使用して表示しています。 こういった場合、a-blog cms にかぎらず CMS と JavaScript の記述方法がぶつかってしまうことがよくありますが、``を使用することで、テンプレート内で JavaScript の記述をストレスなくスムーズに使用することができました。
一覧から直接エントリー編集画面へのリンクを設置
店舗様ページはご自身のホームページがあれば「リンク先を設定」して直接ご自身のホームページへリンクさせています。こちらも標準の機能で実現可能です。
しかし、各店舗様のページを修正したい場合に詳細ページへは移動できなくなるため、管理ページ内のエントリー管理から変更する必要があります。
若干の手間がありましたので「リンク先を設定」に関係なく管理権限でログインしているユーザーにはエントリーの修正ページへ直接移動できるリンクを設置することで管理画面に移動することなく詳細ページへ遷移可能になりました。
PDFプレビューの活用
多言語ガイドマップがあるのですがPDFプレビューを活用することで視覚的に表現することができました。PDFを添付するだけでなく、こういったより見やすい機能が標準で搭載されているところが嬉しいですね。
ctxを使うことで特殊な一覧表示もシンプルに管理可能
店舗マップページは実際の店舗の並び順と同じ順番で表示したいという要望がありました。
このような特殊な一覧表示もカスタムフィールドで条件を絞り込みこめば表示可能なのですが、条件毎にモジュールIDが増えると後のメンテナンスが大変になる場合があります。
今回、表示の条件を満たすには12個のモジュールIDが必要なことがわかりました。
そこでctxを使用することで1つのモジュールIDを使い回す形にできたためシンプルな管理を実現することができましした。
プロジェクトに a-blog cms を採用した理由、採用してよかったこと
画像の公開期限機能やPDFプレビュー、詳細ページを別ページへのリンクなどどれも標準の機能で表現することができました。標準でできることの幅が広く大変助かりました。 またスケジュールに関しても商店街さんのご協力もありデザインから構築までの流れをスムーズに進めることができました。 デザインとCMS構築、データの確認を同時進行することができ、制作期間は1ヶ月ほどで完了することができました。 このカスタマイズ性高さ、スピード感は a-blog cms ならではの良さだと実感しています。