サイト速度を改善する(その1)

サイトの表示速度は(ごくわずかの効果かもしれませんが)SEOの観点からみても重要です。
a-blog cmsではキャッシュ機能を使うことで、サーバーキャッシュを作ることができます。アクセスがある度に動的にhtmlファイルを生成するところを、キャッシュしておくことで高速化しています。

キャッシュ機能を有効にしている場合、サイバーキャッシュによる高速化の他に、htmlファイルはgzip圧縮されています。これはブラウザにある開発者ツールなどを使ってそのページのレスポンスヘッダーを確認することで確認ができます。
下記のように表示されていましたらgzip圧縮されています。

フォームIDの設定

フォームを設置するときフォームIDをテンプレートとフォーム管理画面に設定しています。フォームIDがあることでフォームの管理画面に送信データをデータベースに蓄積したり、メールのテンプレートやメールアドレスを指定することができます。

FormモジュールにフォームIDを指定する

フォームの各ステップにフォームIDを記述します。IDの英数字で指定してください。記述方法は以下のような記述になります。

<input type="hidden" name="id" value="(フォームID)" />

例えば、フォームIDが contactForm のときは以下のように記述します。

<!-- BEGIN_MODULE Form -->
 
<!-- BEGIN step-->
<!-- 新規 -->
<!--#include file="/include/form/insert.html"-->
<input type="hidden" name="id" value="contactForm" />
<!-- END step -->
 
<!-- BEGIN step#reapply -->
<!-- 修正 -->
<!--#include file="/include/form/update.html"-->
<input type="hidden" name="id" value="contactForm" />
<!-- END step#reapply -->
 
<!-- BEGIN step#confirm -->
<!-- 確認 -->
<!--#include file="/include/form/confirm.html"-->
<input type="hidden" name="id" value="contactForm" />
<!-- END step#confirm -->
 
<!-- BEGIN step#result -->
<!-- 完了 -->
<!--#include file="/include/form/result.html"-->
<input type="hidden" name="id" value="contactForm" />
<!-- END step#result -->
 
<!-- END_MODULE Form -->

フォーム管理にフォームIDを指定する

管理画面 > フォームの [フォームIDを作成]ボタンを押してフォームIDを作成します。フォーム管理ではフォームの送信データのログを閲覧したり、メールアドレスやテンプレートを指定ができます。

メールのテンプレートを指定する

フォームID画面ではメールのテンプレートや管理者のメールアドレスを指定することができます。

  • SubjectTpl :一般に届くメールの件名
  • BodyTpl :一般に届くメールの本文
  • BodyHTMLTpl : 一般に届くHTMLメールの本文(※Ver.2.5以降より追加)
  • AdminSubjectTpl:管理者に届くメールの件名
  • AdminBodyTpl:管理者に届くメールの本文
  • AdminBodyHTMLTpl:管理者に届くHTMLメールの本文(※Ver.2.5以降より追加)

メールのテンプレートはフォームのテンプレートが置いてあるテーマフォルダに置いてください。 例えば メールテンプレートが /themes/site2015/contact/form/subject.txt に置いてあった場合のパスは /contact/form/subject.txt になります。

テキストメール or HTMLメール

HTMLメールの本文のテンプレートがない場合は、テキストメールとして送信されます。HTMLメールとして送りたい場合は、テキストとHTML両方のテンプレートを指定ください。

メールアドレスを指定する

以下のようなメールアドレスを指定する箇所があります。

  • To
  • From
  • Cc
  • Bcc
  • Reply-To
  • AdminTo
  • AdminFrom
  • AdminCc
  • AdminBcc
  • AdminReply-To

最初にAdminがつく設定が管理者宛の設定で、つかないものが、自動返信の一般宛の設定になります。 これらの値は、ここでの設定以外にフォームのテンプレートで指定ができます。

通常は、Toにはお問い合わせした人に送信するので、毎回変わりますので、テンプレートで動的に設定します。 Fromは管理者のメールアドレスを設定すればよいでしょう。

逆に管理者宛のAdminToは、管理者のメールアドレスを固定で設定し、Fromを動的にテンプレートで指定します。


