WordPressで作成したホームページの基本的な操作方法をご紹介しています。
こちらを参考にホームページの運営にお役立てください。
WordPressとは
WordPressとは、ブログやWebサイトを作ることが出来るCMS(コンテンツマネジメントシステム)のひとつで、世界中で人気のあるサービスです。操作も直感的に分かりやすいのでHTMLに不慣れな方でも短時間でブログやWebサイトの更新が出来るようになります。
管理画面へのアクセスもPC・携帯どちらからでも行えるようになっています。
今回は、WordPressのテーマの中で最も人気の高いCocoonというテーマを使用しています。
WordPressのテーマとは、Webサイトのデザインや機能のテンプレートを指します。
管理画面へのログイン方法
WordPressログイン画面にアクセスするには、サイトのURLの末尾に/wp-admin/を追加します。
例：https://ご自身のサイトURL/wp-admin/
すると下記画像のような管理画面へアクセスすることができます。
ユーザー名またはメールアドレス・パスワードを入力し、ログインをします。
ご契約時にお伝えしたパスワードを入力してください。
WordPressの管理画面へのログインは、パソコン・携帯どちらからでも可能です。但し、携帯でのご使用については一部使用できない機能もございます。
Webサイトの確認
管理画面にログインできたらまずは、現在のサイトがどのようになっているか確認してみましょう。
確認をするには、管理画面左上の「マネーラボラトリー ◯◯校」をクリックして確認することができます。確認後、管理画面に戻りたい場合も同じ場所をクリックすると戻ることができます。
サイト基本情報の設定
次にサイト基本情報を確認しておきましょう。
サイト基本情報とは、サイトのタイトル、キャッチフレーズ、サイトアイコンの3つの設定をになります。こちらの3つはすでに事務局側で設定してありますが、必要に合わせて設定の変更も可能になりますので、どこから変更できるのか確認しておきましょう。
サイトのタイトルとは、検索エンジンで検索した結果ページに表示される見出し（タイトル）のことです。
キャッチフレーズとは、サイトの内容・目的を端的に表した文章になります。
サイトアイコンとは、主にファビコンと呼ばれる検索時に表示される小さい画像で使われます。
こちらがWordPressの管理画面になります。メールアドレス・パスワードを入力後にログインするとこのような管理画面にアクセスすることができます。
サイト基本情報を確認するには、管理画面左にあるメニューの中から
・【外観】へマウスを重ね、【カスタマイズ】を選択。
・【サイト基本情報】という項目が出てくるのでそちらを選択。
・【サイトのタイトル】【キャッチフレーズ】【サイトアイコン】の3つの項目が出てきたのでこちらから必要に応じて変更します。
記事を投稿
それでは、セミナー開催日程を投稿という機能を使ってお知らせしてみましょう。
投稿とは、ブログ記事を書く機能で、お知らせなどの情報を載せたいときに使う機能です。
まず管理画面左にあるメニューの中の【投稿】にマウスを重ね、【新規投稿を追加】を選択します。
するとこのような編集画面になります。
ここからセミナー開催日程の記事を作成しましょう。
まず、「タイトルを追加」を選択してタイトルを入力しましょう。タイトルとは、セミナー開催情報欄に出てくる見出しの部分になります。どこで・いつ開催されるのか端的に書いておきましょう。
例：【東京都千代田区】文化センター 3月1日(月)・2日(火)・3日(水) 午前・午後開催
Google Mapを埋め込む
次に開催場所の地図を載せておきましょう。地図はGoogle Mapを利用します。
WebブラウザでGoogle Mapにアクセスしましょう。
画面左上の検索窓に、セミナーを開催する場所、または住所を入力してください。
表示された地図を見て、検索した場所が正しく表示されていることを確認しましょう。
次に地図の埋め込みコードをコピーします。
概要欄のアイコンから、「共有」を選択します
次に「地図を埋め込む」を選択し、「HTMLをコピー」をクリックします。
WordPressの新規投稿編集ページに戻り、＋マークになっている部分をクリックし、その中にある「カスタムHTML」を選択します。(＋マークが出ていない場合は、タイトルの下の方にマウスを重ねると出てきます。)
すると入力エリアが追加されるのでそこに先ほどコピーしたものを貼り付けます。
これでGoogle Mapの埋め込みは完成です。
セミナー情報の記入
セミナー情報の詳細を記入していきましょう。
新規投稿編集ページの中に「セミナー開催情報」という欄があるので、そこにある空欄の部分を記入していきましょう。※になっている部分は必須での記入になります。
(参加人数残り・開催校・参加費・注意事項・持ってくるもの)は記入済ですが、必要に応じて変更してください。
セミナー開催情報下のカスタムCSS・SEO・カスタムJavaScriptは基本的には記入は不要です。
全て記入できたら右側のカテゴリーにある開催日程にチェックが入っていることを確認し、右上の公開をクリックして完成です。
管理画面に戻る場合は、左上のマークをクリックすると戻ることができます。
通知エリアの設定
次は、通知エリアの設定を行いましょう。
通知エリアとは、下記の画像の部分にあるホームページ上で表示される次回開催日程をお知らせするエリアです。
管理画面左のメニューの中から【Cocoon設定】にマウスを重ね、【Cocoon設定】を選択します。
【Cocoon設定】では様々な変更をすることが出来ます。通知エリアの設定を行うには、上部にあるタブから【通知】タブを選択します。そして、通知設定の【通知メッセージ】に表示させたい情報を記入します。
最後に 変更をまとめて保存 ボタンをクリックし完了です。
予約フォームの設定
予約フォームは、セミナーに参加したい方が必要な情報を入力してセミナー予約するフォームです。入力し送信された情報は登録されているメールアドレスにメールが届くようになっています。
設定では、予約フォームに入力後、送信ボタンを押した後に自動返信メール機能により、参加者にメール通知が届くようになっています。
ご希望の参加日時の変更
予約フォームには、ご希望の参加日時を選んでいただく欄がありますが、そちらにセミナーの日程を追加していきます。
管理画面左メニューにある【お問い合わせ】の中の【コンタクトフォーム】を選択します。
そしてその中のお問い合わせフォームを選択。
「フォーム」タブに記述されている項目、
////////////////////////////////////////////
<label>ご希望の参加日時<span class=”required”>必須</span>
[select* menu2
“~~~~~~~~~~~~~~~~~~~~”
“~~~~~~~~~~~~~~~~~~~~”
]</label>
////////////////////////////////////////////
この “ ”(ダブルクォーテーション)で囲まれている部分を変更します。
参加日時の追加・変更はいくつでも可能ですが、必ず “ ”(ダブルクォーテーション)で囲ってください。
例：”令和6年5月8日(水)10:00の部 北ふれあいセンター 第1研修室”
入力が終わったら保存ボタンをクリックして完了です。
設定が反映されているかホームページで確認しておきましょう。
メールの設定
「メール」タブでは、あなたに「セミナーの予約が届きました」とお知らせしたり、セミナー予約したユーザーに「セミナー予約が完了しました」と伝えたりするために設定します。
■メールの項目
「メール」は問い合わせがあった際、自分に届くメールです。
送信先のアドレスがご自身のアドレスになっているか確認してください。
| 送信先 | お問い合わせを受け取るメールアドレス |
| 送信元 | お問い合わせメールの送信元メールアドレス （デフォルトでOK） |
| 題名 | メールの件名 |
| 追加ヘッダー | メールの返信先 デフォルトではお問い合わせユーザのメールアドレスが設定されます |
| メッセージ本文 | メール本文（デフォルトでOK） |
| ファイル添付 | 何も入力しなくてOK |
■メール(2)の項目
「メール(2)」はお問い合わせしたユーザーに「セミナー予約が完了しました」と通知するためのメールです。
このメールは、予約フォームを送信後に自動返信されるメールです。
メッセージ本文の一番下の連絡先が合っているか確認してください。
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
マネー・ラボラトリー ◯◯校
◯◯県◯◯市◯◯-◯
事務局担当 ：◯◯
TEL ：000-0000-0000
URL ：https://◯◯◯.kodomomiraikaigi.com
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
| 送信先 | お問い合わせユーザのメールアドレス（デフォルトでOK） |
| 送信元 | お問い合わせメールの送信元メールアドレス（デフォルトでOK） |
| 題名 | メールの件名 |
| 追加ヘッダー | メールの返信先 デフォルトではWordPress管理者のメールアドレスが設定されます |
| メッセージ本文 | メール本文（デフォルトでOK） 連絡先が合っているか確認 |
| ファイル添付 | 何も入力しなくてOK |
Flamingoアドレス帳
予約フォームから送信されたアドレス・メッセージは管理画面左メニューにある【Flamingo】から確認することができます。必要に応じて確認してみて下さい。
これで基本的な操作設定は完了です。ここまでの操作ができればセミナー運営に必要な情報は更新できるので是非お役立てください。
その他(カスタマイズ)
これまでの設定で基本的な操作は完了ですが、ここからは一部カスタマイズの方法をご紹介します。
ファーストビュー(画像)の変更
Webサイトの一番上に表示されるファーストビュー(画像)の変更についてご紹介します。
まず管理画面左メニューの【Cocoon設定】から【Cocoon設定】を選択。
上部にあるタブから【アピールエリア】タブを選択し、その中の【エリア画像】から変更します。
Webサイトのテキスト&その他画像の変更
これまでご紹介した以外のテキストや画像の変更についてもご紹介します。
※テキストや画像は、CSSやJavascriptにて制御している部分がある為、変更する際は充分注意して行なって下さい。(文字・画像の大きさなどはCSSで制御しています。)
管理画面左メニューの【固定ページ】から【固定ページ一覧】を選択。
次に、【固定ページ一覧】の中にある【マネー・ラボラトリー◯◯校 -フロントページ】を選択します。
変更したい箇所をクリックしてテキスト・画像の変更を行います。
変更ができたら、画面右上の固定ページを表示で間違いがないか確認し、更新をクリックして完了です。
最後に
これ以外の操作についてはご自身で調べていただくか、お問い合わせフォームよりご相談ください。
