【STEP 2】ページデザインをカスタマイズしよう

【1】サイトのデザインを確認しよう

サイトの編集画面（サイトエディタ）の右上にPCとスマホのボタンが表示されています。このボタンでサイトエディタの表示を、PCまたはスマホに切り替えられます。このSTEPでは、PCのデザインを編集していくので、PCのボタンを選択しましょう。

【2】ページを選択しよう

画面左側「サイトマップ」では、サイトのコーナーとページの一覧が表示されています。まずはTOPページの背景画像を変更するので、サイトマップからTOPページの歯車マークをクリックし、「プロパティ設定」を開いてみましょう。

【3】エリアを選択しよう

「ページデザイン」の「背景画像」から、画像を変更したいエリアを選択します。ここでは、ビルボードの背景画像をクリックし、「画像ファイルを選択」をクリックしましょう。

「ビルボードエリア」は、ページを開いたときに最初に目に入るファーストビューの部分で、画像や見出しを使ってそのページの一番重要な情報を伝えられるエリアです。
他のエリアやゴーストヘッダーの役割も知るとレイアウトの幅が広がりますよ。

【4】画像を準備しよう

画像フォルダが開くので、使いたい画像をアップロードしてみましょう。画像をお持ちではない場合は、画像配布サービスUnsplashから無料で画像が取得できます。イメージに合う画像を探し、オリジナルサイズで取得してみましょう。

【5】画像を選択しよう

ユーザフォルダから背景画像に設定したい画像を選択します。「適用」をクリックすると、背景画像が切り替わり、あなたのオリジナルのページになります。

【6】ブログコーナーの背景画像を変更しよう

ブログコーナー内のページも背景画像を変更します。２〜5と同様の手順で、ビルボードエリアの背景画像を変更しましょう。
※ブログ機能「BiND Press」で使用するコーナーです。「template.list」「template.detail」は非公開の状態にしておきます。

【7】全ページの背景画像を変更しよう

テンプレートに入っている画像はサンプル画像のため、全てのページの背景画像を変更しましょう。残りはガイドコーナーの中にある「プライバシーポリシー」と、ページのテンプレートとなる「temp」です。サイトマップからページを選択し、２〜5と同様の手順で、ビルボードエリアの背景画像を変更しましょう。