ブログ記事を書いていると稀に、ほかのファイルにテンプレートとなるものを書いておいて、それを呼び出して記事中に埋め込みたい時があります。複数の記事から同じテンプレート文を呼び出して使い、修正が必要な時はテンプレートの元文章を直せば、その1箇所だけで済むというものです。案外すんなりと実現できたので書いておきます。
具体的な使用例
例えばどこか旅行に行って、その旅行記をシリーズで書いていくとします。独自のカテゴリを作ればそれで関連記事をまとめることはできますが、そこまででもない時に使います。
同じ旅行の別記事へ飛べるようなリンクの一覧を各記事に付けておけば、サイト内で回遊してくれるのでpvが増えます。読者的にも便利でしょう。しかし記事が増えるたびに旅行記の各記事を1つ1つ修正修正していくのは大変です。なのでそれをテンプレートとして保存し、各記事では呼び出すだけにすれば、修正するのは1箇所で済みます。
同じように、例えば新しいスマホを買って、そのレビュー記事を書く時。レビュー記事それぞれの文末に「○○のレビュー記事一覧」といった一覧表があると便利です。
やり方
テンプレート文の作成
まずは呼び出すテンプレート文を作成します。これは、例えば新しく記事を作って、目立たないように日付を1900年1月1日など古いものにします。その記事の中にテンプレート文を書きます。
<div id="template001"> ここにテンプレート文 </div>
テンプレート文の中身は普通にhtmlを書いて大丈夫です。はてな記法などもそのままでOKです。
記事内で呼び出す
テンプレート文を呼び出したい記事の方で、以下のように記述します。
<script> $(function(){ $("#zzz").load("テンプレート文を書いた記事のURL #テンプレートのID"); }); </script> <div id="zzz"></div>
これで<div id="zzz"></div>の部分にテンプレート文がそのまま挿入されます。
なお、テンプレート文を書くブログですが、どうやら自分のブログでなくても大丈夫なようです。全く違うサイトだとダメですが、はてなブログ内のURLなら呼び出せるようです。それが良いことだとは思いませんが。ただし自分のものでも非公開ブログからは呼び出せないようです。
例として、下の枠の中はZENO-TEAL (https://zeno-teal.hatenablog.com/) のメニュー部分を呼び出しています。
呼び出しているのは文（コード）だけでcssは呼び出している側のものが適用されます。リンクなどはそのまま生きています。
使い方はアイデア次第
使い方次第で便利になると思います。興味ある方は試してみてください。私だったら、やはりスマホのレビューで、その機種のレビュー記事一覧を表示するといった使い方になるでしょうか。
人力検索はてなでおそらくこれを求めている人がいました。たぶん今回の内容で解決すると思います。
q.hatena.ne.jp
