4.投稿と固定ページ画像等の挿入ページの公開投稿の注意点固定ページの注意点外観テーマとはウィジェットヘッダーメニュー本書をご

(1)

WordPress のはじめ方

〜インストール・管理画面〜（2014.10 更新）

■用語説明 ... 3 サーバーとドメイン代について ... 4 1. ドメインとサーバー ... 5 1-1. ドメインを取得する ... 5 1-2. サーバー ... 8 ロリポップの場合 ... 8 エックスサーバーの場合 ... 11 1-3. ネームサーバー設定 ... 13 2.WordPress のインストール ... 15 ・ロリポップの場合 ... 15 ・エックスサーバーの場合 ... 17 3. 初期設定 ... 18 3-1 最初にやっておきたい初期設定 ... 19 3-2. 一般 ... 20 3-3. 投稿設定 ... 20 3-4. 表示設定 ... 21 3-5. ディスカッション ... 22 3-6. メディア ... 23 3-7. パーマリンク ... 24

(2)

4. 投稿と固定ページ ... 25 ・画像等の挿入 ... 29 ・ページの公開 ... 31 投稿の注意点 ... 32 固定ページの注意点 ... 35 5. 外観 ... 37 5-1. テーマとは ... 37 5-2. ウィジェット ... 38 5-3. ヘッダー ... 39 5-4. メニュー ... 42 ◆本書をご利用いただくには Adobe リーダーが便利です。こちらで無料でダウンロードできます http://get.adobe.com/jp/reader/ 【著作権について】本書の著作権はすべて内藤勲に帰属します。本書の一部または全部を著作権者の承諾を得ずにホームページ・書籍・電子ファイル・ビデオなどにより、複製、流用転用、転売することを禁止いたします。またあなた以外の閲覧、無断転載も禁止事項となります。【免責事項】本書により、いかなる損害が発生しても著者は一切の責任を負いません。自己責任の上ご利用ください。

(3)

■用語説明

【レンタルサーバー】簡単に説明すると、レンタルサーバーはインターネット上に借りる部屋のようなものです。その部屋にホームページのファイル類をおきます。【ドメイン】ドメインとは、インターネット上の表札や住所のようなものです。サーバーをレンタルした時点で、サーバー会社の名前が含まれたドメインがあります。例えば、naitoisao.xsrv.jp　（エックスサーバーの場合　zsrv.jp が付きます）【独自ドメイン】自分だけのドメインを独自ドメインとい言いす。例）　inakadenet.com　のようにサーバードメインが入りませんサーバー代とは別で年間約 1000 円〜3000 円程度費用がかかりますが、ビジネスで使うならば独自ドメインの方が良いです。【WordPress　ワードプレス】元々はブログのシステムですが、世界中でもっとも使われている、フリーのブログプログラムです。ブログを書く感覚で、更新、運営が可能です　更新が簡単にできるホームページとも言われています WordPress は、サーバーにインストールして使うものです。【ブラウザ】インターネット閲覧ソフトの事です。

(4)

代表的なものに、IE（インターネットエクスプローラー）、FireFox（ファイヤーフォックス）、Safari（サファリ）、GoogleChrome（グーグルクローム）などがあります

サーバーとドメイン代について

独自ドメインと、レンタルサーバー代は必要経費としてかかってしまいます。独自ドメイン（ムームードメインで、.com を取得する場合） 1 年契約で　920 円（税抜）ロリポップ（ロリポプラン）の場合 12 ヶ月契約で　4,860 円（税込）（初期費用　+　月額 280 円）エックスサーバー（X10）の場合 12 ヶ月契約で　16,200 円（税込）（初期費用　+　月額 1,080 円） ※価格は変動します。アメブロでも広告をはずそうと思うと、月額 1,008 円かかります。年間 12､096 円かかります。ロリポップならば、実はアメブロよりも安くできます。しかも、アメブロは広告を外していても、アカウント削除される場合があります。

(5)

1. ドメインとサーバー

