- 2011-1-6
- アメブロのカスタマイズ
- コメント:2件
アメブロのヘッダー画像を自分だけのオリジナル画像に変えたいという方はこちら
アメブロのスキンをカスタマイズ~サイドバーのタイトルを画像にする~の追記。
サイドバーに配置できる全てのcssを紹介します。
全てcss編集欄の一番下にコピペして赤字を編集すればOKです。
プロフィール
#profile .menu_title{
background-image: url(ここにアップロードした画像のURL);
text-indent: -9000px;/* タイトル文字を消す */
height:36px; /* 画像の高さ */
}
読者一覧
#reader .menu_title{
background-image: url(ここにアップロードした画像のURL);
text-indent: -9000px;/* タイトル文字を消す */
height:36px; /* 画像の高さ */
}
お気に入りのブログ
#favorite .menu_title{
background-image: url(ここにアップロードした画像のURL);
text-indent: -9000px;/* タイトル文字を消す */
height:36px; /* 画像の高さ */
}
最近のコメント
#recent_comment .menu_title{
background-image: url(ここにアップロードした画像のURL);
text-indent: -9000px;/* タイトル文字を消す */
height:36px; /* 画像の高さ */
}
最近の記事一覧
#recent_entries .menu_title{
background-image: url(ここにアップロードした画像のURL);
text-indent: -9000px;/* タイトル文字を消す */
height:36px; /* 画像の高さ */
}
テーマ一覧
#theme_list .menu_title{
background-image: url(ここにアップロードした画像のURL);
text-indent: -9000px;/* タイトル文字を消す */
height:36px; /* 画像の高さ */
}
カレンダー
#calendar .menu_title{
background-image: url(ここにアップロードした画像のURL);
text-indent: -9000px;/* タイトル文字を消す */
height:36px; /* 画像の高さ */
}
アーカイブ
#archives .menu_title{
background-image: url(ここにアップロードした画像のURL);
text-indent: -9000px;/* タイトル文字を消す */
height:36px; /* 画像の高さ */
}
ブログ内検索
#search .menu_title{
background-image: url(ここにアップロードした画像のURL);
text-indent: -9000px;/* タイトル文字を消す */
height:36px; /* 画像の高さ */
}
ブックマーク
#bookmark .menu_title{
background-image: url(ここにアップロードした画像のURL);
text-indent: -9000px;/* タイトル文字を消す */
height:36px; /* 画像の高さ */
}
ランキング
#ranking .menu_title{
background-image: url(ここにアップロードした画像のURL);
text-indent: -9000px;/* タイトル文字を消す */
height:36px; /* 画像の高さ */
}
PR
#defaultAd .menu_title{
background-image: url(ここにアップロードした画像のURL);
text-indent: -9000px;/* タイトル文字を消す */
height:36px; /* 画像の高さ */
}
ブログランキング応援していただけると嬉しいです↓
実際にこぷきんさんのcssを見てみないと分かりませんが、おそらく以下どちらかが原因だと思います。
1.cssの記述ミス
2.サイドバーフリープラグインによるもの
まず1に関しては、しっかり見直してみてください。
たとえばプロフィールを指定するcssで、
■正しい記述
#profile .menu_title{
background-image: url(ここにアップロードした画像のURL);
text-indent: -9000px;/* タイトル文字を消す */
height:36px; /* 画像の高さ */
}
■間違った記述
#profile .menu_title{
background-image: url(ここにアップロードした画像のURL);
text-indent: -9000px;/* タイトル文字を消す */
height:36px /* 画像の高さ */
}
このようにパッと見は一緒でも、「;」や「}」を誤って削除してしまっただけでも正しく表示されません。
続いて2について。
こぷきんさんのブログは右サイドバーにフリープラグインをいくつも使っていますが、
僕の予想ではたぶんこれらの影響ではないかと思います。
一度、サイドバーの配置を設定するところで右サイドバーに置いてある「フリープラグイン」を外して保存し、
ブログの表示を確認してみてください。(たぶんこれで直るのではないでしょうか)
アメブロはフリープラグインとの相性が悪いとエラーが発生し、ブログの表示に影響が出る場合があります。
これが原因だった場合、どのプラグインとの相性が悪いのかを見つけて、それを削除するしか方法はありません。
ちなみにいただいたコメントとこのコメントは勝手ですが数日後に、
「アメブロのスキンをカスタマイズ~サイドバーのタイトルを画像にする編~追記」
に移動させていただきます。
他の方の参考にもなると思いますので。
初めまして!アメブロのカスタマイズの際、こちらのブログに大変助けられています。ありがとうございます。
質問なんですが「アメブロのスキンをカスタマイズ~サイドバーのタイトルを画像にする編~追記」を参考に画像を張り付けたのですが私のPCでは全て反映されても他のPCやiphoneではいくつかしか反映されないのです。今もその状態なので見て頂けると思うのですが。
PXは調節してあります。
お時間がある時で結構なのでアドバイス頂ければと思います。