【第14回】サブページの編集

連載講座:WordPressで作る簡単Webサイト

講座案内ページの編集

  1. [固定ページ一覧] から、「講座案内」を選択します。
  2. [ブロックの追加(+マーク)] をクリックし、カラムブロックを追加します。
  3. 「3カラム:均等割り」のレイアウトを選択します。
  4. 3つのカラムの +マークをそれぞれクリックし画像ブロックを追加します。
    メディアライブラリから画像ファイル(course_word.png / course_excel.png / course_homepage.png)を挿入します。配置は中央揃えにし、設定サイドバーで [画像サイズ:フルサイズ] にします。
  5. 画像の下に、それぞれ3つの講座のタイトルと説明文を見出しブロックと段落ブロックを追加し入力します。見出しブロックでは見出しレベルを [H3] として、テキストの配置は [テキスト中央寄せ] を選択します。
  6. 更新ボタンをクリックし、ページの表示を確認しましょう。

教室案内ページの編集

  1. [固定ページ一覧] から、「教室案内」を選択します。
  2. [ブロックの追加(+マーク)] をクリックし、テーブルブロックを追加します。
  3. [カラム数:2] [行数:5] にして、[表を作成] をクリックします。
  4. それぞれのセルに以下の内容を入力します。
  5. 設定サイドバーで [スタイル:ストライプ] に設定します。
  6. 更新ボタンをクリックし、ページの表示を確認しましょう。

お問合せページの編集

お問い合わせページにはメールフォームを表示します。
メールフォームの作り方にはいくつか方法がありますが、ここではプラグイン「Contact Form 7」を使用して作成します。

  1. [プラグイン]-[新規追加] をクリックします。
  2. [contact form 7] と検索ボックスに入力して検索します。
  3. 「Contact Form 7」をインストールし有効化します。
  4. 管理メニューの [お問い合わせ] をクリックします。
  5. [コンタクトフォーム1] をクリックすると初期設定のフォームが表示されますので、これを改造します。最終的には下記のコードになります。
  6. メールタブをクリックします。
    自分に送られてくるメールの差出人となる [送信元] や、メールの件名となる [題名] を変更します。
    メッセージ本文は、下記の見本のように変更します。これが自分に送られてくるメールの本文になります。

    【見本】

  7. 保存ボタンをクリックします。
  8. [コンタクトフォーム1] の、ショートコードをコピーします。
  9. [固定ページ一覧] から、「お問合せ」を選択します。
  10. [ブロックの追加(+マーク)] をクリックし、カスタムHTMLブロックを追加します。
  11. コピーしたショートコードを貼り付けます。
  12. 更新ボタンをクリックし、ページの表示を確認しましょう。

«次の連載記事»
«前の連載記事»

スポンサーリンク

オンライン講座

Webの基礎マスター講座ページへのリンク


連載講座:WordPressで作る簡単Webサイトページへのリンク

提供しているサービス

WordPressサイト制作出張講座ページへのリンク

WordPress を利用した Webサイト制作の方法を、
あなたのオフィスにうかがいご説明いたします。
料金:¥28,000

サービス詳細ページ >>

申し込みフォーム >>


Webサイト1日公開サービスページへのリンク

一刻も早く Webサイトが必要な方のために、
一緒に作業し1日で公開までもっていきます。
料金:¥28,000

サービス詳細ページ >>

申し込みフォーム >>

スポンサーリンク

ページの先頭へ