Codepia

MAMPを使ったWordPressのローカルテスト環境を設置|ダウンロードから初期設定まで完全解説

ページ内には広告が含まれます広告ポリシー

WordPressのテスト環境をパソコンにインストール、無料でテストサイトを作成する手順をステップバイステップで解説します。MAMPの導入、データベース作成、WordPressの初期設定まで、初めてでも順番に進められるようにまとめました。

WordPressとは

WordPressは、ブログやホームページを作るためのCMSと呼ばれるシステムで、世界のホームページのおよそ40%強で使われていると言われています。通常のHTML/CSSで構成されたホームページと違って、独自の管理画面から記事・画像・カテゴリー・デザインなどの編集を行うことができるのが特徴です。

独自カスタマイズの幅が非常に広く、利用者数に比例して情報量も多いことも人気の要因です。サイトをゼロからデザインできることはもちろん、プログラムが苦手な方でも、テンプレートや追加機能のプラグインを使って、直感操作でサイトをデザインできるようになっています。

個人ブログだけでなく、大型サイトや企業ホームページなど、色々な形態で使用されています。ちなみに当サイトもWordPressを使っています

WordPressのダッシュボード画面
WordPressのダッシュボード画面

WordPressは、SQLと呼ばれるデータベースを介して管理します。データベースは通常、レンタルサーバーに契約することで使うことができるようになりますが、使いこなせるかわからないものにお金を支払うのは少し抵抗があります。そこで今回まとめているのが、無料のオフライン環境を設置するというものです。

これはWordPressでホームページ制作を進める最もスタンダードな手法の1つで、オフライン環境で事前にサイトを構成、準備してからウェブ上に公開することで、実際のサイト上での混乱を避けることができます。

通常のHTMLサイトとWordPressの違い

一般的なHTMLサイトでは、HTMLやCSSのファイルを直接編集してページを作ります。そのため、HTML、CSS、JavaScriptだけで構成される場合は、必ずしもデータベース環境は必要ありません。

HTMLサイトはファイルをブラウザで直接確認できることを示した図
HTMLサイトはファイルから直接展開

一方、WordPressでは、記事本文や設定内容をデータベースに保存し、閲覧者がサイトにアクセスしたタイミングでページが組み立てられます。そのため、WordPressを動かすには、PHPデータベースを備えるサーバー環境が必要になります。

WordPressがPHPとデータベースを使ってページを表示する仕組み
WordPressはPHPとデータベースを使ってページを表示

そこで今回紹介するMAMPをインストールすると、パソコンの中にこれらの機能が使えるテスト環境を用意することができるようになります。これにより、本番と同じ環境で、WordPressをテストできるようになります。

  • 今回導入するWordPressもMAMPも、無料で使える
  • WordPressとMAMPは別ソフトで、それぞれダウンロードとインストールが必要

MAMPとは

MAMPは、パソコン内にデータベースと仮想Webサーバー環境を作るためのソフトです。簡単に言うと、WordPressをローカル環境で動かすための土台ツールです。

  • 本番サイトに影響を出さずにWordPressを試せる
  • テーマやプラグインのテストができる
  • 失敗してもローカル環境なのですぐにやり直し可能
  • 複数サイトの管理も可能

MAMPを使うメリット

ローカル環境を作る方法はいくつかありますが、MAMPは操作画面がシンプルで、初めてでも導入しやすいのが特徴です。

  • 完全無料でWordPressのローカル環境が作れる
  • ツールとしての歴史が長く、動作が安定している
  • MacとWindowsの両方で使える
  • WordPress設置に必要なものを全て備えている
  • 操作がわかりやすく、本番環境と同じ要領で使える

テスト完了後は、ローカル環境で取り入れたプラグインや編集、作成した記事など、本番環境でも全く同じように動作させることができるので、本番移行時の混乱が起きにくい点もおすすめです。

ちなみにMAMPには有料版のPROもありますが、この記事で行うWordPressのローカル環境作成は、無料版のMAMPのみで進められます。また今後も含め、有料版はよほど大規模なことをしない限り、まず使うことはありません。

MAMPを導入する

MAMPをダウンロードする

まずは、MAMP公式サイトを開きます。画面右上のダウンロードページボタンをクリックすると、MAMPのインストーラーがダウンロードされます。

MAMPの公式ホームページを紹介
MAMP公式サイト

MAMPをインストールする

ダウンロードしたファイルを開き、画面の案内に沿ってMAMPをインストールします。ここでもインストール中に追加オプションやMAMP PROの案内が表示される場合がありますが、今回はスキップでOKです。この記事の手順で行なっていることは、全て無料版のMAMPを使います。

MAMPのインストール完了までの流れ

インストールが完了したら、MAMPを起動します。

MAMPを起動する

MAMPを開いたら、まずはサーバーを起動できるか確認します。画面右上にあるStartボタンをクリックしてください。

数秒後、ボタン表示がStopに切り替わり、そのまま安定していれば、MAMPの起動に成功しています。

MAMPのスタート・ストップボタンの場所の説明
MAMPのスタートボタンをクリック

エラーが発生した場合は、ポート番号を確認

MAMPでは、ブラウザからローカルサーバーへアクセスするときにポート番号と呼ばれる識別番号を使います。基本は初期設定そのままで起動するはずですが、エラーが発生した場合はMAMPの設定画面で、次のポート番号になっているかを確認してください。

  • Apache Port:8888
  • MySQL Port:8889
MAMPの設定画面の紹介
MAMPの設定画面

WordPressを導入する

WordPressをダウンロードする

