タグ:エキサイトブログのCSS編集 ( 4 ) タグの人気記事

ブログの記事タイトルの前後にアイコンを表示する方法

このエキサイトブログで記事タイトルの前後にアイコンを表示するようにスタイルシートを設定してみました。

使用したいアイコンをマイイメージアカウントにアップロードしてから、CSS編集に以下の行を追加します。

div.post h2:before,
div.post h2:after {
content: url("http://pds.exblog.jp/pds/1/201308/11/24/music3.gif");
}


content: 行の " で囲まれた部分がアイコンのURLです。

今回、私は音符のアニメーションGIF画像 アニメーションGIF画像を使用してみました。

【注】 Internet Explorer 8 以前のバージョンではアイコンが表示されません。
[PR]

by pc_klik | 2013-08-13 10:30 | ブログ TIPS

エキサイトブログで地図を中央揃えする方法

エキサイトブログの記事に写真をアップロードするとき、ほとんどの人は写真を中央揃えしていると思います。(エキサイトブログでは中央揃えを指定するのがいちばんレイアウトしやすいので・・・)

でも、記事に地図を載せると地図は左揃えになってしまいますので、写真との配置のバランスが悪くなってしまいます。

そこで、記事に載せた地図を中央揃えする方法を紹介します。

ひとつの地図だけを中央揃えする方法

以下のように、地図を表示する記号の前後を <center> と </center> で囲んでやれば、その地図を中央揃えすることができます。
<center></center>
の部分は地図作成により挿入された地図を表示するための記号で、それに赤字の部分を追加すれば地図を中央揃えすることができます。

地図をいくつも使っていて上記の作業が面倒くさい場合は、以下の方法が便利です。

すべての地図を自動的に中央揃えする方法

エキサイトブログの記事に載せたすべての地図を自動的に中央揃えするには、スキン変更CSS編集画面で以下の行を追加するとよいです。
div.EXBLOGMAP {
margin: 15px auto;
}
15px の部分は上下の余白です。他の数値でもかまいません。


[PR]

by pc_klik | 2012-06-04 19:00 | ブログ TIPS

エキサイトブログで記事と広告を区別しやすくする方法

無料コースで利用しているエキサイトブログでは記事内に広告が表示されるようになっています。

この手の広告では、広告が表示されるブログの内容や閲覧状況などを解析して、そのブログを見に来た人が興味を持つ可能性があると思われる広告が自動的に表示される仕組みになっています。

悪いことに、エキサイトブログでは記事本文とコメントの間に広告が表示されるため、記事と広告の区別がつきづらいです。

そのため、このブログに表示されている広告の商品やサービスを私(ブログの持ち主)が紹介している、あるいは勧めているように思われてしまう心配があります。

そこで、記事と広告の区別がつきやすいように、スタイルシート(CSS編集)を使って、以下のようにしてみました。
  • 広告の上下に区切り線を表示する
  • 広告の上下に100ピクセルの余白を持たせる

具体的には、CSS編集画面で以下の行を追加しました。
div#im {
margin-top:100px;
margin-bottom:100px;
border-top:1px solid #dddddd;
border-bottom:1px solid #dddddd;
}

エキサイトブログの広告を目立たなくする方法も考えられるのですが、あまりやり過ぎてしまうのもうまくないでしょうから、このくらいがちょうどいいかと・・・。

【追記】 コメントを先頭に持ってきたらどうか・・・

上記の方法だと、本文とコメントの間がけっこう離れるので、試しにコメントの表示位置を先頭に持ってきてみました。

でも・・・

やっぱりコメントが記事の前にあると変なので、元に戻しました。
[PR]

by pc_klik | 2012-05-29 11:00 | ブログ TIPS

ブログのデザインをお月見モードに切り替えました

お盆が過ぎてから涼しい日が多くて、秋が来たような気分になってしまいます。
パソコン教室くりっくのブログもペンギンの真夏モードからお月見モードに切り替えました。
d0015124_18574356.gif

素材は、前回と同様に LITTLE HOUSE からいただきました。
[PR]

by pc_klik | 2008-08-22 18:58 | ブログのこと・あれこれ

魚沼情報サービスのホームページへ | パソコン教室くりっくのホームページへ | ブログトップ   昨日:   今日:   合計:
AX