フォーム管理でのメール設定

フォーム管理でのメール設定


テンプレートでのメール設定

テンプレートでのメール設定

子ブログのエントリーリストを表示してみよう

以前まではモジュールの入れ子が不可能でしたが、モジュールがエスケープできるようになったことでモジュールの入れ子が行えるようになりました。また、URLコンテキストをモジュールで呼び出すこともできるようになりました。 これによって標準機能ではできなかった子ブログのエントリーリストもできるようになりましたので、実際に表示をさせてみましょう。

下準備

インストール後では、子ブログとエントリーがありませんのでまずは作成します。

子ブログの作成
ルートブログに子ブログを作成します。 2つ以上作っておくと確認時にループで動いているか確認しやすいので最低2つを目処に作成しましょう。


子ブログの作成
作った子ブログにエントリーを作成します。 一覧で表示するだけのためタイトルのみでも大丈夫です。


これで下準備は完了です。

カスタマイズ

子ブログリストエントリーリストを使用します。

今回は子ブログリスト li の中にエントリーリストの ul が入ることになりますので li 閉じタグの前にエントリーリストを貼り付けます。

<!-- BEGIN_MODULE Blog_ChildList -->
<ul class="acms-list-group">
	<!-- BEGIN blog:loop -->
	<li>
		<a href="{url}" class="acms-list-group-item">{name}</a>
		<!-- ここにエントリーリストを貼り付け -->
	</li>
	<!-- END blog:loop -->
</ul><!-- END_MODULE Blog_ChildList -->

このままではエントリーリストがルートブログのものになってしまうので、子ブログのエントリーが出るように修正を行います。 URLコンテキストをモジュールで呼び出すことができる「ctx(コンテキスト)」を使用します。 記述方法はモジュールIDと同様で、今回は子ブログリストのブログIDでエントリーリストを絞り込むため下記のような記述になります。

<!-- BEGIN_MODULE Entry_List ctx="bid/{id}" -->

次にモジュールのエスケープを行います。 a-blog cmsではモジュールは内側から解決させるため{id}が解説されないままエントリーリストが動いてしまいうまく絞り込まれません。

「BEGIN」「END」「変数」に必要となりますが、ctxに記述した{id}は子ブログリストの変数で先に解決がされて欲しいものになるのでエスケープが必要ありません。

例:
<!-- BEGIN_MODULE\ Entry_List -->
<!-- END_MODULE\ Entry_List -->
<!-- END\ entry:loop -->
\{url\}

変数には中かっこ(例:{})全てにエスケープが必要ですので注意が必要です。

下記のように「基本テーマの刷新」などのエントリーが出ていなければ正解です。


ctxの利用

時間がある方はトップページの「新着情報」と「採用情報」をモジュールIDを使わずにカテゴリーの絞り込みで表示をしてみましょう。

サイト速度を改善する(その2)

前回、サイト速度を改善する(その1)でgzipに圧縮することによるサイト速度の向上について紹介しました。今回は、そのgzip圧縮の作業を効率よく行う方法を紹介します。
Node.jsとgulpを使って圧縮の自動化を行います。ローカルのMac環境を例に圧縮の自動化を説明します。

送信データの確認

投稿データを確認する

フォームから送信された内容はフォーム管理に蓄積されます。フォーム管理の[投稿データ]ボタンを押してください。フォームに投稿された内容の一覧が表示されます。メールの内容を見たい場合は[本文を表示]ボタンを押すと本文を見ることができます。


本文を表示

本文を表示

投稿内容を絞り込む

投稿データを投稿された期間、連番などから絞り込めます。また、チェックした投稿データだけ削除することもできます。

管理者宛のメール内容を閲覧する

フォームログで表示されているのは一般宛に送信されたメールの内容が表示されています。管理者宛のメール内容を見るには絞り込むの「管理者宛(件名/本文) 」にチェックをして[表示]ボタンを押すと管理者宛のメール一覧が表示されます。


投稿内容を絞り込む

投稿内容を絞り込む

CSVデータでダウンロードする

投稿データはダウンロードする文字コードを選択してCSV形式でダンロードすることができます。