更新日: 2022 / 06 / 09

5ステップでできる!Wordpressのローカル環境構築

カテゴリー: wordpress

Wordpressをローカル環境にインストールする方法を5つのステップで解説します。

Wordpressはツールを使えば誰でも簡単にインストールできるので、これからWordpressをはじめる人はとりあえず作っておくことをおすすめします。

  1. Wordpressになぜローカル環境が必要なの?

  2. ローカル環境はどうやって作るの?

    1. Local
    2. MAMP
    3. ローカル環境ツールのおすすめは?
  3. 5ステップでできる!Wordpressのローカル環境構築

    1. 1.MAMPをインストールして起動する
    2. 2.WordpressをダウンロードしてMAMPに入れる
    3. 3.phpMyadminでデータベースを作成
    4. 4.Wordpressのインストール
    5. 5.管理画面にログインして完了
  4. ローカル環境でWordpressテーマを編集するには?

    1. Wordpressテーマの場所
    2. テーマの編集方法
  5. 編集したテーマを公開するには?

  6. おさらい

Wordpressになぜローカル環境が必要なの?

Wordpressをカスタマイズする場合、レンタルサーバーに入れたもの(本番環境)を直接変更すると万が一エラーで画面が真っ白なってことになったりします。

運用中のサイトでそうなってしまうと大変なので、まずはローカル環境(開発環境)を作ってそちらで問題ないかを確認してから本番環境に適用するというのが一般的なWordpressカスタマイズの流れです。

ローカル環境はどうやって作るの?

ローカル環境の作り方はすごく簡単で、ツールをインストールしていくつか設定するだけです。慣れれば1分でできます。

ツールはいくつか種類がありますが、ここではよく使われている2つのツールを紹介します。

Local

LocalはWordpress専用のローカル開発ツール。

ローカル環境はどうやって作るの? Local

Wordpressに最適化されていて、SSHでのログインなど開発者向けの操作もできます。

元々サーバー屋さんが作ったということで作成したサイトをそのままサーバー(WPEngine)にアップロードする機能などもあります。

国内のレンタルサーバーを使う場合はアップロード機能が使えません。

MAMP

MAMPはローカル環境構築ツールで、LAMP環境を構築してくれます。

ローカル環境はどうやって作るの? MAMP

Localとの違いはWordpress以外のCMS(EC-CUBEなど)も入れられることや操作感がレンタルサーバーに近いことがあります。

Localのようにサーバーに直接アップロードする機能はないので自分で本番環境にアップロードします。

ローカル環境ツールのおすすめは?

Localを使った環境構築記事が多いですが、国内のレンタルサーバーでの操作に近いMAMPがおすすめです。

この記事ではMAMPを使ったローカル環境構築を解説します。

5ステップでできる!Wordpressのローカル環境構築

ではここからはMAMPを使ったローカル環境の構築方法を5つのステップで解説します。

  1. MAMPをインストール
  2. WordpressをダウンロードしてMAMPに入れる
  3. phpMyadminでデータベースを作成
  4. Wordpressのインストール
  5. 管理画面にログインして完了

5つもあって大変そうですがめちゃくちゃ簡単なのですぐにできると思います。

1.MAMPをインストールして起動する

まずは[MAMPのダウンロードページ]にアクセスして自分のOSに合ったダウンロードボタンを押します。

MAMPをダウンロード

ダウンロードボタンを押すと自動的にツールのダウンロードが始まるので完了したらパッケージを開いてインストールします。

インストールが完了すると無料版と有料版(Pro)が両方インストールされるのでMAMPのフォルダを開いて無料版の方(灰色のアイコン)を起動します。

5ステップでできる!Wordpressのローカル環境構築 MAMPをインストールして起動する2

起動すると画像のようなウィンドウが表示されます。右上にある「Start」アイコンをクリックするとMAMPを起動できます。

ポートの設定やサーバーの設定、使用するPHPのバージョンも変更できるので必要であれば変更します。とりあえず変更せずそのまま起動すれば大丈夫です。

5ステップでできる!Wordpressのローカル環境構築 MAMPをインストールして起動する3

終了する場合は「Stop」アイコンをクリックするかアプリを終了してください。

2.WordpressをダウンロードしてMAMPに入れる

レンタルサーバーの場合は簡単インストール機能でボタンクリックだけでインストールできたのですが、MAMPを使ってインストールする場合はWordpress自体をダウンロードする必要があります。

Wordpressのダウンロードページにアクセスし、ページ内にあるダウンロードボタンからダウンロードしてください。

5ステップでできる!Wordpressのローカル環境構築 Wordpressを公式サイトからダウンロード

MAMPの「htdocs」というフォルダににダウンロードしたzipファイルを入れて解凍します。解凍したフォルダ名は「wordpress」となっています。

