アメブロのスキンをカスタマイズ~ブログの横幅を大きくする~

アメブロの横幅

 

アメブロのヘッダー画像を自分だけのオリジナル画像に変えたいという方はこちら

 

今日は写真家さんのためのアメブロのカスタマイズ。

というのも、写真をメインとしたブログをアメブロでやってる写真家は多いと思うのですが、

アメブロのカスタマイズ可能なスキンでは、ブログ全体の横幅がだいたい760~800pxしかなく、

そこからサイドバーの幅が約160pxぐらい引かれて、記事本文部分は600pxぐらいになってしまいます。

3カラムのデザインの場合はさらに160px引かれて・・・。

自慢の写真を大きく見せたいのに、最大でも600px以下でしか見せることができません。

横幅220pxのサムネイルをクリックすれば大きく表示はされますが、

ブログを見ている読者にとって、写真の数が多くなればなるほどその作業はとても面倒です。

 

そこで、ブログの横幅を大きくして、表示させる写真の最大サイズも大きくしてしまおうということです。

実際にアメブロの横幅を大きくしてみました。

http://ameblo.jp/dollsent/

アメブロの横幅

 

ここで重要になるのはアメブロの最大画像サイズ。

アメブロに横幅801px以上の写真をアップロードすると、勝手に800pxに縮小されるようです。

なので、ブログ記事部分の広さをそれ以上大きくしても無意味ということで、800pxにしてみます。

まずはアメブロにログインして、「ブログを書く」⇒「デザインの変更」⇒「cssの編集」とクリック。

アメブロの横幅

 

css編集枠を最後までスクロールし、以下をそのままコピペして保存。

/* スキン全体の幅 */
#frame{
width:1000px;
margin-left:auto;
margin-right:auto;
}
/* 記事幅変更 */

#main{
width:800px;
float:left;
padding-left:10px;
}
/* サイドバー左 */

#sub_a{
width:180px;
float:left;
z-index:1;
}
/* サイドバー右 */

#sub_b{
width:180px;
float:right;
z-index:2;
}

アメブロの横幅

 

これだけでブログ全体の幅が大きくなります。

ただし、ベーシックスキンをお使いの方は以下も一緒にコピペしてください。

#wrap{
width:1000px;


}

 

でも、ヘッダー画像だけが今まで通りのサイズで表示されているのではないですか?

ヘッダー画像も800px以上のサイズにしたいという方はこちらをご覧ください。

 

で、肝心の写真の投稿方法についてですが、

それについてはアメブロで大きな写真を投稿する方法をご覧ください。

人気ブログランキングで今何位?

アメブロのヘッダー画像を無料で作成

↓↓ブログランキングの応援していただけると嬉しいです↓↓

にほんブログ村 釣りブログ バスフィッシングへ にほんブログ村 釣りブログ 東海釣行記へ にほんブログ村 釣りブログへ

 

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

この記事の著者

kazushi釣りと生き物をこよなく愛するWEBデザイナー

釣りと焼酎が好きなWEBデザイナー。夜な夜な真っ暗な部屋で水槽を眺めながら呑んでいます。最近のマイブームはハンドメイドルアー制作。琵琶湖のほとりでひっそりとWEB制作事務所を営んでいます。

この著者の最新の記事

関連記事

カテゴリー

アーカイブ

ブラックバス釣りブログランキング

にほんブログ村 釣りブログ バスフィッシングへ

にほんブログ村 釣りブログ 東海釣行記へ

ページ上部へ戻る