MAMPの準備ができたら、次にWordPress本体をダウンロードします。今回は、WordPress.orgから無料配布されているWordPress本体を使います。

WordPress公式サイトから、WordPress本体をダウンロードする流れ
案内に沿ってWordPressをインストール

WordPress.org 日本語公式サイトを開き、WordPressを入手からダウンロードページへ進みます。

ダウンロードページにあるWordPressをダウンロードボタンをクリックすると、WordPress本体のzipファイルが保存されます。

WordPressフォルダをhtdocsに入れる

WordPress用フォルダ作成の流れ
WordPress用フォルダ作成

ダウンロードしたWordPressのzipファイルを解凍します。解凍すると、通常はwordpressという名前のフォルダができます。

このフォルダを、MAMPのhtdocsフォルダの中へ移動します。

  • Mac:/Applications/MAMP/htdocs/
  • Windows:C:\MAMP\htdocs\

フォルダ名は、テストサイトのURLに使われます。管理しやすいように、半角英数字で分かりやすい名前に変更しておくのがおすすめです。

たとえば、フォルダ名をtestsiteにした場合、仮想サイトのURLはhttp://localhost:8888/testsite/になります。

WordPressフォルダ名変更の説明
サイト名がわかりやすいフォルダ名に設定

複数サイトのテストを予定している方は、ベースのWordPressフォルダは残しておき、フォルダを丸ごとコピーしたものを使うのがおすすめです。

データベースを作成する

WordPress本体を配置したら、次にWordPress用のデータベースをMAMPのサーバー内に作成します。

MAMPを起動した状態で、画面右上にあるWebStartボタンをクリックします。表示されたページの中にあるMySQLと書かれたトグルをクリックし、展開された中にあるphpMyAdminを押すと、先へ進みます。

phpMyAdminボタンを探す流れの説明

Apacheのポート番号が8888(初期設定)の方は、こちらのURLからも直接アクセスできると思います。

phpMyAdminが開いたら、左側のメニューにある新規作成をクリックします。

データベースを作る流れの説明
仮想サーバーにデータベースを作成

データベース名を入力(任意の半角英数字)し、作成ボタンを押します。データベース名は何でも構いませんが、WordPressフォルダ名と合わせるのがおすすめです。

  • フォルダ名:testsite
  • データベース名:testsite

照合順序は、日本語向けのutf8mb4_general_ciを選びます(バージョンにより出現項目が変わる場合があります)。見つからない場合は、utf8mb4_unicode_ciutf8_general_ciでもOKです。

照合順序は、データベース内の文字を認識する際の機械的なルールのことです。色々種類がありますが、utfmb4_general_ciがおすすめです。以前はutf8_general_ciが主流でしたが、ここ数年は最新の絵文字や記号をうまく出せない時があると言われています。

WordPressをインストールする

ローカルサーバーURLにアクセスする

ここまで進めば、WordPressをインストールする準備は完了です。

Chromeなど任意のブラウザを開き、ローカルサーバーのURLにアクセスします。Apache Portを変えていない場合は、http://localhost:8888/を開きます。

ローカルサーバーのURLにアクセス場所を確認する説明
ローカルサーバーのURLにアクセス

htdocsに入れたWordPressフォルダが表示されるので、先ほど変更したフォルダ名をクリックします。

フォルダ名をtestsiteにしている場合は、URLはhttp://localhost:8888/testsite/になります。

データベース接続情報を入力する

WordPressの初期画面が表示されたら、さあ、始めましょう!をクリックします。

WordPressをインストールする流れ

次の画面で、データベース接続情報を入力します。

WordPressのデータベース接続情報を入力する画面
データベース名、ユーザー名、パスワードを入力します
  • データベース名:phpMyAdminで作成したデータベース名
  • ユーザー名:root
  • パスワード:root
  • データベースのホスト名:localhost
  • テーブル接頭辞:wp_のままでOK

ユーザー名とパスワードのrootは、WordPress管理画面のログイン情報ではなく、MAMP内のMySQLデータベースに接続するための情報です。ここ以外で使うことはほとんどありません。

入力できたら送信をクリックします。内容に問題がなければ、WordPressのインストール画面へ進みます。

サイト情報を入力する

続いて、WordPressサイトの基本情報を入力します。

WordPressのサイト情報を入力する画面
サイト名とログイン情報を入力します
  • サイトのタイトル
  • ユーザー名
  • パスワード
  • メールアドレス

ここで設定するユーザー名とパスワードは、実際にWordPress管理画面にログインするための情報です。そのため先ほどと違って、自身で決めた任意のものを設定する必要があります。1つ前のMySQL用のrootとは別物なので、混同しないようにしてください。

ここで設定したユーザー名とパスワードは次の項目でも使います。入力が終わったら、WordPressをインストールをクリックします。

WordPressにログインする

インストールが完了すると、ログイン画面へ進めるようになります。

先ほど設定したWordPress用のユーザー名とパスワードを入力し、ログインしてください。

WordPressのログイン画面
設定したユーザー名とパスワードでログインします

ダッシュボードが表示されれば、MAMPを使ったローカル版WordPressの導入は完了です。

まとめ

今回は、MAMPを使ってローカル版WordPressを導入する手順を解説しました。ここである程度サイトとして形成したあと、オンライン上に公開という流れになります。

ローカル版WordPressを使えるようになると、本番サイトに影響を出さずにテーマ編集やプラグイン検証ができるようになるので、WordPressを学習する場合も、まずはMAMPで自由に触れる環境を作っておくと安心です。

トップへ戻る