ホームページ構築マニュアル ②

ホームページの構築マニュアル 目次

  1. ログイン方法
  2. ダッシュボードの説明
  3. 各種設定
  4. 準備する事(更新状況の確認、画像のアップロード)
  5. 新規ページを作成する
  6. その他設定情報の確認

◆は じ め に

まず、サイトを構築するための下準備を致します。下記の画像を自分のパソコンに保存して印刷したら記入ミスの無いように転記しておきましょう。この書類はサイトを構築した後もずっ~と使用いたしますので大事に保管しておきましょう。

1 ドメイン取得 11 ロリポップログインID
2 レンタルサーバーの契約 12 ロリポップログインPW
3 WordPressのインストール 13 FTPログインPW
4 画像の準備 14 おさいぽログインID
5 記事の準備 15 おさいぽログインPW
6 WPメールアカウント① 16 WPログインID
7 WPメールアカウント② 17 WPログインPW
8 独自ドメイン名 18
9 ムームードメインID 19
10 ムームードメインPW 20

スライド1

構築の進め方・・・

  • ログイン方法
  • ダッシュボードの説明
  • 各種設定
  • 準備する事(更新状況の確認、画像のアップロード)
  • 新規ページを作成する
  • ① 固定ページ
    ② 投稿ページ

  • その他設定情報の確認

(1)ログイン方法

ホームページの更新はページの追加に必要な「画像」と「文章」が主体となり下記の赤い枠の作業の繰り返しです。3ページ目のスライドからは実際に操作した手順を画面キャプチャしてありますので、これから表示する画像を確認しながら学んでみましょう。
スライド_2
まず最初にWordpressでホームページを構築するには家の「玄関」に当る所からから説明いたします。
家を例にすれば「玄関から入る」を、パソコンで言えば「ログインする」と云います。その際、サイト運営者(家の住人)の確認を行う画面が表示されます。それが下記の画面です。
①にはユーザー名(サイト構築準備の⑳)を入力します。
②にはパスワードを入力します。その下の四角い箱をクリックするとログアウトするまでこれらの情報を記憶し、次回ログインする時の入力を簡略することが出来ます。
図_1

(2)ダッシュボードの説明

①と②を入力しチェックした後でログインすると下記の画面が表示されます。

図_2

(3)各種設定

ダッシュボード画面が表示されたら、画面左側の下部にある「設定」をクリックすると「図4」の画面が表示されます。
図_3
「図4」の最初にある「サイトのタイトル」の説明を下記に記します。
図_4

3-1-A サイトタイトルの役割

サイトタイトルは、会社やお店の「看板」のようなものであり、利用者と検索サービスに対して、サイト内容を端的に伝えるものです。
● 検索結果で表示され、利用者の判断材料になる
● 検索順位決定の重要な評価項目のひとつである
という、ユーザビリティと検索エンジン最適化(SEO)の両面で、ページタイトルはとても重要です(グーグルの検索結果では、検索語と一致するキーワードが太字で表示され、利用者がひと目でわかるようになっています)。
ほかにも、ブラウザ上部のタイトルバーに表示されたり、ブックマーク(ブラウザの「お気に入り」だけでなく、ソーシャルブックマークも含めて)の表示名に使われるため、クチコミの広がりなどにもページタイトルの巧拙が大きく影響します。
最後に確認をしなければならないがサイトタイトルが決まればサイトを公開する前にgoogle検索で自分が決めたタイトルを検索窓に入力し、同じタイトルのサイトがないか必ず調べましょう。
図_4

3-1-B キャッチフレーズ

図_5_000 図4のBで入力した文字は左の図の赤のアンダーラインい丸のエリアに表示されます。
ホームページにアクセスした際、Top のイメージ画像と同様、一番最初に目に触れる部分が≪キャッチコピー≫です。
最初の【つかみ】としてキャッチコピーは大変重要です。
キャッチコピーやキャッチコピーに代わるイメージ画像などでユーザーの心を掴んでこそ、次のアクション(ページの誘導やお問い合わせなど)に繋がります。

3-1-C~Eにおける入力内容説明

