以下のページで配布しているテンプレートです。
以下のページからダウンロードしてお使い下さい。
上記の画像をクリックすると、別ウィンドウで画像が開きます。
変更した箇所を緑色の枠で括っています。
ver.151020からver.160202への変更点は以下の通りです。
以上の3点を変更しました。
これにて、各ページ共通部分が減り、ページ毎に異なるコンテンツ部分が増えました。
表示させるPHPファイルに以下の記述を、メタタグの内容を記載している箇所(4行目〜5行目付近)に追記しました。
$pagedisc = 'そのページで最も重要なキャッチ';
また、それらに伴い、「 /_set/head.php 」内にある記述を以下の通りに修正します。
<?php echo "$sitedisc"; ?>
<?php echo "$pagedisc"; ?>
また、これに伴い、 h1 タグの場所もこの” $pagedisc ”に充てるようにしました。
これまでは、ロゴテキスト部分に h1 タグを充てていましたが、今回で変更しています。
この時、「 /_set/_init.inc 」内に記載している” $sitedisc ”は削除して頂いても問題ございません。
配布ファイル内では、念のために残していますが、削除しても何の問題もございません。
配布ファイル内に記述を残している理由は特にありません。
強いて、サイトのキャッチコピーを忘れないように・・・というところでしょうか。
h1 タグの位置を変更したので、それに伴ったCSSの編集が必要です。
「 main.css 」、「 sp_main.css 」、「 tbl_main.css 」内にある「ヘッダー」内の h1 に関わる内容を修正しました。
細かい内容は配布しているCSSの内容をご確認下さい。
もともとそこまで装飾していなかったことと、各種 defalt.css で h1 をリセットしてるので、そこまで編集しなくても大丈夫でした。
フッターパンくずを追加した件については、修正というより、記述を追加するという感じです。
また、PHPファイルに以下の記述を追記します。
<div id="foot_pan"> <div id="foot_pan_link"> <ul> <li><?php echo "$pankuzu_top"; ?></li> </ul> </div> </div>
<div id="foot_pan"> <div id="foot_pan_link"> <ul> <li><a href="/"><?php echo "$pankuzu_top"; ?></a></li> <li><?php echo "$oth_page_02_linkname"; ?></li> </ul> </div> </div>
それぞれのコンテンツページの場合のパンくずですが、奥のページ名の箇所はリンクで囲っていません。
リンクを入れると矢印が出るようにしています。
これはCSSで調整しています。
次にCSSの追記です。
これも各種 main.css に追記しています。
追記している内容は以下の通りです。
#foot_pan { width: 100%; background-color: #efefef; padding-top: 3px; padding-bottom: 3px; } #foot_pan_link { width: 1000px; margin: 0 auto; } #foot_pan_link:after { content:"."; display: block; height: 0; clear: both; visibility: hidden; } #foot_pan_link ul { } #foot_pan_link ul li { float: left; text-align: left; } #foot_pan_link ul li a { margin-right: 10px; position: relative; padding-right: 8px; display: block; } #foot_pan_link ul li a:after { content:">"; font-size:100%; line-height: 1em; font-family:"MS Pゴシック",sans-serif; color:#999; position:absolute; right:-5px; top: 3px; display: block; }
main.css 内の「パンくず」の箇所に追記しています。
どこに追記して頂いても問題ありません。
リンクを張った時に矢印が出るのは、「 #foot_pan_link ul li a:after 」で制御しています。
フッターはもともと全ページに共通していたのですが、今回、共通させないようにしました。
基本的にはヘッダー部分と同じような感じです。
表示させるPHPファイルの変更点は、ヘッダー同様にそのページのみでキャッチを設定する箇所を設定部分に記述します。
$footdisc = 'フッターにページのサブキャッチ的な・・・。
全ページ共通していません。';
また、それに伴い、「 /_set/foot.php 」の直書きで全ページ共通させていたテキスト部分に以下の内容を書き入れます。
<?php echo "$footdisc"; ?>
また、この部分においては、 h4 タグを設置しました。
CSSの調整はなくても大丈夫です。
「 /_set/foot.php 」の記述は以下の通りです。
<div id="footdisc">フッターにサイトのサブキャッチ的な・・・。<br />全ページ共通してます。</div>
<div id="footdisc"><h4><?php echo "$footdisc"; ?></h4></div>
ということで、今回のアップデートが完了です。
全ページに手を入れなければいけないのが難点かもしれませんが、それくらいはまぁ”致し方なし”ということでお願い致します。
この作業が”最早、面倒・・・・”ということでしたら、WordPressをお使い頂くことをオススメ致します。笑
テンプレート的な機能とデータ的な機能の部分については、別途画面を用意しようかな・・・と思ったんですが、それだとWordPressと変わらないので、もう考えないことにしました。
初心者に優しく、ちょっとした知識を得られるような、それでいてSEOの強さを感じる構造を体感出来て、WordPressだとインターフェイスを触るのが怖い方でもインターフェイスを触る訓練が出来て、それでいて実用的なテンプレートを目指していますので、システマチックな発展は目指すところではありません。
この先、デザインパターンを増やしたり、html5版をつくることを考えてたり、出来ることはあるのでそんな感じで発展しようと考えています。
そんな感じでアップデートの概要は以上です。
今回のアップデートがSEO的にどれほどの役割を果たすのか・・・ということについてはあまり考えていません。
ただ、悪いことではなく、確実にポジティブな感じになると考えています。
なら、最初からやっておけよ・・・と言われてしまいますと、身も蓋もないんですが、まぁ徐々にアップデートする醍醐味を楽しみましょうということで、ご容赦頂けますと幸いです。
執筆 : 清水 隼斗