1. HOME
  2. フロントエンド
  3. a-blog cmsのおすすめと使用してみて

a-blog cmsのおすすめと使用してみて

フロントエンド

もちろんこのブログもa-blog cmsですが、このブログとは別にHTMLテンプレートをa-blog cms のテーマ化しましたので、そちらの紹介と、a-blog cmsの紹介と、難しかった点についてお話しします。

a-blog cmsとは


まずは今回使用し、このブログにも使用していますCMS「a-blog cms」のおすすめポイントについて紹介します。


PHPを使わない


ややこしいPHPを一切触らなくてもできるので最低限HTMLとCSSがわかればサイトが作れます。
わたしもテーマ化をしてきてPHPを触ることは一度もありませんでした。


ユニットレイアウト


更新時には文章を打ち、画像を入れ、という流れですが、a-blog cmsでは投稿画面がユニットレイアウトになっているので投稿も編集もとても簡単にできます。


段落ごとで文章を分けておけば、左上の番号で順序を簡単に入れ替えることができます。
これは画像を入れたときも同じで、順番を入れ替えることもできますし、配置を変えることも、画像の表示サイズをかえることもできます。
HTMLタグを使用することも可能ですが、「本文」「見出し」などを選択することで事実上< p >などのタグがついた文字ということになります。
なのでHTMLがわからないって方でも簡単に記事が書けるんです。


ダイレクト編集機能


わざわざエントリーの編集画面に飛ばなくても、デザインを見ながら編集ができるものです。
個人的にはデザインを見ながら編集ができるので、改行などの調節や、画像の配置の調節がしやすくてブログの投稿などにはとても役立っています。


a-blog cmsのテーマ化でのポイント

インクルードとJS

JSといっても特に細かい設定はいりません。

<!-- BEGIN_MODULE Js -->
    <scripttype="text/javascript"src="/acms.js{arguments}"charset="UTF-8"id="acms-js"></script>
<!-- END_MODULE Js -->

これを書くだけです。
トップページに、一覧ページ、詳細ページとたくさんページがあっても

<!--#include file="/include/head.html"-->

と、共通するheadやheaderなどの部分をincludeファイルを作って分けておけばどのページにも反映させることができるのでとても簡単に管理できます。

独自の設定モジュールID

エントリー(記事)を「エントリー本文」というようにモジュールというものに置き換えるのですが、とあるカテゴリーの記事だけを表示したい!など絞り込む時に使うのがモジュールIDです。


引数で指定することでカテゴリーやタグごとで絞り込んだ記事のみを表示することができます。


カスタムフィールド


field.htmlにTABLEの記述を書くことで管理画面で文章を編集するだけで変更ができるので、いちいちHTMLを変更して、サーバーにあげるという手間がはぶけて、
もし使う人がHTMLがわからないって方でも編集ができるのでとても管理が楽なんです。


では、このテーブルの書き方を覚えなきゃいけないかというとそういうわけでもなく、
カスタムフィールドメーカーというものが用意されていますので、そちらでテキストエリアを作りたい、画像を挿入したい、と選択していくだけでソースを作ってくれます。
ぱっとみ最初は難しく見えましたが、選択してソースをコピペするだけなのでとても簡単にできます。


  • ブログのカスタムフィールド
  • エントリーのカスタムフィールド
  • カテゴリーのカスタムフィールド
  • ユーザーのカスタムフィールド

があります。
今回使用したのは、ブログ・エントリー・カテゴリーのカスタムフィールドを使用しました。
カテゴリーを設定しておけばカテゴリーごとにエントリー投稿画面も変えれますし、それで投稿したものはダイレクト編集で手軽に順番も変えれるので、いろいろな使用方法ができると思いました。
もちろん使うにはグローバル変数も使うのですが、こちらの記入も1行でできたので簡単にできました。

<!-- ID別フィールドの表示 -->
<!--#include file="/admin/entry/blog%{BID}.html" -->
<!--#include file="/admin/entry/category%{CID}.html" -->

<!-- コード別フィールドの表示 -->
<!--#include file="/admin/entry/%{CCD}.html" -->
<!--#include file="/admin/entry/%{ECD}" -->

あとがき

使ってみて一番最初に苦戦したのは「引数」でした。
モジュールIDを設定するのには必要ですが最初はなかなか理解できなくて、苦戦しました。
カテゴリーやタグは名前の通りでわかりやすいのですが、このブログで言えばアーカイブの設定がわからず最後は手当たり次第に設定をしてやっと理解しました。

次に苦戦したのがフォームです。
これに関しては元からあるテーマの「site2015」からコピペでもってきてそれを使用しようと思ったのですが、
どこになにを置けばいいのかが全くわからず苦戦しました。
同じ形ならわかりやすいのですが、今回使用したHTMLテンプレートが英語だったこともありとても難しく感じました。
でも、仕組みがわかればとても簡単に感じますし、とても簡単に便利なものだと感じました。

そして苦戦というよりもまだ全く分かれていないのが「ゼブラ機能」です。
ゼブラ機能自体もまだ使いこなせていないのですが、3個目だけにclassを付与したいなんていう特定の要素につけるやり方がわからず段落ちしたままになっていたり、細かい指定もわからず難しかったです。

エントリーのカスタムフィールドなどもそうですが、やはり教えてくださる方がいないとできない部分が多々出てきてしまいました。調べ方や理解度の違いもあるかと思いますが・・・。
わからない時に役立ったのがデモサイトでした。
元からあるテーマの中に入ってるのでソースも見れますし、デモサイトで見た目や機能もわかるので、小さなわからないことはここを見て解決した部分が多かったです。

今回は簡単に紹介しましたが、もっとできるようになったらぜひテーマ化のやり方の記事を書きたいと思います。


a-blogcms

この記事を読んだ方におすすめ