from :: Asahikawa Hokkaido

passer-by198

primetime pencil

2009/11/30


Posted

Bloggerでバック ナンバーと読者ガジェットの見出し(h2)に画像を使う記述

Blogger のガジェットで…

バック・ナンバーと読者のガジェットは…

default のままでは…

タイトルは…文字が表示されるだけです…

なんとも…味気ない…

オイラのように…

気に入ったテンプレートも無い…

しかも…ヘルプを読んでも…不親切で…

カスタマイズは…敷居が高い…

そんな…生きる希望を失う寸前の…

オイラのようなオヤヂ世代の為に…

専門知識も無いくせに感覚だけで書いています…

でわ…本題…

編集ページまでは同じなので過去記事参照で…

いきなり記述から…

Sidebar Content に以下を追加
  1. .sidebar h2 {
  2. background:url(アップした画像のURL) left no-repeat;
  3. border:0;
  4. line-height:30px;
  5. color:#2222FF;
  6. text-align:center;
  7. letter-spacing:1px;
  8. font-size:14px;
  9. font-weight:bold;
  10. }
少し説明…
  • 1列目:サイド・バーの見出し
  • 2列目:背景画像・左揃え・繰り返さない
  • 3列目:枠線非表示
  • 4列目:画像の高さ30ピクセル
  • 5列目:文字色
  • 6列目:文字位置中央
  • 7列目:文字間隔1ピクセル
  • 8列目:文字サイズ14ピクセル
  • 9列目:太字で表示
  • 10列目:大事ですから忘れずにコピペ
現在は以下の方法で表示しています…

 Bloggerで見出しに文字を表記させずに文字入り画像を使う記述…HTML編


 Bloggerのページャーに画像を使う記述…HTML編


 Tonttu/テンプレート編集に必須な「CSS Sprites」作成ツールの使い方と「HTML」マークアップ


 Google Bloggerで絵文字を使うためのTips【CSS Sprites 編】




0 Comments :

「jQuery」と「jQuery UI」で HTML に彩りを添えよう…


「導入」「Button」「Accordion」「Tabs」「Effects/Slide」
「Progressbar」「Dialog」「Tooltip」「Menu」
「Extra」 / 公式「Widgets」以外の「jQuery UI」スクリプト
Blogger Template Customize Universal / INDEX

Blogger テンプレート・カスタマイズ / 全般を解説
高速化・最適化対策の結果と備忘録