WordPress

アフリエイトブログの作成と運営を考える

WordPressで「ホームページ」をつくる!STEP9トップページを作り込む

スポンサーリンク

1、TOPページを作りこむ

トップページのコンテンツ内容を作り込んでいきます。

1-①、お店の紹介文を載せる

f:id:yumeji773:20170314180830p:plain

 

1-②、画像の下に文章を入力

固定ページ一覧からトップページの編集画面を開いたら画像の下に文章を入力し、文章を中央寄せにして雰囲気を出してみます。

 

ダッシュボード> 固定ページ一覧>トップページ編集

 

f:id:yumeji773:20170314180956p:plain

 

1-③、おすすめのメニュー一覧を表示する

ダッシュボード> 固定ページ一覧>トップページ

 

f:id:yumeji773:20170314181213p:plain

1-④、ギャラリー機能を使う

メディアを追加する編集画面から「メディアを作成」をクリックします。

 

ダッシュボード> 固定ページ一覧>トップページメディアを追加>メディアを作成

 

f:id:yumeji773:20170314181311p:plain

1-⑤、キャプションにメニュー名を記入

ギャラリーに入れる画像を選択したら、キャプションにメニュー名を記入してみましょう。また、全体の幅をそろえるためにカラムは「4」に設定します。設定できたら「ギャラリーを挿入」をクリックしましょう。

 

ギャラリーに入れる画像を選択>キャプションにメニュー名を記入>ギャラリーを挿入

 

f:id:yumeji773:20170314181401p:plain

 

画像がギャラリーとして表示されているのが確認できると思います。

 

f:id:yumeji773:20170314181441p:plain

 

2、おすすめのメニュー一覧(見出し)を表示する

次に追加したギャラリーの上に、メニュー一覧を表す見出しを付けてみましょう。

見出しは入力したテキストを選択して以下のタブから選択可能です。

2-①、「見出し2」を使います。

見出しを変更すると、テキストのサイズが変化することが確認できると思います。

 

f:id:yumeji773:20170314181550p:plain

 

ギャラリー一覧の上部に「メニュー」という見出しを表示させることができます。

 

f:id:yumeji773:20170314181626p:plain

見出しは一見どれでも使って良いように思えますが、実は使うための決まりがあります。

2-②、見出しは目次の項目に相当する

目次と同じようにルールを無視してはいけません。見出しはページ内の目次として親子構造を示すために使うので、図示すれば以下のようになります。

見出し2
  見出し3
  見出し3
  見出し3
    見出し4
    見出し4
  見出し3
見出し2
  見出し3

実際の使用例は、以下のような形です。

見出し2:会社概要
見出し3:所在地
見出し3:電話番号
見出し3:会社地図
見出し2:会社沿革
見出し2:代表者挨拶

見出しを付ける時は、このように必ず文章の親子構造にしたがうようにします。

nandemo-nobiru.com

 

3、フッターを作る

フッターに店舗情報を表示してみましょう。

 

f:id:yumeji773:20170314182234p:plain

3ー①、フッターにテキストを表示する

フッターウィジェットを使用します。

ウィジェットの編集画面から「フッター左」のタブを開いて、「テキスト」をドラッグ&ドロップします。

 

f:id:yumeji773:20170314182318p:plain

 

次に「テキスト」ウィジェットの編集画面を開いて以下のように店舗情報を入力していきます。「自動的に段落を追加する」の項目にはチェックを入れておきます。

 

f:id:yumeji773:20170314182354p:plain

入力したら「保存」をクリックしましょう。

これでフッターに店舗情報を表示することができます。

 

f:id:yumeji773:20170314182433p:plain