Diverでサイトの横幅を設定する方法|初心者向けマニュアル
Diverでサイトの横幅を設定する方法|初心者向けマニュアル
Diverでは、サイトの横幅を自分で設定できるようになっています。

設定できるのは、下記の3つです。

  • サイト全体のサイズ
  • 個別ページメインカラム
  • サイドバー

今回は、このサイトサイズの設定方法を詳しく解説します。

サイズ設定メニューを開く

まず初めに、サイズ設定のメニューを開きましょう。

WordPressのダッシュボード左メニューから、『外観カスタマイズ』という順にクリックします。

『外観→カスタマイズ』という順にクリックして進む

『外観→カスタマイズ』という順にクリックして進む

カスタマイズページが開くので、画面左メニュー内の『サイズ設定』をクリックしましょう。

『サイズ設定』をクリック

『サイズ設定』をクリック

ここで、サイトサイズを設定します。

Diver サイズ設定メニュー

Diver サイズ設定メニュー

サイト全体のサイズ

「サイト全体のサイズ」は、画面の大部分を占めるエリアです。

下記画像でいうと、記事一覧の左端からサイドバーの右端までを含めた部分になります。

サイト全体のサイズ

サイト全体のサイズ

「サイト全体のサイズ」では、下記2種類の横幅を設定することができます。

  • 大[1201px~]の横幅
  • 中[769px~1200px]の横幅

1201px以上の大きな画面、769〜1200pxの画面に対して、それぞれ設定可能です。

また、サイズの指定方法には下記の2種類があります。

  • %(パーセント)で指定
  • px(ピクセル)で指定

%を使うと、画面全体に対して指定した割合で横幅が設定されます。

pxは、入力したピクセル数がそのまま横幅として設定されます。

 サイズを指定できるのはPC用の画面のみです。
スマートフォンでは常に横幅100%で表示されます。

個別ページメインカラム

上記のサイト全体のサイズとは別に、個別ページ(投稿・固定ページ)の横幅も設定することができます。

設定方法は「サイト全体のサイズ」と同じです。

サイドバー

サイドバーも横幅を設定できます。

サイドバー

サイドバー

「サイト全体のサイズ」「個別ページメインカラム」では、%(パーセント)とpx(ピクセル)のどちらかで指定できましたが、サイドバーはpxで指定する必要があります。

 デフォルトでは310pxに設定されています。
310pxにすると、レクタングル広告をそのままの状態で綺麗に表示することができます。

メインコンテンツのサイズは自動的に決まる

メインコンテンツとは、「サイト全体のサイズ」のうち、サイドバー以外のエリアのことを指します。

トップページなら記事一覧、個別ページなら各ページの本文部分です。

メインコンテンツ

メインコンテンツ

メインコンテンツは横幅を指定することができません。

下記の計算式で自動的に設定されるようになっています。

サイト全体のサイズ - サイドバーの横幅 = メインコンテンツの横幅

まとめ

今回は、Diverのサイトサイズの設定方法を解説しました。

サイトサイズは、コンテンツの見やすさに直接関わってくる部分ですので、細かく調整して一番見やすいサイズに設定しておきましょう。

スポンサーリンク

スポンサーリンク

アンケート実施中

テーマニアの内容をさらに充実させるため
アンケートを実施中です。

ご協力お願いいたします。

おすすめの記事