すべての記事の最後に同じ文字を入れる(よかよかブログ)

ブログは、データベースから記事などのデータを呼び出して、テンプレート(定型のフォーマット)に割り当てて表示する仕組み(システム)です。 ですので、テンプレートを編集すれば、その編集内容はすべてのページに反映されます。

※テンプレートのカスタマイズは「html」、「スタイルシート」等の知識が必要です。中級・上級者向けの設定なので自己責任で行なってください。

テンプレートカスタマイズのページを開く

管理画面を開いたら、左のサイドメニューのテンプレートをクリックします。

sidebar

テンプレートの表が表示されます。選択可能一覧に「使用中」と書かれている行が現在使用中のテンプレートです。

「編集」の列の「カスタマイズ」の文字をクリックします。

template

 

テンプレートの種類

template-custmaize

テンプレート名は、そのままでもいいですが、僕はカスタマイズする場合は、名前を変更しておきます。例えば、最後に(カスタマイズ)とつけたりして、カスタマイズしたテンプレートとわかるようにしておきます。例:Clover(カスタマイズ)

スタイルシートは「見栄え」「レイアウト」を指定する為のものです。
今回は使用しません。

トップページは、その名前のとおりトップページ用のテンプレートです。

個別記事は、個別の記事を表示した時のテンプレートです。

アーカイブは「最近の投稿」や「過去の記事」で月別に表示した場合、カテゴリーごとに表示した場合に使われるテンプレートです。

各テンプレートのカスタマイズ

今回はすべてのページで、すべての記事の最後にリンクを表示するカスタマイズを行ないます。ですので「トップページ」「個別記事」「アーカイブ」のすべてのテンプレートに、HTMLのコードを記述します。

しかし、トップページのカスタマイズも、個別記事のカスタマイズもアーカイブのカスタマイズもすべてやり方は同じなので、トップページのみで説明します。

 

まず、トップページのテキストボックスに表示されているのが、テンプレートのソースコードです。

このソースコードに手を加えます。

トップページのテキストボックスの中をスクロールさせて、

「<div class=”posted”>Posted by<%EntryAuthor%> at」と書かれているところを探してください。

じっくりと探してください。(下の図を参考に)

Image5

の上に「<br clear=”all” />」とあれば、間違いなく大丈夫です。(本来、何行目あたりと指定して教えたいところですが・・・・)

その、「<br clear=”all” />」と「<div class=”posted>Posted by<%EntryAuthor%> at」の間に次のようなHTMLコードを書き込みます。

<!—– リンクボタン挿入—->
<div>
<a href=”http://www.ordermade-panya.com” target=”_blank”>オーダーメイドパン屋はこちらをクリック</a>
</div>
<!—ここまで–>

下図参照

Image10

赤い文字の部分がページに表示されるリンクの文字です。

青い文字の部分が、リンク先のアドレスです。(森ピー先生のパン屋へのリンクと、文字になってますので、それぞれで変更してください)
アドレスは半角英数字で記入してください。

HTMLのコードについては、詳しい解説は割愛します。(グーグルで調べれば解決しますよ)

ひとまず、ここまで終わったらテンプレート・カスタマイズページの下にある「登録」ボタンをクリックします。

この後の細かいのは省略しますが、ブログのトップページを開いてみて、各記事の最後に(Posted byの文字の上に)リンクが表示されているばOKです。

Image11

文字だけで、さびしい?
色をつけたりする方法は、また今度。

バナー画像にする場合は、まず自分でバナーの画像を作ってくださいね。

個別ページもアーカイブもやり方は同じ

個別ページもアーカイブもやり方は同じです。

「<br clear=”all” />」と「<div class=”posted”>Posted by<%EntryAuthor%> at」の間に上記のHTMLコードを挿入して、「登録」ボタンを押してください。

補足ですが、作業がしずらくはないですか

カスタマイズページのソースコードが書かれているテキストボックスが狭かったり、その中から「Psoted by」の文字を探したりと、作業がしづらくないでしょうか?

これくらいのカスタマイズなら、さほどたいしたことはないですが、大規模なカスタマイズになると、このページ上でカスタマイズをするのは、作業効率が悪いです。

そのような場合に「テキストエディタ」といわれる種類のソフトを使います。

テキストエディタを使わずによかよかブログのカスタマイズ画面で直接カスタマイズするときも、該当場所を探す為に、グーグルツールバーやYahooツールバーを使ってページ内を検索して見つけます。

または、ブラウザの検索機能を使ってもいいですね。

もし、リクエストあれば検索機能を使って「Posed by」の場所を探す方法も記事をつくります。コメントしてください。

もし失敗して表示がおかしくなったら

テンプレートを再度選び直せば、初期状態に戻るようです。しかし、オリジナルテンプレートを作成している人は、それも失ってしまうでしょう。

ですので、カスタマイズするテンプレートのソースコードを丸々全部、Windowsの「メモ帳」にコピー貼り付けして保存してから、カスタマイズすることをお勧めします。

※テンプレートのカスタマイズは「html」、「スタイルシート」等の知識が必要です。中級・上級者向けの設定なので自己責任で行なってください。

役に立った方クリックお願いします
にほんブログ村 地域生活(街) 九州ブログへ