ウェブサイトのレイアウトを変更する
サイトのレイアウトは、以下の要素から構成されています。
- ヘッダ:これは、バナー画像や会社ロゴを配置する最上部のエリアです。ヘッダでは、以下の操作を実行できます。
- バナー画像とロゴをヘッダエリアからページ内の任意の場所に移動する。
- ヘッダからすべての要素を削除して、ヘッダの高さを 25 ピクセルまで縮小する。
- ヘッダの幅をデフォルトサイズから 100% から変更して、ページの幅に合わせて伸縮するようにする。
- コンテンツエリア:大部分のコンテンツが配置される、ウェブページのメインエリアです。コンテンツエリアでは、以下の操作を実行できます。
- コンテンツエリアの高さを調整する。
- コンテンツエリアを複数カラムに分割する。これには、新しいモジュールをコンテンツエリアの左端または右端にドラッグして挿入します。
- コンテンツを左または右に移動して、コンテンツエリアのカラムの場所を変更する。
- サイドバー:これらは、任意のモジュール(サイト共通またはページ固有)を配置するために使用できる垂直カラムです。サイドバーでは、以下の操作を実行できます。
- サイドバーを 1 つ追加して、コンテンツエリアの左または右に配置する。
- サイドバーを 2 つ追加する。2 つのサイドバーは、コンテンツエリアの左と右に配置されます。
- サイドバーの高さと幅を調整する。
- サイドバーをページの上部に移動して、ヘッダエリアの左または右に配置する。
- サイドバーの位置を入れ替える。
- フッタ:これは、一般に会社名、連絡先、著作権表示などが記載されている最下部のエリアです。フッタでは、以下の操作を実行できます。
- フッタからすべての要素を削除して、ヘッダの高さを 25 ピクセルまで縮小する。
- フッタの幅をデフォルトサイズから 100% から変更して、ページの幅に合わせて伸縮するようにする。
- フッタの下の広告ブロック:ホスティングプランによっては、ホスティング事業者の広告がウェブサイトフッタの下の追加テキストブロックに表示されます。このような広告ブロックを表示したくない場合は、ホスティングプランをアップグレードすることができます。
サイトのレイアウトを変更するには:
- [デザイン]タブ [レイアウト]タブの順に選択します。
- サイドバーの数を選択します。[サイドバー]の下で、なし、1、2 のいずれかを選択します。
- サイドバーの位置を選択します。
- ウェブサイトの別サイドにサイドバーを移動するか、サイドバーの位置を入れ替える(サイト内でサイドバーを 2 つ使用している場合)には、[サイドバーをスイッチ]をクリックします。
- ページの上部にサイドバーを移動するには、レイアウトモデルでサイドバーをクリックします。
- ページ要素のサイズを設定する:
- ウェブサイトの合計幅を設定するには、[ウェブサイトの幅]の下で以下のいずれかを選択します。
- 固定レイアウト:ウェブサイトは、ページを表示しているブラウザウィンドウのサイズを問わず、決まったサイズとなります。この場合、ウェブサイトの幅をピクセル単位で指定してください。
- 可変レイアウト:現在のブラウザウィンドウのサイズに対する割合で表示されます。この場合、ブラウザウィンドウのサイズに対する割合をパーセントで指定してください。
- ページの幅に合わせてヘッダ、フッタ、メインコンテンツエリアの幅を変更するには、レイアウトモデルで該当する要素をクリックしてください。
- [カラムの最小高(ピクセル)]で、メインコンテンツエリアと各サイドバー(使用する場合)の高さを指定します。
この値は、コンテンツなしでのウェブサイト要素の高さを示します。メインコンテンツエリアとサイドバーにコンテンツを追加すると、コンテンツに合わせて高さが拡張します。
- サイドバーとコンテンツエリアの高さを揃えるには、[サイドバーとコンテンツエリアをフッタまで拡大する]チェックボックスをオンにします。
- サイドバーを 1 つまたは 2 つ使用する場合は、[サイドバーの幅(ピクセル)]で各サイドバーの幅を指定します。メインコンテンツエリアのサイズは、自動的に決まります。
- [余白のサイズ(ピクセル)]で、縦横の余白のサイズを指定します。余白とは、隣り合う要素の境界と境界の間のスペースです。
- ウェブサイトの合計幅を設定するには、[ウェブサイトの幅]の下で以下のいずれかを選択します。
- [OK]をクリックして変更を保存します。