htdocsはWindowsならここ

c:\MAMP\htdocs

Macならここです。

/Applications/MAMP/htdocs

5ステップでできる!Wordpressのローカル環境構築 ダウンロードしたzipファイルをhtdocsに入れて解凍

3.phpMyadminでデータベースを作成

次にWordpressで使用するデータベースを用意します。データベースはphpMyAdminというツールを使って管理できます。

以下のURLにアクセスしてphpMyAdminを開いてください。

http://localhost:8888/phpMyAdmin/

新しくデータベースを作成するにはデータベースタブから作成ページを開き、データベース名とutf8_general_ciを選択して作成ボタンを押します。

データベース名はなんでもいいですが、後で入力するのでわかりやすいものにしておきます。ここでは「worspress_blog」としました。

5ステップでできる!Wordpressのローカル環境構築 phpMyadminでデータベースをセット

作成後「このデータベースにはテーブルがありません」と表示されますが、問題ありません。

作成したデータベース名は後で使うので覚えておきましょう。

4.Wordpressのインストール

MAMPが立ち上がっている状態で次のURLにアクセスします。wordpressの部分はもしフォルダ名を変えている場合変更したフォルダ名にしてください。

http://localhost:8888/wordpress/

するとインストーラーが起動するので「さぁ始めましょう!」ボタンを押してインストールを開始。

まずはデータベースの設定です。

5ステップでできる!Wordpressのローカル環境構築 Wordpressのインストール1

  • データベース名: wordpress_blog(phpMyAdminで作成したデータベース名)
  • ユーザー名: root
  • パスワード: root
  • データベースホスト名: localhost
  • テーブル接頭辞: wp_

データベース名以外は固定でOKです。テーブル接頭辞は複数のwordpressを1つのデータベースで共有する場合に分ける必要があります。

「送信」ボタンを押し、次の画面で「インストール実行」ボタンを押してWordpressの設定を行います。

Wordpressのインストール設定2

  • サイトのタイトル: サイト名を記入
  • ユーザー名: ログイン時のユーザー名
  • パスワード: ログイン時のパスワード
  • パスワード確認: パスワードが短いことを許可する場合にチェック
  • メールアドレス: メールアドレスを記入
  • 検索エンジンでの表示: チェック外す

ユーザー名とパスワードはログイン時に必要なのでメモしておきます。

5.管理画面にログインして完了

無事作成できたらログインページに移動し、先ほどのユーザー名とパスワードを入力してログインします。

Wordpressのインストール設定2

お疲れ様でした、これでMAMPにWordpressをインストールしてローカル環境の構築完了です。

ローカル環境でWordpressテーマを編集するには?

ここまででローカル環境の構築は完了です。ここからはローカル環境のWordpressの編集〜サーバーに公開するまでを簡単に紹介します。

Wordpressテーマの場所

ローカル環境でWordpressテーマを編集するにはMAMPのhtdocsに入れたWordpressのファイルを編集すればOK。

テーマは以下の場所にあります。

htdocs/wordpress/wp-content/themes

ローカル環境でWordpressテーマを編集するには? Wordpressテーマの場所

テーマの編集方法

VSCodeのようなコードエディタでテーマフォルダ(例えばtwentytwenty)を開いて編集してください。

htdocs/wordpress/wp-content/themes/twentytwenty

ローカル環境でWordpressテーマを編集するには? テーマの編集方法

コードエディターで編集して保存すれば変更内容がページに反映されます。

編集したテーマを公開するには?

編集できたら本番環境(サーバー)にアップロードして公開します。公開するには次のようなことを行います。

  • 本番環境にテーマをアップロード
  • 記事のデータはWordpressのエクスポート機能でアップロード

テーマの変更はファイルごとにFTPツールでアップロードするか、テーマフォルダをzipにして管理画面からインストールします。

記事のデータは管理画面メニューの「ツール->エクスポート」で投稿内容やメディアファイルをエクスポートし、本番環境でインポートします。

おさらい

Wordpressをローカル環境にインストールする方法はすごく簡単なので一度覚えればすぐにできるようになります。ここまでをまとめるとこのようになります。

  • ローカル環境はLocalかMAMPが簡単
  • MAMPをインストールしてWordpressをhtdocsに入れる
  • phpMyadminでデータベースを作成
  • ブラウザでWordpressサイトにアクセスしてインストール
  • コードエディタでローカル環境のファイルを編集する
  • 編集できたらテーマや記事データを本番環境にアップロードして公開する

ここでは紹介しませんでしたが、ローカル環境ツールはLocalやMAMP以外にDockerという開発者向けのツールもあります。

こちらはコマンドラインを使って仮想環境を作るものでWordpressに限らずWebアプリの開発などでも使われている便利なもの。