Mr.ポンバシのブログ改造術 part8
こんにちは
Mr.ポンバシです(-^□^-)
今回は僕自身も昨日改造したばかりの
"Google広告の改造"
について書いていきます
具体的な説明に移る前に、この改造に限ったことでなく、みなさんに知っておいていただきたいことがあります
①CSS編集でうまくいかない場合は、フリープラグインを編集すればうまくいくことがある
僕のブログ改造術では基本的に、CSSの最後に追記することで改造する形をとっていますが、それでも上手くいかないことがあります
まず例として、僕が次のような記述をCSSに追記するよう書いていたとします
#register{
display:none;
}
それで皆さんが実際にCSSに追記してみても何も変化が起きなかった場合、次のようにフリープラグインの最後に追記してみてください
<STYLE TYPE="text/css"><!--
#register{
display:none;
}
--></STYLE>
このように本来CSSに書くべき記述をフリープラグインに書く場合には、記述の最初と最後に
<STYLE TYPE="text/css"><!--
--></STYLE>
を書き加えることでCSSの方に書くのと同じ効果が得られます
といってもCSS編集で出来なかったことがフリープラグインでやってみたら絶対出来るという訳ではなく、
あくまでも「できることがある」っていう程度だと思っておいてください
基本的にはCSS編集だけで済ませてください
次に説明するような理由で、あまりこのやり方は推奨しませんので
②フリープラグインには3500字という字数制限ある
①のやり方はあまり推奨しないと言った理由です
フリープラグインはJavascriptを書けたりしてとても便利なプラグインですが、文字数制限が設けられています
3500字というと多く感じられるかもしれませんが、改造をある程度した人なら分かると思いますが、結構少ないんですよね
なんで、出来る限りCSS編集で済むことはCSS編集で済ませたいっていうのが本音ですので、①のやり方は最後の手段ということで覚えておいてください
では！長くなりましたが、Google広告の改造の仕方を説明していきます
ちなみにGoogle広告とは記事の下にある、この画像のような広告のことです
ここでは、背景画像・文字の大きさ・色の設定の仕方を説明します
次の記述をCSSの最後に追記してください
.contents #advertising2{
display:block;
background:url(背景画像のURL) no-repeat !important;//背景画像を繰り返さない
}
#advertising2 *, .advertising2 *, #advertising3 *{
color:#CCCCCC;//広告の文字色
padding:20px 10px;//文字を左から20px、上から10pxの位置に書く
padding-top: 3px;//3つの記事の間の余白
}
ちなみに僕はCSSの方では上手くいきませんでしたが、フリープラグインのほうでやってみたらできました
フリープラグインの場合は
<STYLE TYPE="text/css"><!--
.contents #advertising2{
display:block;
background:url(背景画像のURL) no-repeat !important;//背景画像を繰り返さない
}
--></STYLE>
<STYLE TYPE="text/css"><!--
#advertising2 *, .advertising2 *, #advertising3 *{
color:#CCCCCC;//広告の文字色
padding:20px 10px;//文字を左から20px、上から10pxの位置に書く
padding-top: 3px;//3つの記事の間の余白
}
--></STYLE>
ちなみにフリープラグインの場合は
//背景画像
といった説明文や改行は消しておいてくださいね
上の記述をメモ帳等で編集してからCSSに書き加えるほうがいいです
僕の場合は背景画像は黒板にしていますが、そこは皆さんの好きな画像にしてみてくださいね
何か分からないことがあれば、コメかメッセージください