FC2ブログのテンプレート工房

カスタマイズが簡単な共有テンプレートを配布しています。テンプレートをカスタマイズして自分だけのオリジナルブログを作りませんか?

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
[ --/--/-- --:-- ] スポンサー広告 | TB(-) | CM(-)

親子カテゴリ対応サイトマップのリンクタイトル

リンクタイトルはマウスカーソルをリンクに乗せたときに表示されます。

当サイト配布のテンプレート(standard_ver.09,lightframe_ver.04 以降)であれば、次の赤い箇所がリンクタイトルに相当します。

<!--▼サイトマップ▼-->


<div class="display_no">
<ul>
<!--titlelist-->
<li Name="<%titlelist_category_no>" ID="<%titlelist_category_no>">
<a href="<%titlelist_url>" title="<%titlelist_body>"><%titlelist_title></a>
- <%titlelist_year>.<%titlelist_month>.<%titlelist_day>
</li>
<!--/titlelist-->
</ul>
</div>


<!--▲サイトマップ▲-->


この <%titlelist_body> は、本文冒頭(約20文字)しか表示しません。リンク先に移動せずに内容がある程度解るのなら良いのですが、20文字前後だと少し不十分です。

より記事タイトルをSEOのキーワードとして強調したければ、記事タイトルと同じリンクタイトルにしたほうが良いかもしれません。

記事と同じリンクタイトルにする場合は<%titlelist_body><%titlelist_title>に入れ替えてください。

【2009/09/06 追記】この記事の修正はlightframeシリーズのver.05以降、standardシリーズのver.10以降には実装済みです。各バージョン情報はHTMLかCSSの最下部に記されています。

linkタグ relの設定

linkタグのrelとは現在のページからみた別のページとの関係を設定するために使われるタグです。

当サイト配布のテンプレートであれば<head></head>内に次のような箇所があります。

<link rel="stylesheet" type="text/css" href="<%css_link>" media="screen,tv" title="default" />
<link rel="alternate" type="application/rss+xml" href="<%url>?xml" title="rss" />
<link rel="top" href="<%url>" title="トップ" />
<link rel="start" href="<%url>" title="最初の記事" />
<!--preventry--><link rel="prev" href="<%preventry_url>" title="<%preventry_title>" /><!--/preventry-->
<!--nextentry--><link rel="next" href="<%nextentry_url>" title="<%nextentry_title>" /><!--/nextentry-->


個別記事の前後関係は設定していましたが、その他(カテゴリや日付等)のページの前後関係は設定していませんでした。

もしこのタグが検索エンジンのクロールやインデックスに効果があるとすれば、さらに以下のタグを加えると良いかもしれません。

<!--prevpage--><link rel="prev" href="<%prevpage_url>" title="前のページ" /><!--/prevpage-->
<!--nextpage--><link rel="next" href="<%nextpage_url>" title="次のページ" /><!--/nextpage-->
<link rel="index" href="<%url>archives.html" title="サイトマップ" />


効果があるかどうか解りませんが、これで少しでも検索エンジンのインデックスがスムーズになると良いですね。


【2009/08/27 追記】
一部スラッシュ「/」が抜けていたので追加しました。
ちゃんさんご指摘ありがとうございました m(__)m

また、全記事一覧は「索引」でも「目次」でもあると思うので
<link rel="index" href="<%url>archives.html" title="サイトマップ" /> を
<link rel="contents" href="<%url>archives.html" title="サイトマップ" />
としても問題ないと思います。

ちなみにFC2の公式テンプレートは「index」を使っていましたが、三大検索エンジン(Google, Yahoo, MSN)のトップページはこのどちらも使っていませんでした。あまりこのタグの効果を期待しないほうが良さそうです^^;

【2009/09/06 追記】この記事の修正はlightframeシリーズのver.05以降、standardシリーズのver.10以降には実装済みです。各バージョン情報はHTMLかCSSの最下部に記されています。

metaタグ descriptionの設定

metaタグのdescriptionとは、そのページの要約を紹介するところです。

かつてスパムとして利用されたために今では検索エンジンの上位表示効果は無いと言われていますが、ここに設定された記述は検索結果の説明文として表示されることが多くなります。

当サイト配布のテンプレートであれば、次のような箇所があります。

<head>

<meta name="description" content="<%introduction>" />

</head>


<%introduction>には、環境設定にあるユーザー情報の設定「ブログの説明」があてはまります。
これは全てのページのdescriptionに「ブログの説明」を設定した状態です。

今までこのタグの扱いを重要視していませんでしたが、Googleウェブマスターツールによるサイト診断では「重複するメタデータ(descriptions)」があると警告が出てしまいました。

descriptionを設定しなくても検索結果にはキーワード周辺の文章が表示されるので、この設定を削除したほうが良さそうです。

