【カテゴリ：パソコン ブログカスタマイズの記録】
この『Seesaa』ブログのカスタマイズですが、最近細かな変更を多く行なったため、自分でも具体的にどこをどう変更したか分からなくなってきました。そこで、とりあえず思い出せる範囲でまとめておくことにしました。
1. サイドバーの『最近の記事』を手動で更新するように変更した
一番直近で大きな変更です。
今までは『我RSS』というブログパーツを利用して画像付きの記事タイトルを自動で表示するようにしていましたが、この『我RSS』を利用するのをやめ、手動で更新して表示するようにしました。
表示するための HTML や CSS（スタイルシート）は、『見よう見まね』と『試行錯誤』でなんとか頑張って作り上げました。
独自出力のため制限がなく、『我RSS』のときよりも一部改良することができました。
↓変更後の表示例
『我RSS』を利用するのをやめた理由は、広告として表示されていた画像やタイトルがアダルトっぽいというか、少しエロティックな内容が目立ってきたからです。
スポンサーリンク
と言いつつも、新しい記事を書くたびに手動で『最近の記事』に追加していくのも面倒そうな気がするので、もしかしたらまた『我RSS』の利用を再開するかもしれないです。
2. サイドバーの『最近のコメント』の表示デザインを変更した
以下のような表示に変更しました。
3. サイドバーの『リンク集』の表示デザインを変更した
以下のような表示に変更しました。
4. フッター部分の表示デザインを変更した
フッター部分に以下のような『RSS 出力へのリンク画像』を追加しました。
5. 記事やサイドバーのコンテンツに半透明の背景画像を指定するように変更した
今まで記事やサイドバーのコンテンツの中に背景色や背景画像は指定しておらず、一番外側の背景画像がそのまま見えている状態だったのですが、半透明の背景画像を指定するように変更しました。
これにより、例えば記事を表示している部分は、背景がぼんやりと透けて見えるような形になっています。
↑例として『カレンダー』の箇所ですが、周りの背景とは色合いが微妙に異なっています。
この方法は『Seesaa』ブログに新しく追加された『ルーズリーフ』というブログデザインを試しに表示して気付いたのがきっかけであり、真似してみることにしました。
ちなみに、この『ルーズリーフ:ワイド(両テンプレート)』は右側のサイドバーの幅が広く、また文字も大きくて見やすくなっています。
すごく気に入ったので、機会があればいつか利用してみたいと思いました。
↑『ルーズリーフ:ワイド(両テンプレート)』のデザイン
6. 記事の日付の右側に表示していた画像に動きを加えた
『記事の日付』の右側と、サイドバーの『人気のページ』の右側に表示していた画像を動くように変更しました。
画像にマウスポインタを載せると回転しながら拡大し、マウスポインタを画像から離すと逆回転して元の大きさに戻ります。
CSS（スタイルシート）の機能で実現しています。
『Firefox』や『IE（インターネットエクスプローラー）10』だと表示できますが、『IE 9』とかの古いブラウザでは表示できません。
一応自分が考えたオリジナル技です。
7. 『カテゴリ』ページや『月別アーカイブ』ページの先頭に表示している記事一覧の表示デザインを変更した
以下のような表示デザインに変更しました。
ちなみに今回のデザイン変更とは別に、この『目次のような一覧』を表示する方法自体は以下の記事を参考にさせていただきました。
他にも参考にさせていただいたページがあったような気がするのですが、思い出せません。
変更してから時間が経っているので、もう具体的な変更内容とかすっかり忘れてしまいました。
8. 『CUBACLOCK』のブログパーツをサイドバーから外した
サイドバーに表示していた『CUBACLOCK』というブログパーツですが、サイドバーから外して以下の記事（※）の中に移しました。
※ 参考記事：2012年10月29日 サイドバーに『CUBACLOCK』のブログパーツを設置した
http://kingpcfx.seesaa.net/article/299438206.html
サイドバーから外した理由は、このブログを表示した際に音が鳴ってしまうからです。
『UNIQLOCK』みたいにデフォルトで音を出さないようにする設定ができれば良いのですが、できないみたいなので仕方なく外しました。
9. 『タグ』のページに表示されていた広告を『Google Adsense』の広告に変更した
『タグ』のページに表示されていた『Seesaa』標準の広告を出力しないようにし、『Google Adsense』の広告を表示するように変更しました。
参考までに『Seesaa』標準の広告を出力しないようにするのは、ブログ管理画面の『設定』⇒『広告設定』で『記事下広告の表示』を『広告を表示しない』に設定することで可能です。
以上です。
【追記】2012-11-28 22:00 変更箇所を追加
10. 『Zenback』の表示箇所をフッター部に変更した
ブログパーツの『Zenback』は今まで個別の記事の中に表示していましたが、フッター部分に表示するように変更しました。
10. 『Zenback』の表示箇所をフッター部に変更した
ブログパーツの『Zenback』は今まで個別の記事の中に表示していましたが、フッター部分に表示するように変更しました。
スポンサーリンク
【カテゴリ：パソコン ブログカスタマイズの記録】の最新記事
- 今更ですが、サイドバーにアクセスカウンターを設置した
- 『Seesaa』ブログでカテゴリの一覧表示をツリー化した
- 『Seesaa』ブログで『記事のコンテンツHTML』を新しいソーシャルボタンの仕様に対応させた
- 『Seesaa』ブログで記事の中の画像に枠を付ける方法について
- 『Seesaa』ブログでCSS（スタイルシート）やHTMLを編集する際の手順
- 『Seesaa』ブログで『続きを読む』の文言を表示させる方法を変更した
- 『Seesaa』ブログでディスク使用量が2GBに到達したので『ストレージプラン』を申し込んでみた
- 『Seesaa』ブログのスマホ用ページに『Google Analytics』を設置する手順
- 『Seesaa』ブログに『3D球体タグクラウド』を設置してみた
- 『Seesaa』ブログでカテゴリの一覧を『メニューバー』のように表示させてみた
- サイドバーに『CUBACLOCK』のブログパーツを設置した
- 『Seesaa』ブログで記事本文の右上に『カテゴリ』を表示するようにした
- 『Seesaa』ブログで『続きを読む』の文言を画像で表示することができた
- 『Seesaa』ブログに『LinkWithin』を導入した
- 『我RSS』を利用して『最近の記事』の一覧を画像付きで表示するようにした
- ユニクロのブログパーツ『UNIQLO CALENDAR』と『UNIQLOCK』をサイドバーに設置した
- 『ACR WEB』の『ページランキング』で画像が表示できた
- 『Seesaa』ブログで記事タイトルの右上に画像を表示させてみた
- 『Seesaa』ブログに『ファビコン』を設置した
- 『最近のコメント』と『最近の記事』の一覧にスクロールバーを付けた
フリー素材*ヒバナ * *
市川明彦 (03/26)
初めてコメントさせて頂きます。でも実は何度も寄せて頂いてます＾＾
私は自力にくじけて、結局最後はテンプレを買ってしまったのですが、
それでも気に入らない箇所もあったので、
何度も、あなた様の記事を参考にさせて頂きました。
あなた様のブログのバナーが好きです。深いグリーンのグラデと、
文字が光ったように見えるのと、オンマウスした時に透ける所が
大好きです。
それから、背景画像が一瞬で入れ替わるのが好きで、楽しませて
頂いてます。
色んな画像が回ったりするのも素敵過ぎます＾＾
雪印だけかと思ったら、TOP画像も回ったので、何度も目が回りました
…うそですけど＾＾；
また遊びに来させて下さいね＾＾
またお時間がある時、カスタマイズ記事を書いて下さると嬉しいです。
お邪魔しました＾＾
最近ではカスタマイズする事が少なくなりましたが、以前はこのブログをカスタマイズするにあたって自分も色々な人の記事を参考にさせていただいたので、そのときの事を思い出しました。
現在のデザインは画像が多くごちゃごちゃしていて重たく感じるので、もっとシンプルな方向に変更したいと思っています。
今後変更する際には、またカスタマイズの記事を書いてみようと思います。
あと、今までに自分が行なったカスタマイズの方法やテクニックなどですが、もしかしたら他の人のお役に立てることがあるかもしれないので、完全に忘れないうちにまたいつか記事にして残したいと思いました。