Wordpress（ワードプレス）を利用するには・ドメイン（自分の URL）・サーバーが必要です。サーバーは、インターネット上にある部屋のようなもので、サーバーに WordPress をインストールすることができます。ドメインは表札で、サーバーは借りている部屋だと考えるとわかりやすいです。ドメインとサーバーはそれぞれ別契約になります。このマニュアルでは、ロリポップとエックスサーバーを例に説明します。

1-1.ドメインを取得する

サーバーによってはキャンペーンなどで無料でドメインがもらえる場合があります。あらかじめ確認しておくとよいでしょう。ドメインはムームードメインが安くて、管理画面も初心者向けとなっています。

(6)

⇒　http://muumuu-domain.com/ ドメインは世界に 1 つだけのもので、使えるのは早い者勝ちとなっています。まずは、使いたいドメインを探して見ましょう。 .com や.jp など種類によっても料金が変わります。取得可能なドメインを選んで次に進みます。初めて利用する場合は、新規登録から登録してください。

(7)

登録が完了するとドメインの設定に移ります。・WHOIS 公開情報は、ドメインの所有者を公開する必要があります。個人情報を開示したくない場合は、『弊社の情報を代理公開する』を選択します。・ネームサーバ（DNS）は、ドメインをどのサーバーと関連付けるかの設定になります。表札をどの部屋にかけるか、ということです。サーバーをロリポップにする場合は、ロリポップを。エックスサーバー等、他社のサーバーにする場合は『今はまだ使用しない』を選択します。 ※メールオプション（ムームーメール）というメールサービスがありますが、通常メールはサーバーの方で管理しますので、特に必要ありません。また、ロリポップを使われる場合は、『連携サービス無料お申し込み』から申し込むこともできます。

(8)

※ロリポップを選ぶ場合は、ロリポプラン以上にしてください。コロリポプランは WordPress が利用出来ません。・お支払い方法を選び、『内容確認へ』に進みます。内容を確認し、間違いがなければ利用規約にチェックをいれ支払い手続きに移ってください。支払いが済めばドメインの取得は完了です。

1-2.サーバー

表札（ドメイン）をかける部屋となるサーバーを契約します。

ロリポップの場合

ロリポップは、ムームードメインと同じ会社が提供していて初心者にもわかりやすい管理画面で、安いのが特徴です。ただ、2014 年に大規模なハッキング被害にあっています。今はセキュリティ強化がされています。心配な場合は、料金は上がってしまいますが、エックスサーバーなどを使われるのも良いでしょう。

(9)

新規お申し込みの場合は、右サイドバーの無料お試し期間があります。

『独自ドメインを利用する』にチェックを入れて進めますが、ここでは、ロリポップからももらえるロリポップドメインを選んで進みます。

※取得したドメインは後ほど設定します。

(10)

申し込みが完了すれば、管理画面に移動できます。

ロリポップの管理画面左にあるメニューから『独自ドメイン⇒独自ドメイン設定』を選びます。

『独自ドメイン設定』から、さきほど取得したドメインを設定していきます

(11)

エックスサーバーの場合

⇒　http://www.xserver.ne.jp/

エックスサーバーもお試し期間があります。

『お申し込み』から手続きに移ります。流れにしたがい設定を進めます。

(12)

規約に同意し、『新規サーバーのお申し込み』を選びます。

サーバー ID を入力して申し込みます。

※ムームードメインで取得した独自ドメインは後ほど設定します

設定完了のメールが確認できたら、メールにあるサーバーパネルから管理画面に入室します。

(13)

サーバーパネルの『ドメイン設定』から『ドメインの追加設定』で、ムームードメインで取得したドメインを設定します。

1-3.ネームサーバー設定

サーバーの準備ができましたら、今度はドメインと関連づけます。表札を部屋にかける作業です。これをしないと、取得したドメイン（URL）にアクセスしても何も表示されません。ムームードメインの管理画面で、取得したドメインの『ネームサーバ設定変更』を行います。

(14)

取得したドメインの『ネームサーバ設定変更』から『GMO ペパポ以外のネームサーバを使用する』からネームサーバを変更しますサーバーがエックスサーバーの場合は、ns1.xserver.jp, ns2.xserver.jp になります。　 ※ネームサーバはサーバー情報の欄などに記載されています。 ※サーバーがロリポップの場合は、『ロリポップ！のネームサーバを使用する』にチェックをいれますこれで独自ドメインとサーバーの関連付けが完了ですが、反映されるまでには数時間から２日程度かかる場合があります。