Cで入力した文字は「ホーム」設定であり、WordPress サイトに読者がアクセスするために使うアドレスです。
Dで入力した文字は「サイト URL」設定であり、WordPress のコアファイルを配置する場所のアドレスです。
Eで入力した文字は「メールアドレス」設定であり、WordPress からユーザーへ通知するときに使うアドレスです。メール設定などで受信できる状態にしておいてください。
図_4
また、次頁のF~Iは図6と同じようにしてください。最後に、「サイトの言語」は日本語にして設定を保存して下さい。

3-2ダッシュボード → 投稿設定

WordPress ダッシュボードの投稿設定から投稿に関するいろいろな設定を行ないます。
次頁からは最低限必要な設定をしていきます。図_7
下の図 の「更新情報サービス」の欄には、下の図の赤い枠の内容を入力してください。

http://rpc.pingomatic.com/
http://api.my.yahoo.co.jp/RPC2
http://bulkfeeds.net/rpc
http://blog.goo.ne.jp/XMLRPC
http://blogsearch.google.co.jp/ping/RPC2

図_8

3-2ダッシュボード → 表示設定

図_9
これからは下の図に示してあるとおりに設定して下さい。
図_10
下の図12の内容はそのままで大丈夫です。図_11図_12

3-4ダッシュボード → パーマリンク設定

図_13
図14のカスタム構造にチェックをいれ  /%category%/%postname%/  と入力する。この画面のオプションについてはそのままでよい。図_14

(4)準備する事(更新状況の確認、画像のアップロード)

作成に必要なデータの準備(1)

図_16作成に必要なデータの準備(2)

図_17作成に必要なデータの準備(3)

①ダッシュボードからメディアを開きます。
図_18
②メディアから新規追加をクリックします。
図_19
③ファイルをドロップするかファイルを選択します。
図_20
④複数アップロードした場合は最後の画像が左上隅に表示されます。図_21

(5)新規ページを作成する

①固定ページをクリックします。
図_22
②固定ページ → 新規追加をクリックします。
図_23
新規固定ページ追加の欄にはページの表題(タイトル)を入れます。
図_24
ページを新規に作成する時や編集する時には2つのモードがあり、注意して下さい。
図_25_002
◆ビジュアルエディタを使用すると・・・・
実際にブログでどのように表示されるのかを確認しながら本文を入力していくことができます。例えばビジュアルエディタで一部の文字に「太字」を設定すると実際にエディタ上でも太字になって表示されます。
◆それに対してテキストエディタは・・・・
通常のHTMLページを作成する時と同じようにテキストに対してHTMLタグを記述することで太字などのスタイルを設定していきます。「テキスト」タブをクリックしてテキストエディタに切り替えてみて下さい。
「太字」が設定されている部分をテキストエディタで見ると<strong></strong>が記述されています。このようにテキストエディタではHTMLタグを直接入力して文章を編集します。(テキストエディタでもツールバー上によく使用するタグが簡単に入力できるように用意されています)。
ビジュアルエディタを使う場合にはブログでどのように表示されるのか確認しながら記事を編集することができますが、ツールバーに用意されているスタイルしか設定できません。逆にテキストエディタではより細かいスタイルの設定を記述することができます。通常はビジュアルエディタをしつつ、必要に応じてテキストエディタに切り替え、詳細な記述を行うといった使い方が便利ではないかと思います。
④保存するときのチェックポイント
図_25
※固定ページに特殊なレイアウトを用いる場合
図_26
④その他のチェックポイント
図_27
★その他の注意点図_28

(6)その他 設定情報の確認

Follow me!

投稿者プロフィール

近江公人
近江公人asamai-cts Owner
あさまいCTSの代表オヤジです(2021年現在=60歳)
横手市中央町で「ラーメン与市」を2012年まで約15年間を経営。
その後、「横手市雇用創出協議会 実践支援員」を経て、一時会社勤めをするが体調を崩し、再度、自営業の世界に戻る。
現在の「あさまいCTS」は2019年1月に起業。業務内容は主に、パソコンの修理、出張スマホ・パソコン教室、ホームページ作成 その他何でも屋みたいなものです・・・