アメブロのデザインカスタマイズ。CSS編集にチャレンジ【その2】

  • このエントリーをはてなブックマークに追加

前回の記事の後、判明した点など。

横幅が980pxになり、広告が増えた

これは、どうやら2011年にアメブロ側が変更したらしい。
画面の最上部にはドーンと広告スペースを設け、到底見栄えがいいとは言えない。
広告が増え、ユーザーからの評価は芳しくない変更だったようす。

サイドバーの「プロフィール」や「ブックマーク」の背景に画像を設定

デフォルトのままだとCSSで背景色や文字色は変えられるけど、個別に画像は出せないかとあきらめかけていた。

しかし、他のブログを見ていて、普通にCSSで書き換えられる仕様だということに気づく。下はプロフィールに画像を設定する場合の書き方。

画像を配置するだけだと、「プロフィール」などのテキストの文字も表示されてしまうので、

の部分でテキストは表示されないよう設定している。
これに関しては、

でも同様に表示されなくできるが、あまり美しくないので。

右側のサイドバーの最上部に出てくる広告の位置を変えたい

広告関連は、当然アメブロ運営側の生命線だし、そもそも広告関連をいじることはできないだろうと思っていた。
しかし、他のブログを見ていて発見したのが

のように、サイドバー全体を下に押し下げておいて、

と、上にもってきたい部分の場所をposition: absolute で指定するという手法。

確かに、これは効くのかもしれないが、さすがに広告周りをいじると、仮にうまくいっても、いずれアメブロ側にサイト毎消される可能性もあるので、実装は避けておいた。

フリープラグインを使って全体の横幅を変更

CSSのカスタマイズではできないが、フリープラグインならできるのかと思いトライしてみたが、

これをフリープラグインに設定すると、確かに横幅が800pxになるものの、結局広告が表示されているサイドバー部分の横幅をいじることはできない。
すなわち、メインコンテンツ部分の幅がやたら狭くなってしまうというわけ。
これでは、とても実用に耐えないので却下。

アメブロ1つをとっても、いろいろとあるもんだ。
勉強にはなった。


サブコンテンツ