【STAGE-3】WordPressのインストール方法~エックスサーバー編~

エックスサーバーでWordPressつかう,インストール 設定方法 アフィリエイト
ぶー助
ぶー助

WordPress(ワードプレス)っておいしいブ?

きたきつね
きたきつね

まぁ試しにたべてみろ

まだエックスサーバーを契約していない人は前記事を確認しよう!



エックスサーバー×WordPressでサイト作成までの道のり

 

前記事:【STAGE-2】エックスサーバーでサイトを作る!申込手順は簡単!
【前説-1】エックスサーバーのメリットデメリット
【STEP1】エックスサーバーに申し込む
【STEP2】料金支払い方法
【前説-2】独自ドメインプレゼントの詳細や内容
【STEP3】独自ドメインの取得
【STEP4】独自ドメインの設定

 

当記事:【STAGE-3】WordPressのインストール方法~エックスサーバー編~
【前説-3】WordPressとは?
【STEP5】エックスサーバーにワードプレスをインストールする方法
【前説-4】httpとhttosの違い~セキュリティを高める~
【STEP6】httpsにURLを変更
【STEP7】http→httpsへのリダイレクト設定



【前説-3】WordPressとは?

ワードプレスは世界で圧倒的なシェアを誇る、無料で使えるCMS(Contents Management System)のことです。
訳すと『コンテンツ管理システム』(ブログを簡単に作るソフトウェア)です。

このCMSを使うことによってサイトを作成する為に必須となるHTMLやCSSの知識が無くとも、簡単にサイト運営ができちゃいます。
↓下記HTML参考

htmlの作り方 サイト初心者 サイトの作り方 サイトなにすればよい?

いきなりこれを作れって言われたら基本から何十時間も学ばなければまともなサイトは作れません。

近年のサイトは自由度が高く色んなことができるので、より複雑に構成を組まなければなりません。
お金を稼ぐ為とは言えこんなに途方もない勉強をしなければならないなんて。。なんかの資格を勉強したほうが、、、
となってしまいます。(筆者の場合)

そこでワードプレスの出番です。
↓ワードプレスによる変換前

WordPress ビュジュアル画面とは

パッと見た感じエクセルのような感じに見えるかな?
実際の内容はというと、、、

↓ワードプレスによる変換後

WordPress テキスト画面とは
ぶー助
ぶー助

WordPressがよくわかんないローマ字を勝手に打ってくれてるのがわかるぶ

感覚的に使うことができるので、知識の全くない超初心者でも、
『文字を太くしたい赤くしたい』『画像をクリックしたら違うサイトへ飛ばしたい』など色々な機能を持ったブログが作れてしまうんです。

きたきつね
きたきつね

CMSは色んな種類があるが圧倒的シェアを誇るのがWordPress
シェアが多い分わからない事があってもググればたいてい解決するぞ

STEP5 エックスサーバーにワードプレスをインストールする方法

それではWordPressをインストールしよう!

STEP5.1 サーバーパネルにログイン

まずはエックスサーバーのサーバーパネルにログインします。
URL:https://www.xserver.ne.jp/login_server.php
※インフォパネルとはID・PWが異なります。エックスサーバー契約時のメールに書いてあるサーバーID・PWが必要です。

サーバーパネル ドメイン設定方法

STEP5.2 WordPressを自動インストール

『自動インストール』をクリック

ワードプレス設定方法 エックスサーバー



独自ドメインで作成した『~.com』の方を選択する※重要

ドメインは何を選ぶ? ,com



『プログラムのインストール』をクリック
『インストール設定』をクリック

Wordpressのプログラムインストール方法 設定

STEP5.3 自動インストール項目を埋める

作成したドメインを入力
基本的に空白
③サイトの名前を入力※後で変更可能
ログインIDになる為重要!※後で変更不可
⑤判別されにくい文字を推奨※後で変更可能
⑥連絡がくるメールアドレスを入力※後で変更可能
『自動でデータベースを生成する』にチェック
『インストール(確認)』をクリック

ワードプレス 入力方法 項目いっぱい




入力内容にミスがないかチェック
『インストールを行うと~』はサーバーにファイルが無いときに表示されるHTMLファイルであり削除しても問題ない為、心配ありません。
『インストール(確定)』をクリック

インストールを行うと、インストール先ディレクトリ内のindex.htmlが削除されます。
きたきつね
きたきつね

これでWordPressのインストールが完了だ
実際にサイトを作る前に下準備をするぞ
最大限サイトを良質なものにして稼げるサイトにするためにサボるなよ!

前説ー4 httpとhttpsの違い~セキュリティを高める~

