ブログ全体の幅やサイドバーの幅を設定する

広告
eyecatch

ブログ全体の幅やサイドバーの幅は決められた範囲内であれば管理画面から簡単に変更することができます。ここではブログ全体の幅とサイドバーの幅を変更する手順について解説します。

ブログの幅の設定画面を表示する

ブログ全体の幅やサイドバーの幅を設定するには Blogger の管理画面左側に表示されている「テーマ」をクリックしてください。

ブログの幅の設定画面を表示する(1)

「テーマ」画面が表示されます。

ブログの幅の設定画面を表示する(2)

「ブログで使用中」の下に表示されている「カスタマイズ」をクリックしてください。

ブログの幅の設定画面を表示する(3)

テーマの編集画面が表示されます。

ブログの幅の設定画面を表示する(4)

画面左上に表示されている「幅を調整」をクリックしてください。

ブログの幅の設定画面を表示する(5)

ブログの幅を設定する画面が表示されます。

ブログの幅の設定画面を表示する(6)

ブログ全体の幅とサイドバーの幅を設定する

現在使用している「シンプル」テーマでは、デフォルトでブログ全体の幅が 960px で右側サイドバーの幅が 310px となっています。

ブログ全体の幅とサイドバーの幅を設定する(1)

記事の本文などが表示されるメインの幅は、ブログ全体の幅からサイドバーの幅を引き、他にパディングなどの値を引いた値となります。デフォルトでは 630px となっているようです。

幅の設定はブログ全体の幅とサイドバーの幅を設定できます。この 2 つの幅を設定することで結果的にメインの幅も決まります。変更するにはスライダーを左右に動かして変更するか、右側に表示されているテキストボックスに直接値を入力してください。

ブログ全体の幅とサイドバーの幅を設定する(2)

例としてブログ全体の幅を 1200px 、サイドバーの幅を 450px に設定してみます。設定を変更すると画面下部に表示されているプレビューに反映されますのですぐに確認できます。

ブログ全体の幅とサイドバーの幅を設定する(3)

なおデフォルトの値に戻したい場合は「幅をテーマのデフォルトにリセット」をクリックしてください。

ブログ全体の幅とサイドバーの幅を設定する(4)

設定が終わりましたら画面右上に表示されている「ブログに適用」をクリックしてください。テーマに対して行った変更が保存されました。

ブログ全体の幅とサイドバーの幅を設定する(5)

これで幅の設定は完了です。 Blogger の管理画面に戻る場合は画面右上に表示されている「Bloggerに戻る」をクリックしてください。

それではブログへアクセスしてみます。ブログ全体の幅やサイドバーの幅が変更前よりも広くなっていることが確認できます。

ブログ全体の幅とサイドバーの幅を設定する(6)

-- --

ブログ全体の幅とサイドバーの幅を変更する手順について解説しました。

( Written by Tatsuo Ikura+ )

関連記事 (一部広告含む)
Profile
profile_img

著者 / TATSUO IKURA

初心者~中級者の方を対象としたプログラミング方法や開発環境の構築の解説を行うサイトの運営を行っています。