Webの記録

WordPressテスト環境をMAMPで作ってみた♪ for Mac

投稿日:

この記事は約 4 分で読めます。

WordPressのテーマ作りなどをする時、いきなり本番サイトでは試せないので、テスト環境をMacのパソコンに作りました。

WordPressテスト環境をXAMPPで作ってみた♪for Windows」では、WindowsでXAMMPを入れてテスト環境を作ったのですが、今回はMacでMAMPを使ったテスト環境作りをしたいと思います。

XAMPPでも良いのですが、MacではよくMAMPが使われているようですので今回はMAMPを使ってみます。

目次

  • MAMP導入・設定方法
  • WordPress導入・設定方法

MAMP導入・設定方法

MAMPのダウンロード

MAMPサイトにアクセスします。「MAMP」と「MAMP PRO」の2種類ありますが、今回は左側の「MAMP」をクリックしてダウンロードします。


 

ダウンロードしたファイルを解凍してdmgファイルを実行させると、MAMPインストールの画面になります。そのまま画面に従って進みます。使用許諾の画面も出てきます。問題がなければ同意してインストールを完了させます。


 

「MAMP」フォルダをアプリケーションフォルダにコピーし、「MAMP」フォルダの中の「MAMP.app」をダブルクリックするとMAMPが起動します。
「スタートページを開く」ボタンを押して、「phpMyAdmin」のページを開きます。

※起動している時は、MAMPのコントロールパネルのランプは緑です。停止している時のランプは、赤です。

 

phpMyAdminの設定

「phpMyAdmin」のページを開き、「新規データベースを作成する」の最初の枠にデータベース名を入れます。(例として「wordpress」を入れました)
MySQL接続の照合順序は「utf8_general_ci」を選択します。


 

「データベース○○○を作成しました」というメッセージが出たら、データベースの設定完了です!


 

WordPress導入・設定方法

WordPressインストール

WordPress日本語サイトを開いて、最新版をダウンロードします。ファイルを解凍して、「MAMP」フォルダの中の「htdocs」の中に入れます。


 

ここで「http://localhost:8888/wordpress/」とブラウザのURL欄に入力します。(Apacheのポート設定を変更している場合は、そのポートを指定します)
すると、「ファイルが見つかりません・・・」の画面が出ますが、ここは「設定ファイルを作成する」ボタンを押して次に進みます。


 

ひとまず、「次に進みましょう!」ボタンを押しましょう!


 

データベース名:phpMyAdminの設定でつけた「データベース名」(例:wordpress)
ユーザー名:root
パスワード:root
データベースのホスト名:localhost
テーブル接頭辞:wp_(デフォルトの状態にしています。複数のWordpressを入れる場合は変更するようです。)
ここまで入力したら、「作成する」ボタンを押します。


 

「この部分のインストールは無事完了しました。・・・」の画面が出たら、あと一息です!「インストール実行」ボタンを押します!


 

サイト情報を入力する画面が出ます。Wordpressにログインするためのユーザー名とパスワード、メールアドレスを入力し、「Wordpressをインストール」ボタンを押した後に「成功しました!」画面が出たら、インストール終了です♪


 

ログイン画面で、先ほど設定した「ユーザー名」と「パスワード」を入力して「ログイン」ボタンを押します!

無事にWordpressのダッシュボード(管理画面)が開けました!さて、これでテスト環境を作るさ作業は終わりです♪お疲れ様でした!!


 

環境によって多少設定が違う部分もあると思います。ひとまず今回、私の環境で設定したものをメモしてみました。
1回設定しちゃうと忘れてしまうので、備忘録です。。。

-Webの記録
-, , ,

執筆者:


  1. […] め、ローカルでPHPを動かせる環境にしました。 参考記事:WordPressテスト環境をMAMPでつくってみた♪ […]

  2. […] 平行して複数のウェブサイトをデザインする機会があったため、MAMPを使いつつ管理する方法を試してみました。 htdcos/projectA/xxx とするとlocalhost/projectA/xxxとしてサイト表示します。できればlocalhost/xxxとパス構築した方が効率がいい。というメリットにより、色々な方がバーチャルサイト構築を試されていた様子なので参考にしました。 *この解答が最も参考になったのでメモ→リンク *MAMPを使ってサイト作成について→リンク […]

comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

This blog is kept spam free by WP-SpamFree.

関連記事

no image

右クリック禁止で画像のコピーガード(ドラッグ禁止対策追加)

この記事は約 2 分で読めます。 【2015.2.20追記】設置方法にドラッグ禁止についても、対策追加しました! 今、あるところのサイト制作をしているのですが・・・。 「画像の著作権を守るため、画像の …

no image

画像最適化に便利な4つのツール

この記事は約 1 分で読めます。スマホを意識したWebページを作っていると、避けて通れない「画像最適化」。 昨年あたりから少しずつ使っていますが、見た目は変わらないのに軽量になるから不思議です! 私が …

no image

WordPress記事中の文章をコピーしたら管理者にお知らせしてくれるプラグイン「Check Copy Contents(CCC)」を試してみた

この記事は約 2 分で読めます。 私の過去記事で人気なのが、「画像のコピーガード」。画像を盗用されることに対して対策を打ちたい方がたくさんいらっしゃるのでしょう。 もしこれが記事中の文章においても、コ …

no image

WordPressでオリジナルテーマ作りにチャレンジ7【page.php編】

この記事は約 1 分で読めます。WordPressのオリジナルテーマ作りにチャレンジしています。 前回までで一通り表示は出来るのですが、今回気になるのは固定ページ。 お問い合せフォームの上にページをい …

no image

Androidでp要素などが、勝手に改行されて幅が狭くなった時にしてみたこと。

この記事は約 1 分で読めます。 PCと同じようにスマホでも閲覧することが当たり前になって、最近ではアクセス解析をするとPCからの閲覧をすっかり抜いてしまったサイトもあります。 スマホからの見え方をチ …