こんにちは。うりのすけです。
今までずっとブログのカスタマイズはWEB上で直接編集していました。でもこれってリアルタイムで ユーザーが アクセスしていたらコロコロデザインが変わって怪しく思いますよね?
なので自分のパソコン上にWordPressをインストールしてローカルで編集できる環境を作ることにしました。
今回は、自分のパソコンで操作・編集できるローカル環境を構築できるXAMPPというフリーソフトをインストールして自分のパソコン上にWordPressをインストールする方法をご紹介いたします。
「ローカル環境でサイトデザインを変更したい」という方や、「自分でオリジナルのテーマを作ってみたい」という方はぜひ参考にしてみてください。
WordPressをローカル環境で編集するには
WordPressを動かすためには、
・ウェブサーバー
・SQLデータベース
・ウェブで動作するプログラム言語
が必要になります。
これをローカル環境で動作させるソフトを自分のパソコンにインストールして、そこにWordPressをインストールすることでローカル環境でWordPressを編集することができるようになります。
XAMPPとは
XAMPPはWindowsやMac OS Xなど色々なOSにローカル環境を簡単に構築するソフトです。本来は、それぞれの動作に必要なソフトをインストールしなければならないのですがXAMPPは一括でインストールすることで、すぐに開発環境を構築することができます。
XAMPPではそれぞれの動作は
・ウェブサーバー ⇒ Apache
・SQLデータベース ⇒ MySQL
・ウェブで動作するプログラム言語 ⇒ PHP
となります。
Mac OS Xを使用している方は、専用にアイ発されているMAMPというソフトがあるようなのでMacユーザーの方はそちらを使用する方が良いようです。
XAMPPのインストール
1.公式サイトでXAMPPをダウンロード
2.XAMPPをインストール
3.XAMPPの設定
4.ローカル環境にWordPressをインストール
1.公式サイトでダウンロード
まずは、公式サイトでソフトをダウンロードします。
上の方のタブのダウンロードをクリックします。
お使いのOSの最新版をダウンロードしましょう(2019.12現在 Ver.7.3.12)
XAMPPをインストール
ダウンロードが終わったら、インストーラーをダブルクリック!
とりあえずNextです!
インストールするソフトの選択画面です。すべてチェックでOKです。
Nextをクリック!
インストールするフォルダの選択。そのままでNextです!
広告へのリンクです。チェックを外すと広告に飛ばないのでチェックを外してNextをクリックしましょう。
そのままNext!
インストールが始まります。容量がおおいのでそこそこ時間がかかります(10分程度?)
XAMPPのコントロールパネルに行きますか?と聞かれているのでチェックを入れてFinishでインストールは完了です。
XAMPPの設定
先ほどの流れでコントロールパネルが開くので設定していきましょう。
手順としては、下記となります。
1.ApacheとMySQLの起動
2.MySQLのパスワード設定
3.MySQLにWordPress用データベースを作成
ApacheとMySQLの起動
まずは、ApacheとMySQLを起動させます。
他のシステムとポートが干渉している場合、起動できないことがあります。
ポートというのは、システムが通信するための部屋のようなもので1つのシステムに1つのポートしか使用できません。
なので干渉している場合、どちらかのシステムのポートを変更する必要があります。
今回は、XAMPPのポートを変更する方法を説明します。
下図のNet Statをクリックします。
すると、ポート番号一覧が出てくるので、この中にない数字を選びます。
次にconfigをクリックするとControl Panelが開くので、Serice and Port Settingをクリックします。
ポート番号の設定に行くので、さっき確認した番号を入力します。
テキストエディタが開くので、「clt+f」で文字検索をします。
まず「Listen 80」を検索、80の部分をさっきの番号に変更します。
つぎに「localhost:80」を検索、80の部分をさっきの番号に変更します。
変更したら、テキストファイルを保存しましょう。
Control Panelにもどり、Apacheを起動してみましょう。
Apacheの文字の背景が緑になれば起動OKです。
MySQLパスワードの設定
初期状態ではMySQLのパスワード設定がされていないのでパスワード設定を行います。
Control Panelに行き、Shellをクリックします。
すると、コマンドプロンプトが起動します。
「 mysqladmin -u root password」を入力してEnterを押します。
New passwordと出てくるので、希望のパスワードを入力してEnterを押します。確認のためもう一度パスワード入力を求められるので先ほどのパスワードを入力してEnterを押したら完了です。
コマンドプロンプトでの設定が終わったら、システムファイルの設定を変更します。
XAMPPをインストールしたフォルダに行きます。デフォルトのままならCドライブの直下にあります。
C:\xampp\phpMyAdminにある「config.inc.php」というファイルをテキストエディタで開きます。
下図のコードの中から赤下線の行の「*******」のところにさっき決めたパスワードを入力します。
テキストファイルを保存すればパスワード設定は完了です。
WordPress用データベースの作成
今度は、WordPress用のデータベースを作ります。
Control Panelにもどり、MySQLのAdminをクリックし phpMyAdminを起動します。
左のリストの新規作成をクリックします。
データベースの作成画面になるので、好きなデータベース名を入力して作成をクリックします。
これで、データベースの作成が終わりXAMPPの全ての設定は完了です。
ローカル環境にWordPressをインストール
これからWordPressのインストールを行っていきます。
公式サイトからWordPressをダウンロードしましょう。
WordPressを入手をクリックします。
ダウンロードをクリックします。
ダウンロードしたファイルを解凍して、C:\xampp\htdocsにフォルダごと移動します。
htdocsに移動したフォルダは任意の名前に変更します。今回は「Original_Theme」とします。このフォルダ名がローカル環境でのWordPress URLとなるので「 localhost:(設定したポード番号、今回は80)/Original_Theme」がURLとなります。
名前を変更したら、ローカル環境のWordPressにアクセスしてみましょう。
ブラウザを立ち上げて先ほどのURL「localhost:80/Original_Theme」にアクセスします。
インストール画面が立ち上がるので赤枠をクリックします。
各項目を入力し、送信をクリックします。
・データベース名:wordpress(MySQLで設定したデータベース名)
・ユーザー名:root
・パスワード:コマンドプロンプトで設定したパスワード
・データベースホスト名:localhost(初期設定そのままでOK)
・テーブル接頭辞:そのままでOK(変更してもよい)
インストール実行をクリックでインストールが始まります。
WordPressのサイト情報入力画面になるので、各種入力してWordPressをインストールをクリックします。
成功しました!が表示されれば完了です。ログインをクリックしましょう。
ログイン画面になるので、ログインしましょう。
見慣れたダッシュボード画面に行けます。
ここでブックマークしておくと、またアクセスするときに便利なのでブックマークしときしましょう。また、
また、ローカル環境で編集をする際にはXAMPPのApacheとMySQLを起動しないとWordPressが動かないので注意が必要です。
最後に
今回は自分のPCにローカル環境を構築する方法をご紹介しました。
設定は少し面倒ですが、ローカル環境を構築できるメリットは大きいと思います。ユーザビリティーを考えるとオンラインでサイトをカスタムすることは良くないので導入をおススメします。
ローカル環境での作業ができるようになったので、オンライン上で行っていたサイトのカスタムは今後ローカルで実施するようにします。
そのうち自分でテーマ作成にもチャレンジしてみたいですね。
他のブログ運営記事は下記にまとめています。こちらも読んでみてください。