固定ページ「事務所概要」

固定ページ「事務所概要」を作成する

ホームページの中に事務所の情報を入れることは、とても重要です。
信頼され、連絡が取りやすいような「事務所概要」ページを作成しましょう。

ここでは、有料テーマ「Precious」と、プラグイン「CustomFieldTemplate」と「Tiny MCE Advanced」がインストール、有効化され、プラグイン「CustomFieldTemplate」には、「CustomField data」がアップロードされていることが前提条件となります。

※ホームページ制作オンライン講座を受講の方は、「Tiny MCE Advanced」のインストールと有効化だけで大丈夫です。

 

PCやスマホで解説動画を見ながら作業を進め、一通り終わったら、このページの解説を読みながら確認すると分かりやすいと思います。

 

固定ページ「事務所概要」作成 解説動画

固定ページで「事務所概要」を作成する方法を解説しています。

 

固定ページの新規追加

左のサイドバー「固定ページ」の「新規追加」をクリックします。

右のサイドバー「ページ属性」のテンプレートを<デフォルトテンプレート>から<Company>に変更します。

タイトルに事務所名を入力し、パーマリンクを英数字に編集します。
ここでは「office」に変更しました。

本文の下の「カスタムフィールドテンプレート」を使用して、事務所概要の表を作成します。

<会社情報の見出し>に「事務所概要」と入力します。

<会社情報>の右の<新規追加>の文字をクリックして、「項目名」と「項目に対する情報」欄を増やしながら入力していきます。

このカスマムフィールドテンプレートを使用することで、右下の図のように、項目名と項目に対する情報が自動的に表として表示されます。

<会社情報>の右の<新規追加>をクリックして「項目名」と「項目に対する情報」の欄を増やしながら、事務所概要をすべて入力します。

「項目名」と「項目に対する情報」をすべて入力したら、<地図情報>を入れていきます。
<アクセスマップの見出し>には、「アクセスマップ」と入力します。

次に<アクセスマップ(Google mapの iframeコードをご登録ください)>の欄に、iframeコードを入力します。
iframeコードの取得方法は、次の通りです。

Google Chromeの検索バーに事務所住所を入力すると、次のような地図が表示されます。
この地図上にポインタを合わせ、クリックします。

次のような表示に変わるので、「共有」をクリックします。

下の通り、「地図を埋め込む」をクリックします。

<iframe から始まるiframeコードが表示されます。
「HTMLをコピー」の文字をクリックすると、iframeコードが範囲指定され、コピーされます。

ダッシュボードに戻り、<アクセスマップ(Google mapの iframeコードをご登録ください)>の欄に、先ほどコピーしたiframeコードを貼り付けます。

「公開」ボタンをクリックします。

上のバーの「固定ページを表示」の文字をクリックし、「事務所概要」ページを表示させます。

次のように表示されるのを確認しましょう。

地図も確認しましょう。

なお、次の赤枠部分「本文」に、事務所の画像やご挨拶文を入れてもいいでしょう。
この部分は、事務所名と事務所概要の間に表示されます。

また、<地図情報>の<アクセスマップの補足説明>には、駅からの道順や出口番号等、事務所までのアクセスに関する補足説明を入れることができます。

 

関連記事

  1. 記事にサイト内のリンクを貼る

  2. 固定ページ「お問い合せ」を作成

  3. WordPressインストール時に自動的に作成される記事

  4. プラグイン「Contact Form 7」を使い、お問い合せ…

  5. 記事内に外部リンクを貼る方法

  6. 準備シートを使い、記事を作成する

ブログ一覧