(15)

2.WordPress

のインストール

ドメインとサーバーの準備ができたら、WordPress をインストールします。今では、サーバー内から簡単にインストールが可能です。

・ロリポップの場合

ロリポップの管理画面左にある『簡単インストール』から『WordPress』を選択します・インストール先 URL で、取得した独自ドメインを選びます。 /　のあと空欄にすると、ドメイン直下にインストールされます。つまり、http://○○○.com/　などに直接インストールができるということです。通常はこれで OK です。・サイトのタイトルは後で変更することもできますので仮のものでも構いません。・ユーザー名は、WordPress ログイン時に使うものになりますが、『admin』や簡単なものはセキュリティ的に危険ですので避けましょう。・プライバシーの『検索エンジンによるサイトのインデックスを許可する』は、

(16)

検索される状態にしても良いか？ということです。ある程度準備が整ってから検索された方がいいので、ここではチェックを外しておきます。

入力が済んだら、『入力内容確認』で内容を確認すればインストールが完了となります。

(17)

・エックスサーバーの場合

サーバーパネルの『自動インストール』から行います。『プログラムのインストール』から WordPress のインストールに進みます。あとは、ロリポップでの場合と同じく、インストール場所、ブログ名、ユーザー名、パスワード等決めてインストールします。 ※ユーザー名は、WordPress ログイン時に使うものになりますが、『admin』や簡単なものはセキュリティ的に危険ですので避けましょう。

(18)

3. 初期設定

WordPress のインストールが完了したら、ログインしましょう。ログイン画面は http://独自ドメイン/wp-login.php　もしくは http://独自ドメイン/wp-admin　になります覚えておきましょう。最初はデフォルトのテーマ（テンプレート）で、サンプルの記事が入っています。

(19)

管理画面

ダッシュボードは、管理画面のホームになり、右上にある『表示オプション』から不要なものを非表示にできます。

3-1 最初にやっておきたい初期設定

(20)

3-2.一般

一般設定は、タイトルなど基本の設定を行います。・サイト名検索にも重要になります。全角 32 文字以内に収めて、検索されるキーワードを入れるようにします。・キャッチフレーズサイトの説明文になります。サイト名で書き切れない補足をしましょう。ここにもキーワードを入れます。 ※キーワードの羅列はスパムになります。日本語として自然な文章になるように。・WordPress アドレス、サイトアドレス通常は変更しません。

3-3.投稿設定

特に最初の段階では設定しません。

(21)

3-4.表示設定

・フロントページの表示 WordPress は、カテゴリを決めて更新していく『投稿』（いわゆるブログ記事）と、更新性のない『固定ページ』の 2 種類の記事があります。トップページで表示させるのを、『投稿』か『固定ページ』にするか選ぶことができます。 ※固定ページにする場合は、トップページ（フロントページ）にする固定ページと、最新の投稿一覧用の固定ページを用意します。・1 ページに表示する最大投稿数フロントページを投稿にした場合や、カテゴリ、アーカイブ（過去記事）表示にした場合の 1 ページあたりの記事数になります・RSS/Atom フィードで表示する最新の投稿数、各投稿の表示記事を更新した際に流れる更新情報の件数と表示方法です・検索エンジンでの表示チェックが入っていると検索サイトで検索にヒットしません。ある程度準備が整ったら、忘れずにチェックを外してください。

(22)

3-5.ディスカッション

主にコメントの設定になります投稿のデフォルト設定の「この投稿に含まれるすべてのリンクへの通知を試みる」にチェックが入っていると、ブログ内で他の記事へリンクさせたものも通知されうっとうしいので、チェックを外しておくといいでしょう。その他、コメントの詳細設定が可能です。　また、記事毎にコメントの拒否など設定ができます。・アバターアバターとは、コメントで表示される顔のアイコンです。

(23)