httpsって意味ある?

HTTP(Hyper Text Transfer Protocol)、HTTPS(Hyper Text Transfer Protocol Secure)
の違いはホームページを見る際にどの通信手段を用いるのかというルールです。

『http://』=暗号化しない
『https://』=暗号化をする

たとえば通販サイトで水を買うために個人情報を入力するとします。
http://の場合は暗号化されていないので第三者に情報が筒抜けになってしまいます。
もし悪意ある人の手に個人情報が渡れば、見知らぬ請求が届いたり、、、
そこで通信が暗号化できるhttps://が誕生し、一般的に浸透していき今や常識となりつつあります。

無条件でhttps://にできるわけではなくて契約しているレンタルサーバー会社から
『SSLサーバー証明書』をもらう必要性がありエックスサーバーは無料で取得できる為、是非https://を設定しておきましょう。

(後ほど紹介しますが)https://した場合グーグルクロームとかで開くと、
『保護された通信』と出ます。↓

https リダイレクトとは

STEP6 httpsにURLを変更

STEP6.1 自動インストール完了!ワードプレスにログイン

『http://~~~.com/wp-admin』これがあなたのワードプレス権限をもったURLです。
クリックしてみましょう。

インストールする wpadminとは



ログイン画面が出てきます。
ID(ユーザー名orアドレス)・PWを入力して『ログイン』をクリック

Wordpressログイン画面

STEP6.2 設定を開きURLをhttpsに変更

『設定』をクリック

ワードプレストップ画面



『WordPressアドレス(URL)』
『サイトアドレス(URL)』

両方ともhttps://~~~.comのようにを付け足し
下にスクロールしたら『変更を保存』があるのでクリック

httpsの設定
きたきつね
きたきつね

これでサイトのURLはhttps://~~~.comになったぞ

STEP7 http→httpsにリダイレクト設定

STEP7.1 リダイレクト設定とは?

STEP6でURLがhttphttpsに変更されました。
なのでこのサイトはhttp://outikasegi.com/ではエラーが出るようになります。

ぶー助
ぶー助

http://outikasegi.com/で名刺100枚頼んじゃったぶーーー

きたきつね
きたきつね

じゃあリダイレクト設定をするぞ

そこでリダイレクト設定をしておくと、、、

【間違ったURL】http://outikasegi.com/

(間違ったURLにアクセスしたら↓に自動転送)

【正しいURL】https://outikasegi.com/

この設定をしておくことで誤ってhttp://でアクセスしたりリンクを貼ってしまっても、
自動的にhttps://に接続してくれるので間違ったURLにアクセスがあっても、
ちゃんとサイトにアクセス出来るようになります。

ぶー助
ぶー助

それなら名刺1000枚に増やしたブ

きたきつね
きたきつね

それだれに配るんだ?

STEP7.2 リダイレクト設定~サーバーパネルにログイン~

エックスサーバーのサーバーパネルにログインします。
URL:https://www.xserver.ne.jp/login_server.php

『.htaccess編集』をクリック

htaccess編集



~~~.com『選択する』をクリック

ドメイン選択

STEP7.3 『.htaccess』にコードを貼り付ける

『.htaccess編集』をクリック
②赤枠の中に↓をコピーして貼り付け
※2019年6月更新

.htaccess編集設定



※貼り付けが正確にできてるか確認

①赤枠の中に貼り付けができた事を確認
『.htaccessを編集する(確認)』をクリック

エックスサーバーリダイレクト設定



『.htaccessを編集する(確定)』をクリック

.htaccess とは?

これでhttp→httpsのリダイレクト設定完了です。

STEP7.4 リダイレクトできているか確認

使ってるブラウザによって表示が微妙に違います。
まずは左上にあるアドレスバーにhttp://~~~.com(希望したドメイン)を入力しよう。

Windowsの場合↓

ウィンドウズ https確認


Google Chromeの場合↓

https リダイレクトとは

確認箇所は二箇所あります。
①https://~~~.comのsが表示されているか
②保護さてれいるか
Windowsの場合:南京錠がしまっている
Google Chromeの場合保護された通信が表示されているか

この上記二点ができていれば、成功です。

きたきつね
きたきつね

ここからはWordPressのセキュリティ対策、テーマ、プラグインを自分の好みに合わせて選出しなきゃならないからやらなきゃいけないことはたくさんあるぞ!

だが一旦ここらで自由に操作してみてくれ
最初は訳わからんが要は慣れだ!

最後まで読んでいただきありがとうございました!
記事が少しでも良かった!と思えたらシェアお願いします<(_ _)>!!

タイトルとURLをコピーしました