このページの記事目次 (タグ: カレンダー の検索結果 2 件)


過去記事で紹介していたソースを 一部変更したので その紹介を兼ねて。。。
相変わらず地味なデザインですが、いつも参考にさせて頂いている hatena chips さんの CSSでテーブルデザインをクオリティアップ を参考に 少しドレスアップしてみました。
個人的には ブログにカレンダーは必要ないのではないかな... と思っています。 日付にカーソルを合わせたら 「記事タイトルが分かる」 とかいう機能があれば別かもしれないですけど、何が表示されるか分からないので まずクリックすることはないです。
それに、SEO対策 を考えるなら カレンダーではなくて 月別アーカイブ の方が優秀だと思います。 あくまでも個人的意見ですが。 どうでしょうか...?
追記: 上の内容は FC2ブログの場合 での話になります。ライブドアブログ のカレンダー などは とても便利な機能 を備えているようです。 (マウスオーバーで記事タイトルが分かり、移動するページも FC2ブログの日付クリック とは動作が異なる。 月別のページのその記事の位置へ移動するリンク なので 行き止まり感がなく便利 です。)
現在の FC2ブログのカレンダー の場合、日付クリックで表示されるページは その日付のみの <!--date_area--> ./blog-date-20080630.html( ← 月単位のページでもなく 固定リンクページ<!--permanent_area-->でもないページ ) です。
ライブドアブログ のように... 例えば、移動先が ./blog-date-200806-0.html#30 (← 2008年6月の<!--date_area-->1ページ目#30日投稿記事の1つ目の位置に移動 ) のようなページ移動 が使えるようになったらもう少し便利になるのかも。。。
キーワード検索 : FC2ブログ カレンダー 空リンク非表示 月別アーカイブ SEO対策






お役に立ちましたら、応援して頂けると嬉しいです(*´`*)
記事を読んで頂きありがとうございます。

URL http://arinogotokuatumarite.blog19.fc2.com/blog-entry-146.html
2010/07/15 ~ | Comment (12) tweet? | ↑ ページ先頭へ ↑ |公式プラグイン「カレンダー」 の スタイル見本 を載せておきます。ユーザーさんは、必要に応じて使ってください。 また、ついでなので...ari_seoシリーズ や 過去記事で紹介した 便利ナビ(+空リンク非表示) を使っている方なら、すごく簡単に設置できる (& それ以外の方でも簡単に設置できる) 空リンク非表示 カレンダー も紹介します。
追記 : 2010/05/28
共有テンプレートに カレンダー用のスタイル設定を標準搭載しておきました。 空リンク非表示カレンダー へ変更する場合も、CSS部分は共通なので そのまま使えます。
FC2 カレンダー用 スタイル設定 (兼: 空リンク非表示 版)

下が 「空リンク非表示」 版 です。未来の月 など 「記事の無い月」 には リンクを張らない (or 月別のページでは 表示されない) ようにしてあります。
便利ナビ に追加してある FCafe danielさんの 月別参照空リンク制御 機能。これを カレンダーの月めくり にも対応させたものです。
table.calender {
width:175px;
border:1px solid #dcdcdc;
border-collapse:separate;
}
.calender caption {
padding:2px;
font-weight:bold;
background:#fff;
}
.calender th#sun {
color:#cc3366;
}
.calender th#sat {
color:#339966;
}
.calender th, .calender td {
border-top: solid 1px #f5f5f5;
border-right: solid 1px #ccc;
border-bottom: solid 1px #ccc;
border-left: solid 1px #f5f5f5;
text-align:center;
font-weight:normal;
color:#999;
}
.calender td a {
display:block;
background:#f5f5f5;
color:#000;
}
.calender td a:hover {
background:#777;
text-decoration:none;
color:#fff;
}
※あくまでも一例なので、色などはお好みで変えてみてください。 詳しい説明は省略していますので、分からない部分 や 「こうしたい」 というのがあれば、コメントしてください。
table.calender { width:175px; } 部分の設定ですが、width:100%; を使ってしまうと IE5.5 ではカラム落ち(レイアウト崩れ) を起こしてしまうようです。。。
[空リンク非表示 カレンダー
公式プラグイン 「カレンダー」 のソースを以下のものと書き換えるだけで使えます。
キーワード検索 : FC2ブログ カレンダー 空リンク非表示






お役に立ちましたら、応援して頂けると嬉しいです(*´`*)
記事を読んで頂きありがとうございます。

URL http://arinogotokuatumarite.blog19.fc2.com/blog-entry-100.html
2009/12/14 ~ | Comment (1) tweet? | ↑ ページ先頭へ ↑ |