こちらのサイトでアバター登録しておくと、表示されるようになります ⇒　http://ja.gravatar.com/

3-6.メディア

記事に画像を挿入するときに、画像の大きさを選択できます。そのときのサイズを指定しておくことができます

(24)

3-7.パーマリンク

パーマリンクとは、記事の URL のことです。デフォルトのままでは、 ?マークがはいるアドレスになり、検索対策にも良くないと言われています。カスタム構造にチェックを入れ、入力欄に /%post_id%/　と入れると、自動的に記事 No がふられていきます。 /%postname%/　と入れると、好きな名前に変更できて、検索にも有利になると考えられていますが、日本語の記事タイトルを都度アルファベットに変える必要があります。僕は忘れてしまうので　/%post_id%/　にしています。 ※途中でパーマリンクを変えると、記事 URL が変わってしまうことになります。リンクされていた場合など、リンクエラーを起こしますので十分注意してください

(25)

4. 投稿と固定ページ

WordPress には『投稿』と『固定ページ』という 2 種類の記事があります。『投稿』は、カテゴリーや、タグといった分類分けができる更新性のある記事です。多くのブログサービスの記事はこちらにあたります。『固定ページ』は、固定的なページで分類分けのカテゴリーなどがありません。一方テンプレートと呼ばれる、個別のページ毎にテンプレートを設定できます

(26)

『投稿』や『固定ページ』から作っていくページには、ビジュアルと HTML というタブがあります。『ビジュアル』は、実際に表示される状態で編集ができます。『テキスト』は、HTML タグが表示される状態で編集です。グーグルマップなど、HTML タグを貼り付ける必要がある場合は、テキストに切り替える必要があります。　 ※ビジュアルエディタで改行すると、段落が変わります（行間が広くなります）。段落を変えたくない場合は、shit キーを押しながら、改行（Enter）してください。【投稿】や【固定ページ】の投稿画面にあるボタン類は全部を使うわけではありませんが、よく使うものは覚えておくと便利です。

(27)

■文字装飾 B（強調）、斜体、打消し線、下線、文字色などが装飾できます。装飾を施したい文字を選択して、ボタンを押します。 ■リスト表示番号なしリストと、番号付きリストになります。箇条書きのように見せる場合に使います。 ■リンクリンクボタンになります。リンクさせたい文字を選択すると、ボタンが押せる状態になります

(28)

■画像のアップロード【メディアを追加】から画像をアップロードできます ■全ツール表示『全ツールボタン』をクリックすると他のツールが表示されます ■HTML 表示右上の『ビジュアル・テキスト』からエディタを HTML 表示に切り替える事ができます

(29)

HTML タグが表示された状態になります。 b ボタンをおして、太字にした場合慣れてくると、こちらの方が便利になります。

・画像等の挿入

画像を挿入する場合は、『メディアを追加』のボタンから行います。『ファイルを選択』ボタンからパソコン内のファイルをアップロードするか、直接ドラッグ＆ドロップでアップロードできます。

(30)

ファイルをアップロードした状態です。画像のタイトルは、画像を表す分かりやすいものにしてください。キャプションは、脚注として画像下に表示されるものになります。代替テキストは、ブラウザにも読み込まれる所ですので、画像を表す説明文や、検索を意識したキーワードをいれるものいいです。

(31)

配置で、写真の配置位置を決められます。左、中央、右、なし　が選択できます。左や右を選んだ場合は、横に文章が回り込みます。リンク先は、画像をクリックしたときのリンクを設定できます。　「カスタムリンク URL」を使えば、あるページに飛ばすバナーの役割になります。　クリックして大きな画像を見せたい場合は、「メディアファイル」を選びます。特になければ、「なし」で OK です。サイズは、サムネイル、中サイズ、フルサイズが選べます。最後に『投稿に挿入』ボタンを押します。

・ページの公開

編集後右側にある『公開』のボックスから、『下書きとして保存』や『公開』を押します。

(32)

『パスワード保護』を選択すると、パスワードを知っている人のみ閲覧可能にすることもできます。公開の日付を変えることも可能です。未来の日付にすると予約投稿になります。『投稿』と『固定ページ』をうまく組み合わせれば、更新性のあるブログの要素と、固定的なホームページの要素を持たせる事ができます。 WordPress が、『更新が簡単なホームページ』などと言われるのはこのためです。

