さがみはら〜の

日本国内で政令指定都市を3つ持つのは神奈川県だけ。横浜・川崎そして相模原。10年後には神奈川県で唯一リニア新幹線が開通!緩やかだが確実に発展するこの町の雰囲気を最近引っ越して来たおっさんがまったり紹介する。と言う体の日常系ブログ

デザインcssに一文を追加するだけで、すべての記事の写真を一定のサイズに統一する方法

はてなブログをやっている皆さん!

写真のサイズをいちいち変更するの面倒ですよね!

 

私は面倒です!

というか、本当にめんどくさいと感じました(;´Д`)

 

はてなブログってブロガーの為のブログだと思っていたので、

一切手を加える必要はないかな。と思っていたんですが、

もう、一々画像のサイズを変更するのは耐えられない!

 

→じゃあ載せる写真の量を減らせ!

ってツッコミもありなんですが、

 

ここ相模原を紹介するブログだしぃ!写真載せない訳に行かないし!

何より、おじさんが写真を載せたいの!(←だだをこねるおっさんの図)

 

そこで、仕事柄、htmlやcssをいじる機会があるので、

それを使って、すべての記事で画像を一定サイズに設定する方法を

ここに載せておこうと思います。

 

まずはダッシュボードからデザインへ飛びましょう。

デザインへ

↑これです。

 

デザインページ

 

その次に、真ん中の工具をクリックして、

一番下にあるデザインcssというところ開きます。

 

そこで何やらコードを書く欄があるので、

そこにこのコードを追加しましょう。

 

ーーーーーー

/*記事の画像のサイズ固定指定*/

.entry-content img{

width:420px;
height:auto;

}

ーーーーーー

コピべした後は、しっかりと保存ボタンを押していただければ、

作業は終了です。

 

これをやることで、記事編集画面で画像のサイズをいじらなくても、

記事を投稿したり、プレビューをするだけで、サイズが420pxに設定されます。

※420pxはお好きなサイズに変えてください。

 

ただし、これの悪いところは、

すべての画像サイズが有無を言わさず一定になってしまうことです。

 

編集画面でどんなにサイズを指定しても、記事を投稿すれば

cssで指定した420pxになってしまいますので。

 

私みたいに、サイズの大きな写真ばかり使う人や、

いつも記事に貼付けているサイズが一定の人にしか合わないやり方です。

 

参考までに。。。

 

--2015.4.1更新---

widthの部分をmax-width:420px;

にした方が、

420pxより大きな画像は420pxになり、

420pxより小さな画像はそのままのサイズに統一されるので

 

こちらの方がいいですね。