全てのページで同じdescriptionは良くないが、トップページだけ設定したいという方は以下のようにしてください。

<!--index_area--><meta name="description" content="<%introduction>" /><!--/index_area-->



【2009/09/06 追記】この記事の修正はlightframeシリーズのver.05以降、standardシリーズのver.10以降には実装済みです。各バージョン情報はHTMLかCSSの最下部に記されています。

親カテゴリの表示

当サイト配布のテンプレートは、記事下部に日付やカテゴリ等が表示されます。
しかし、表示されるカテゴリは子カテゴリのみでした。

カテゴリを親子関係にしている場合、親と子、両方のカテゴリを表示するカスタマイズを紹介します。

コメントを受け付けない設定にすると、ページナビゲーションがダブる問題

当サイト配布のテンプレート「lightframeシリーズ」において、コメントを受け付けない設定にすると、ページナビゲーションが次のように同じ場所に2つも表示されてしまいました。

≪前の記事 | HOME | 次の記事≫
≪前の記事 | HOME | 次の記事≫

誠に申しわけありません m(__)m
この問題を解決するため、HTMLを下記のように修正してください。
青い箇所を切り離し、それを赤い箇所に貼付けてください。


<!--/topentry-->
<!--▲ エントリー(記事)▲-->

<!--▼コメント表示▼-->
<!--comment_area-->


<!--permanent_area-->
<!--▼ページナビゲーション(個別記事)▼-->

<!--▲ページナビゲーション(個別記事)▲-->
<!--/permanent_area-->

<!--▼コメント表示▼-->
<!--comment_area-->

<a name="comment_list" id="comment_list" ></a>


これでコメントを受け付けない設定にした記事のページナビゲーションがタブらずに表示されます。
誠に申しわけありませんでした m(__)m

【2009/09/06 追記】この記事の修正はlightframeシリーズのver.05以降には実装済みです。

white_eagle,fullmoon_howlingにて、背景画像の下が欠けてしまう問題

white_eagle, fullmoon_howling の ver.09 にて、IEだとタイトル背景画像(満月狼と鷹)の下が欠けていました。
申しわけありません m(__)m

この問題を修正するためには、スタイルシートの末尾に以下を加えてください。

#header {
height:100px; /* 背景画像の高さ確保 */
}


この修正は 2009年7月30日 ver.09.1 として共有テンプレートに反映させました。

コメントタイトルにマウスを乗せると色が変わってしまう問題

当サイトで公開している共有テンプレートには、コメントタイトルにマウスを乗せると色が変わってしまう問題がありました。
申しわけありません m(__)m

これはコメントタイトルをリンクのアンカー先としてaタグで囲っていたのが原因です。
それぞれのテンプレートについて、HTMLを下記のように修正してください。

【standardシリーズの場合】



<!--▼コメント表示▼-->
<!--comment_area-->
<a name="comment_list" id="comment_list"></a><br />
<div class="article">
<!--comment-->
<p id="comment<%comment_no>"><strong><a name="comment<%comment_no>" id="comment<%comment_no>"><%comment_title></a></strong></p>



<!--▼トラックバック表示▼-->
<!--trackback_area-->
<div class="article">
<p id="trackback"><a name="trackback" id="trackback">トラックバック</a></p>
<p>この記事のトラックバックURL<br />
<a href="<%trackback_url>"><%trackback_url></a>
</p><br />
<!--trackback-->
<p id="trackback<%tb_no>"><strong><a id="trackback<%tb_no>" name="trackback<%tb_no>" target="_blank"><%tb_title></a></strong></p>



<!--▼サイトマップ▼-->
<!--titlelist_area-->
<div class="menu_outline3">
<div class="menu_title3" id="mapnavi_title"><a name="mapnavi_title">サイトマップ</a></div>
<div class="menu_cont3">



【lightframeシリーズの場合】



<!--▼コメント表示▼-->
<!--comment_area-->
<a name="comment_list" id="comment_list" ></a>
<!--comment-->
<div class="comment_outline">
<div class="comment_title" id="comment<%comment_no>"><a name="comment<%comment_no>" id="comment<%comment_no>"><%comment_title></a></div>



<!--▼トラックバック表示▼-->
<!--trackback_area-->
<div class="trackback_outline">
<div class="trackback_block_title" id="trackback"><a name="trackback" id="trackback">トラックバック</a></div>
<div class="trackback_block_body">
この記事のトラックバックURL<br />
<a href="<%trackback_url>"><%trackback_url></a><br /><br />
<!--trackback-->
<div class="trackback_title" id="trackback<%tb_no>"><a id="trackback<%tb_no>" name="trackback<%tb_no>" target="_blank"><%tb_title></a></div>