投稿の注意点

(33)

・カテゴリ投稿では必ずカテゴリーを選択する必要があります。 URL になるスラッグは半角英数字で設定しましょう。カテゴリは複数選ぶ事ができます。・タグタグもカテゴリーと同様に、分類に使うもので、カテゴリー組み合わせて、大分類、小分類という使い方もできます。カテゴリーは必ず必要ですが、タグは使わなくても投稿できます。・公開新規投稿画面の右側には公開の欄があります公開状態を開くと、記事を先頭に固定できたり、パスワード保護をかけてその

(34)

記事だけパスワードを入れないと見れないように出来たりします。・非公開は、ログインしていないと見ることができません。・アイキャッチ画像記事投稿画面右下にあるアイキャッチ画像は、記事がリスト表示されたときに表示されたり、Facebook などにリンクした際に表示される画像です。その記事の特徴的な画像を使うといいです。意外と大事です・パーマリンク記事の URL 変更 3-7 のパーマリンク設定で、/%postname%/にした場合は、記事のスラッグ（URL）をアルファベットなど半角英数字に、毎回変える必要があります

(35)

固定ページの注意点

・パーマリンク記事の URL 変更固定ページでは、3-7 のパーマリンク設定がデフォルト以外、記事タイトルがスラッグ（URL）になってしまうので、毎回半角英数字に変更する必要があります・エディタ投稿と固定ページ共通ですが、記事を書くエディタには、実際の表示に近いビジュアルと、HTML タグが見えるテキストがあります。ビジュアル

(36)

テキスト

WordPress は、HTML を自動整形するため、ビジュアルとテキストを行ったり来たりすると配置が崩れ、思ったように書くことが難しくなります。

(37)

5. 外観

5-1.テーマとは

WordPress では、デザインテンプレートのことを”テーマ”と呼びます。管理画面の　外観　⇒　テーマ　から選ぶ事ができます。テーマは、世界中で作られており、数え切れないほどのテーマが存在しています。日本製のものもあれば、有料のものもあります。自分でカスタマイズすることもできます。最初は、デフォルトテーマの『Twentyfourteen』が設定されています。『新規追加』からテーマを探してインストールすることができます。テーマは世界中で作られており、なかには有料のテーマもあります。

(38)

5-2.ウィジェット

サイドバー等の項目となる『ウィジェット』を設定します。

テーマによってウィジェットの項目が異なります。

(39)

5-3.ヘッダー

管理画面からヘッダーを設定できます。（テーマによります）

(40)

点線で切り抜く位置を調整して『切り取って公開する』をクリック。管理画面のプレビュー画面にも挿入されました。

(41)

ヘッダー上に表示されるヘッダーのテキスト（サイトタイトル）を表示させるかどうか、選択できます。またタイトルの文字色も選ぶ事ができます。最後に『変更を保存』で実際のサイトにもヘッダーを入れることが出来ました。ヘッダー画像をクリックすると、トップページへリンクするようになっています。

(42)

5-4.メニュー

外観　⇒　メニュー　からメニューバーの設定を行います。

メニューは複数作ることができます。まずは、メニューのグループを作ります。『新規メニューを作成』から、メニューの名前をつけて作成ボタンをおします。

(43)

追加します。　リンクは、外部サイトなどを加えたい場合に使います。 ②メニュー構造の中の順番を入れ替えたり、階層を作ったりできます。 ③メニューはテーマによって設置できる箇所が異なります。設置させたい場所にチェックをいれて設定します。最後に『メニューを保存』をクリックします。 ※ここで作ったメニューは、ウィジェットの『カスタムメニュー』としてサイドバーなどに設置することもできます。このマニュアルの著作権は内藤勲に属します。 Http://naitoisao.com 内藤　勲

4.投稿と固定ページ 画像等の挿入 ページの公開 投稿の注意点 固定ページの注意点 外観 テーマとは ウィジェット ヘッダー メニュー 本書をご