エックスサーバーでwordpressを始める方法をご紹介します！
エックスサーバーさんのレンタルサーバーはWordPressを使ったブログを手軽に始められる事で有名です。
あまりIT関連の知識が無くても簡単に始まれるような仕組みを提供してくれています。
エックスサーバーをつかってWordPressをインストール、https化する手順についてまとめました！
エックスサーバーさんのマニュアルを一応貼っておきますね！
エックスサーバー上の手順はかなり簡単なので特にマニュアルもいらないくらいなのですが、ご参考までに。
マニュアルでhttps化までは解説されていないんですよね･･･。
- エックスサーバーでWordPressを始める方法がわかる！
- SEOでも有利と言われるHTTPS化までしちゃいます！
- 安全に使えるようにセキュリティ対策までしちゃいます！
- 実は結構怖い？高負荷対策までしちゃいます！
今回はこちらで紹介しているさくらインターネットの手順と同等の手順になります。
WordPressのインストールまでの手順が、それぞれのレンタルサーバーに対応する手順なので異なります。
お役に立てたら嬉しいです･･･！
前提
手順について
今回はエックスサーバーの契約まで終わっていて、サーバーパネルを使える状態になっている事が前提になります･･･！
マルヒはサーバーの契約までは済ませてしまっているので画面キャプチャをとることができないのはもちろん、詳細な手順を一つ一つご案内できません。
契約だけならエックスサーバーさんの窓口やマニュアルでもいいと思いますし、それほど迷わずできると思います！
ご契約がまだの方は、手順を始める前にまずご契約をお願いします。
ただ、どんな手順になるのかは先に見ておいて頂けると良いと思います！
お申込みのリンクを貼っておきますね！
初心者の方は、プランとしては月額約1200円のX10プランがお勧めです！
ちなみにマルヒは絶対続けるという確信があったので、36か月で申込しています。
1200円⇒900円でなんと25%OFFになるので、もし長期ご利用される場合は、長期でのお申し込みがお得です！
ちなみにプランはX10プラン以上もあるのですが、X10プランで十分だと思います！
WordPressも問題なく使えますし、かなり高い性能を持っています。
プランの変更もできるので、最初はX10プラン一択だと思います！
- プランはX10で！
- プランの変更もできるので必要になったらスペックを上げることができます！
エックスサーバーを無料で10日間試せるサービスもあります！
無料で試しておけば、もし失敗してWordPressにアクセスできなくなっても安心です！
ただ、独自ドメインはどうしてもご契約いただいてからになってしまうんですよね･･･。
あと、既に運用を始めている方だと、https化や負荷対策は少し変わってきます。
ちょっと目的とは異なってしまいますので、あまり参考にならないかもしれません。
既にあるファイルに追記したりすることになるので、今回紹介しているファイルでごっそり上書いてしまわないようにしてください！
とりあえずバックアップを取って、戻せるようにしておいてから参考にしていただければと思います！
独自ドメインは取得しておきましょう！
独自ドメインは「あったほうが良い」と確信しています！
手順も独自ドメインを使う事を前提としています。
なお、途中で独自ドメインを設定する手順がありますが、他社で取得したドメインだと手順が複雑になります。
料金もそれほど変わらない…と思うので、できればエックスサーバーのドメインを取得しておくと楽です！
エックスサーバーさんはドメインが初年度無料になるキャンペーン等行っている場合もあります。
せっかくなのでキャンペーンがあれば利用しておきたいですね！
- 不安な方は無料お試しで手順を確認してみても良いかもしれません！
- 独自ドメインはあったほうが良いです！
- テキストの作成は間違えると動作に影響があるので気を付けてください！
ファイルの準備
事前にファイルを用意しておいてください。
まずテーマをダウンロードしておいてください。
使いたいテーマの決まっている方には不要です。
こちらの「Simplicity2」と「Simplicity2の子テーマ」の2種類をダウンロードしましょう。
詳しい使い方は省略しますが、おすすめです！
テーマの編集の説明がわかりやすく、使っている人も多いので情報も豊富です。
そういう意味でも使いやすいです！
また、ファイルを3種類作ります。
「.htaccess」「apple-touch-iconXXXX.png」「favicon.ico」
.htaccess
「.htaccess」はテキストファイルになります。
ただし、拡張子に「.txt」等付くと動作しませんので注意してください！
# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress
# SSL
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
# xmlrpc
<Files xmlrpc.php>
Order allow,deny
Deny from all
</Files>
# apple-touch-icon-から始まるpngはapple-touch-icon.pngを読み込む
RedirectMatch 301 /apple-touch-icon-(.*)?precomposed.png /apple-touch-icon.png
# bot対策
SetEnvIf User-Agent "MJ12bot" botjogai
SetEnvIf User-Agent "360Spider" botjogai
SetEnvIf User-Agent "MegaIndex" botjogai
SetEnvIf User-Agent "bidswitchbot" botjogai
SetEnvIf User-Agent "SMTBot" botjogai
SetEnvIf User-Agent "ltx71" botjogai
SetEnvIf User-Agent "trendictionbot" botjogai
SetEnvIf User-Agent "SemrushBot" botjogai
SetEnvIf User-Agent "AhrefsBot" botjogai
SetEnvIf User-Agent "Linguee" botjogai
SetEnvIf User-Agent "proximic" botjogai
SetEnvIf User-Agent "BLEXBot" botjogai
SetEnvIf User-Agent "GrapeshotCrawler" botjogai
SetEnvIf User-Agent "Mappy" botjogai
SetEnvIf User-Agent "integralads" botjogai
SetEnvIf User-Agent "jet-bot" botjogai
order Allow,Deny
Allow from all
Deny from env=botjogaiこの中の#sslの部分ででhttpをhttpsにリダイレクトすることでhttpsでのアクセスを強制しています！
でも、マルヒの認識では、これはハーフhttps化的なものであって、常時https化というとHSTSを使った方が良いと思います。
でも、失敗するとだいぶ困ったことになるので、まずはこのhttpをhttpsにリダイレクトまでが良いと思います！
また、高負荷対策やセキュリティ対策もしています。
後半のbot対策やxmlrpcの拒否等ですね。
ただ人によっては負荷を抑える事よりも、高負荷でもbotアクセスがあったほうが良い、という方もいるかもしれません。
その時は部分的に削除してください！
apple-touch-iconXXXX.png、favicon.ico
「apple-touch-iconXXXX.png」「favicon.ico」については、画像ファイルになります。
サイトのアイコンとして、ブラウザ等に使われます。
こちらのサイトに画像をアップロードすると必要なファイルを作ってくれます。
そういうの気にしない！というのであれば、小さい白抜きの画像でも大丈夫です。
これが結構な量アクセスされます。
用意していないと404が沢山出るので必ず用意しておきましょう！
エックスサーバーでWordPress！
インストール
早速インストールしちゃいます！
エックスサーバーのサーバーパネルへ接続します。
ドメインの「ドメイン設定」をクリックします。
ドメイン設定画面になればOKです。
ドメインにはエックスサーバー申込で自動的に払い出される初期ドメイン「xxxx.xsrv.jp」が記載されています。
ドメイン設定追加タブをクリックしてタブを切り替えます。
タブが切り替わればOKです。
ここに取得した独自ドメインを入力します。
また、無料SSLを利用するのチェックがついている事を確認してください。
確認画面へ進むボタンをクリックします。
確認画面に切り替わればOKです。
ドメイン名と無料独自SSL設定が追加になっていることを確認し、問題なければ「追加する」をクリックします。
設定完了画面に切り替わればOKです。
この後画面下部に「戻る」ボタン等があると思うのですが、キャプチャを漏らしてしまいました･･･。
無ければ画面上部の「トップ」リンクでトップに戻ります。
サーバーパネルトップ画面に戻ります。
ここからのサブドメイン追加については、必要に応じて行ってください。
取得したドメインに対し、サブドメインを作っていくつもサイトを構築する場合はサブドメインで実現できます。
ドメインの「サブドメイン設定」をクリックします。
サブドメイン設定画面になればOKです。
「サブドメイン設定追加」タブをクリックし、タブを切り替えます。
サブドメイン設定追加タブに切り替わればOKです。
画像ではセキュリティ上消してありますが、最初に設定したドメイン名が「.」以下に記載されているはずです。
独自ドメイン名の前に付くサブドメイン名を入力します。
無料独自SSLを利用するにチェックが入っている事を確認します。
「確認画面へ進む」ボタンをクリックします。
確認画面に切り替わればOKです。
サブドメイン名（独自ドメイン名まで含めた形で記載されます）と無料独自SSL設定が追加になっていることを確認します。
問題無ければ「追加する」をクリックします。
設定完了画面になればOKです。
画面にあるように、サブドメイン名のURLがインターネット上に認識される事や、独自SSLの設定が有効になるまでに一定の時間が掛かります。
「戻る」ボタンをクリックし、トップ画面へ戻ります。
画面下部にスクロールします。
WordPressの「WordPress簡単インストール」をクリックします。
WordPress簡単インストール画面に切り替わります。
「WordPressインストール」タブをクリックします。
WordPressインストールタブに切り替わればOKです。
インストールURLを指定します。
申込時に設定されている初期ドメイン、手順の中で設定した独自ドメイン、必要に応じて追加したサブドメインを選択します。
また、基本的にはインストールディレクトリを指定しておきましょう。
- ブログ名
サイトのタイトルの事でホームページ上部に表示されたり、検索時のタイトルに使われたりします。
後で変更する事ができます。 - ユーザー名
WordPressはブログ管理ツールなので、ブログ管理を行うWordPressユーザーです。
後で変更する事ができません。 - パスワード
WordPressユーザーのパスワードです。
インターネットに公開されているユーザーのパスワードなのでしっかりセキュリティの高いものにしてください。
それなりに攻撃されますので、安易なものでは乗っ取られますよ！
後で変更する事ができます。 - メールアドレス
WordPressユーザーのパスワードで、WordPressが更新された場合などで通知が飛びます。
後で変更する事ができます。 - キャッシュ自動削除
細かい解説が無いのでわかりにくいのですが、WordPressはアクセス時にページを生成します。
アクセス時の状態でページを作ることができる反面、表示までの時間が掛かってしまいます。
これをキャッシュ、つまり保存しておく機能があります。
このキャッシュ自動削除のチェックは、この保存したキャッシュを定期的に削除する機能です。
これをしておかないと、WordPressを更新しても古いキャッシュが読み込まれてページが作成されない原因にもなります。
チェックしておきましょう。
後で変更する事ができます。 - データベース
WordPressはデーターベースを使っています。
そのデータベース名やユーザーを手動で設定しておき、利用する事もできます。
特に名前などは後々必要になりません。
このインストールのタイミングで自動で設定する機能になりますので「自動でデータベースを生成する」で問題ありません。
ただし自動でつけるデータベース名は命名ルールがあるため推測できてしまいます。
パスワードがあるので簡単にはアクセスできませんが、セキュリティ上はよろしくないですね。
事前にデータベースを作っておくとより高いセキュリティで作ることができます。
そこはご判断にお任せします！
後で変更する事は基本的にはできません。
入力や設定を終えたら、「確認画面へ進む」ボタンをクリックします。
インストールの確認画面になればOKです。
入力した内容を確認して問題なければ「インストールする」ボタンをクリックします。
インストール完了画面になればOKです。
記載にもあります通り重要な情報になりますので控えておいてください。
「戻る」ボタンをクリックします。
WordPress簡単インストール画面のインストール済みWordPress一覧にインストールしたWordPressが表示されていればOKです。
「ダッシュボードへ」リンクをクリックします。
WordPressログイン画面が表示されればOKです。
ここでいきなりユーザー名とパスワードを入力しないようにしましょう！
「保護されていない通信」となっています。
この状態ではユーザー名とパスワードが暗号化されずに通信されています。
アドレスの「http」を「https」に変更します。
また、「wp-login.php」以下のURLを削除します。
こんな状態ですね。
これでエンターキーを押下し、このURLでアクセスし直します。
再びログインページが表示されます。
このとき、URLの所に「南京錠」マークがつけばOKです！
暗号化された通信になっていて、ユーザー名やパスワードは保護されています。
- ここまで時間を空けずに設定してきている場合SSLを開始できない場合があります。
SSLの設定をするための時間が掛かっている場合があり、時間を開けて変更すると変更できるようになる場合があります。
南京錠が付かないときはしばらく時間を空けましょう。
WordPress簡単インストールの際に設定したユーザー名とパスワードを入力します。
「ログイン」ボタンをクリックします。
ダッシュボード画面になればOKです。
ここまでがインストール作業になります！
ほとんどボタンクリックで行けちゃいます。
- ブラウザ画面でポチポチ進めていくだけ！
- トラブルが出ると途端に難しくなるので、誰かに助けを呼べる準備があると良いかもしれないですね！
WordPressの設定
ここからは名前を決めたりする手順が出てきます。
ここからはWordPressの設定をしていきます！
左ペインの「設定」の「一般」をクリックします。
一般設定画面になればOKです。
- WordPressアドレス(URL)
「http」を「https」の変更だけ行います。
画像で「/wp」となっていますが、インストール先ディレクトリの例としてこうしています。
ここはインストール先ディレクトのままでいいので、変更しないでくださいね！
ここを誤ると管理画面に入れなくて哀しくなるので気を付けてください！
早いうちに体験しておくのもありかもしれませんが･･･。 - サイトアドレス(URL)
インストールディレクトリを削除し、「https://ドメイン名(○○○.com)」に変更します。
とりあえずここだけ変えればOKです。
画面下部へスクロールします。
「変更を保存」をクリックします。
このときが一番ドキドキします…。
強制ログアウト状態になりますが落ち着きましょう。
WordPressログイン画面が出ていればまあ大丈夫です。
WordPressユーザーのユーザー名とパスワードを入力し、ログインをクリックします。
管理画面になればOKです。
左ペインの「設定」の「パーマリンク設定」をクリックします。
パーマリンク設定画面になればOKです。
カスタム投稿に変更し、「/%postname%」にします。
パーマリンクはページ毎のURLです。
理由はここでは割愛しますが、この設定にして、毎回しっかりURLを考えてつけるようにしてくださいね！
これは必ずではないのですが、一度作りだしてから後で変えるのが大変なんです。
URLに意味があって、上位から下位にカテゴリされていて、日本語は避けておくと良いようです。
画面下部へスクロールします。
「変更を保存」をクリックします。
パーマリンク構造を更新しましたと出ればOKです。
「外観」の「テーマ」をクリックします。
テーマ画面になればOKです。
これからWordPressのテーマを変更します。
この手順は必須ではありません。
ただ、恐らく何かしらのテーマを使われると思います。
その時のための練習と思って頂いてもいいと思います。
テーマ次第でカスタマイズ内容が大きく変わる面もあるので、色々お試し頂けると良いと思います。
良さそうなものがあったら、それをマスターすると良いと思います！
「新規追加」をクリックします。
画面が少し変わります。
「テーマのアップロード」をクリックします。
ファイルの選択ができるようになればOKです。
「ファイルを選択」をクリックし、「simplicityx.x.x.zip」を選択します。
今すぐインストールをクリックします。
インストールが完了すればOKです。
「テーマのページに戻る」をクリックし、再度「simplicity2」の子テーマをインストールします。
※同じ操作なので画面は省略しますね！
子テーマも同じようにインストールが完了しましたとなればOKです。
インストールが完了したら「有効化」を選択します。
- 有効化するのは子テーマの方です！
有効なテーマが「simplicity2」子テーマになっていればOKです。
この状態ですとサイトが表示されないので、サイトが表示されるように設定を行います。
前提として作っていただいたファイルを有効化していきます。
今回はFFFTPという外部のツールのキャプチャになります。
エックスサーバーのファイルマネージャーの機能を使って頂いて問題ありません。
インフォパネルから、対象サーバーの「ファイル管理」ボタンでファイルマネージャー機能を利用できます。
ファイルマネージャーの起動手順だけ簡単にご案内しておきます。
インフォパネルのサーバーを表示します。
「ファイル管理」ボタンをクリックします。
ファイルマネージャー画面が表示されればOKです。
後はディレクトリの移動や、ファイルのアップロード、ファイル削除を手順と同じ形で実施頂ければOKです！
では、手順に戻ります。
サーバーにアクセスします。
独自ドメインにWordPressをインストールした場合は次のディレクトリに移動します。
「/独自ドメイン名/public_html/インストールディレクトリ」
サブドメインにWordPressをインストールした場合は次のディレクトリに移動します。
「/独自ドメイン名/public_html/サブドメイン/インストールディレクトリ」
指定のディレクトリへ移動できればOKです。
サーバー上から「index.php」をダウンロードします。
このダウンロードしたindex.phpの17行目を編集します。
編集前：require( dirname( __FILE__ ) . ‘/wp-blog-header.php’ );
編集後：require( dirname( __FILE__ ) . ‘/【インストールディレクトリ】/wp-blog-header.php’ );
独自ドメインにWordPressをインストールした場合は次のディレクトリに移動します。
「/独自ドメイン名/public_html」
サブドメインにWordPressをインストールした場合は次のディレクトリに移動します。
「/独自ドメイン名/public_html/サブドメイン」
指定のディレクトリへ移動できればOKです。
ダウンロードした「index.php」をアップロードします。
また、作成しておいた「.htaccess」と「apple-touch-iconxxx」、「favicon.ico」をサーバー上へアップロードします。
サーバー側へアップロードできればOKです。
※ちなみに画像ではまだ「apple-touch-iconxxx」、「favicon.ico」をアップロードしていませんが、してしまってOKです。
サーバー上の「index.html」を削除します。
確認画面が出たらOKです。
「はい」を選択し、ファイルを削除します。
サーバーから削除できればOKです。
これで設定が完了しました。
独自ドメインへインストールした方は以下にアクセスしてください。
「https://独自ドメイン」
サブドメインへインストールした方は以下にアクセスしてください。
「https://サブドメイン」
サイトが表示されればOKです！
後はプラグインです。
プラグインについてはかなり人によって好みのわかれるところだと思います。
また、運営したいサイトによっても大きく変わってきます。
シンプルなサイトを作る場合、私のおすすめのプラグインを念のため紹介しておきます！
- 001 Prime Strategy Translate Accelerator
⇒高速化のためのプラグインです。 - All in one SEO Pack
⇒SEOのためのプラグインです。 - All in One WP Security
⇒セキュリティのためのプラグインです。 - All-in-one WP Migration
⇒バックアップ、移設のためのプラグインです。 - Autoptimize
⇒高速化のためのプラグインです。 - Classic Editor
⇒これは入れておきましょう！ - EWWW Image Optimizer
⇒高速化のためのプラグインです。 - Jetpack by WordPress.com
⇒統計情報を見たり、その他もろもろのためのプラグインです。 - Redireciton
⇒リダイレクションのためのプラグインです。 - Table of Contents Plus
⇒見出しを付けるプラグインです。 - WP Multibyte Patch
⇒とりあえず入れっぱなしです。
ここではプラグインについて詳しい解説は割愛します！
- 慣れるまでは何でもかんでも入れすぎない方が良いです！
- 割と突然WordPressが思ったように動作しなくなるのはプラグインが原因となっている事が多いです！
- 沢山入れてしまうと、どれが原因か特定するのに時間が掛かります！
細かなカスタマイズは最初は決められないので、後で変えていくことでもいいと思います！
ファイルベースの設定
もうちょっとで設定が完了します！
これから続く、「テーマの編集」は必須ではないのですが、やっておくと良いです。
でも、ちょっと危険です！
これから重要な「function.php」というファイルを変更する事になります。
失敗するとWordPressにアクセスできなくなります！
自信のない方はfunction.phpのバックアップを取れるようになってから行いましょう。
いきなりは危険です！
- 失敗するとWordPressにアクセスできなくなります！
- バックアップや復旧に自信のあるようになってからやりましょう！
不安な方はファイルマネージャーの操作まで飛ばしちゃいましょう！
でも、いつかは通る道ですよ！
WordPress管理画面を開きます。
左ペインの「設定」の「テーマの編集」をクリックします。
ここでダイアログが表示されるかもしれません。
テーマの編集画面になればOKです。
右ペイン「テーマファイル」内の「テーマのための関数(function.php)」をクリックします。
テーマのための関数の編集画面になればOKです。
「//以下にSimplicity子テーマ用の関数を書く」
の下に、以下のコードを適宜貼り付けます。
必要に応じて取捨選択してください。
なお、記載する際はその変更内容も押さえておいてください！
- 外部ツールからWordPressの更新ができるxmlrpcという機能があります。
使わなければ「xmlrpc」に関する記述は記載しておいた方が良いです。 - 投稿者アーカイブ非表示は、基本的には記載しておいた方が良いです。
- 自動保存については賛否分かれると思います。
自動保存が有効だとそれなりにアクセス数が増します。
保存忘れをしない自信があって、更新漏れの心配が無ければ記載しておいた方が良いです。
// xmlrpc
add_filter('xmlrpc_enabled', '__return_false');
// 投稿者アーカイブ非表示リダイレクト
function author_archive_redirect() {
if( is_author() ) {
wp_redirect( home_url());
exit;
}
}
add_action( 'template_redirect', 'author_archive_redirect' );
// 自動保存を無効にする処理
function autosave_off() {
wp_deregister_script('autosave');
}
add_action( 'wp_print_scripts', 'autosave_off' );
変更後「ファイルを更新」をクリックします。
無事ファイル更新ができればOKです。
また、同じ手順で「header-insert.php」についても変更を行います。
「//↓ここに挿入?>」の下に以下をコピペして「ファイルを更新」をクリックで変更を保存してください。
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" /> <link rel="apple-touch-icon" href="/apple-touch-icon.png" /> <link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-57x57.png" /> <link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-60x60.png" /> <link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-72x72.png" /> <link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-76x76.png" /> <link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114x114.png" /> <link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png" /> <link rel="apple-touch-icon" sizes="144x144" href="/apple-touch-icon-144x144.png" /> <link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152x152.png" /> <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon-180x180.png" />
無事ファイル更新ができればOKです。
これで大まかなセットアップはできました！お疲れさまでしたぁ！！
あ、画像が無いのですが、ユーザーのニックネーム名は変えておきましょうね！
後はテーマのカスタマイズ、追加のcss等で、お好みのデザインにしてブログを楽しみましょう！
いずれ外部のGoogle Analyticsや、Google Search console等を導入し、「robots.txt」も編集ていきたいですね！
- テーマの編集は自信のない方はやめておきましょう！でも、失敗できるうちにやっておきましょう！
- 何もなければ本当にスムーズです！何か起こると数日の間途方に暮れるかもしれません！
まとめ
いかがでしたでしょうか？
何も起こらなかった場合、思ったよりも簡単だったと思って頂けると思います！
でも、何か起こってしまった場合は大変だったと思います。
- 手順通り進めていくとエックスサーバーでWordPressが始められます！
- HTTPS化、セキュリティ対策、高負荷対策までしちゃいます！
あ、セキュリティ対策はまだまだやる必要があると思いますので、アンテナを張ってしっかり対策していきましょう！
補足
説明不足や手順の誤り等があれば、本当にすみません。
検証したいのですが、さすがに環境を用意できなくって検証できていません。
何回も繰り返しインストールは経験しています。
ただ、初期ドメインとかは最初の一回だけなので、その辺で間違いがあったらと思うと怖いです。
マニュアル等確認して大丈夫だと思っているのですが。
もしうまくいかないときなどは、ご連絡頂けばと思います。
ただ、お返事直ぐにできるかわかりません･･･あと、基本メールになってしまいます。