<!--▼サイトマップ▼-->
<!--titlelist_area-->
<div class="plugin3_outline">
<div class="plugin3_title" id="mapnavi_title"><a name="mapnavi_title">サイトマップ</a></div>
<div class="plugin3_body">



【2009/09/02 追記】上記の記事内容を修正しました。以前の内容は以下になります。
【standardシリーズの場合】

<!--▼コメント表示▼-->

<p><strong><a name="comment<%comment_no>" id="comment<%comment_no>"><%comment_title></a></strong></p>


<!--▼コメント表示▼-->

<a name="comment<%comment_no>" id="comment<%comment_no>"></a>
<p><strong><%comment_title></strong></p>



【lightframeシリーズの場合】

<!--▼コメント表示▼-->

<div class="comment_title"><a name="comment<%comment_no>" id="comment<%comment_no>"><%comment_title></a></div>


<!--▼コメント表示▼-->

<a name="comment<%comment_no>" id="comment<%comment_no>"></a>
<div class="comment_title"><%comment_title></div>



【2009/09/06 追記】この記事の修正はlightframeシリーズのver.05以降、standardシリーズのver.10以降には実装済みです。各バージョン情報はHTMLかCSSの最下部に記されています。

fullmoon_howling, white_eagle, standard_wide_white をバージョンアップしました。

standardシリーズの亜種である fullmoon_howling, white_eagle, standard_wide_white を Ver.09 にバージョンアップしました。

以下の修正、カスタマイズを行いました。

親子カテゴリ対応サイトマップ (折りたたみには対応させていません)
不要なHTMLを読み込ませない
copyrightの自動更新
コメントの編集欄に絵文字挿入機能を付ける
ユーザータグの便利ナビゲーション
標準的なコメントリンクに戻す(改訂版) (2009/07/14 追記の処理)
カレンダーの中央寄せ
FC2ブックマークボタン / ブログ拍手の表示位置 (上に少し余白をとりました)
standardシリーズの左右カラムの罫線

fullmoon_howling と white_eagle の右上にあった画像(img)は、背景画像(background-image)にしました。

他に少し文法チェックで気になる部分を修正しました。


前バージョン Ver.08 のバックアップです。
fullmoon_howling ( html / css )
white_eagle ( html / css )
standard_wide_white ( html / css )
※IEだとhtmlが開けないようです。Firedox等で開いてください。文字化けする場合はエンコードをShift_jisにしてください。

standardシリーズを Ver.09 にバージョンアップしました

standardシリーズを Ver.09 にバージョンアップしました。

以下の修正、カスタマイズを行いました。

親子カテゴリ対応サイトマップ (折りたたみには対応させていません)
不要なHTMLを読み込ませない
copyrightの自動更新
コメントの編集欄に絵文字挿入機能を付ける
ユーザータグの便利ナビゲーション
標準的なコメントリンクに戻す(改訂版) (2009/07/14 追記の処理)
カレンダーの中央寄せ
FC2ブックマークボタン / ブログ拍手の表示位置 (上に少し余白をとりました)
standardシリーズの左右カラムの罫線

他に少し文法チェックで気になる部分を修正しました。


前バージョン Ver.08 のバックアップです。
standard_blue ( html / css )
standard_skyblue ( html / css )
standard_green ( html / css )
standard_orange ( html / css )
standard_pink ( html / css )
standard_monotone ( html / css )
standard_sepia ( html / css )
※IEだとhtmlが開けないようです。Firedox等で開いてください。文字化けする場合はエンコードをShift_jisにしてください。

fullmoon_howling, white_eagle, standard_wide_whiteのバージョンアップも近日中に行う予定です。

standardシリーズの左右カラムの罫線

当サイトが公開している共有テンプレート standardシリーズにおいて、左右カラムの背景色を変えると各プラグインの下に罫線が表示されてしまうことがありました。

この問題を解決するためには、スタイルシートの末尾に以下を加えてください。

.right_width {
visibility: hidden;
}
.left_width {
visibility: hidden;
}


この修正は次のバージョンアップ (Ver.09) に反映させる予定です。

【2009/07/22 追記】
このカスタマイズは 2009年07月22日以降にダウンロードされたテンプレート(standardならver.09)では実装されています。バージョンはHTMLかCSSの一番下を見ると確認できます。
ブログ内検索1
プロフィール

いたお

Author:いたお
更新は非常にマイペースです
現在休止中です

当サイトはリンクフリーです。

いたおの他の運営サイト
カレンダー
01 | 2017/03 | 02
- - - 1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31 -
なんでもスクロール
このように
縦に長く伸びた
プラグインを
スクロールバーによって
一定の長さに
抑えることが
出来ます。

※スクロールさせる文字やプラグインのHTMLをここに
今日の日付入りカレンダー

01 | 2017/03 | 02
- - - 1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31 -
ユーザータグ


△ ページトップへ戻る
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。