MENU
  • プロフィールprofile
  • サービスService
    • WordPress個人レッスン
    • 起業女性に寄りそうWEBお悩み相談
  • 実績・お客さまの声portfolio
  • ブログblog
  • お問合せcontact

    カテゴリー

    • ホームページ個別レッスン
    • Web・SNS集客
    • Web系プログラミング
    • WordPressプログラミング
    • フリーランスの小技
    • Web活用相談
    • はじめてのWordPress
    • アメブロカスタマイズ
    • ホームページ制作
    • 自分で作れるおしゃれデザイン
    • アイデア・思考の整理

    タグ

    Adobe IllustratorGatsby.jsgitGitHubHTML/CSSMySQLNode.jsPythonSourcetreeSWELLWordPressおすすめWPプラグインおすすめツールアメブロエックスサーバーサーチコンソールセキュリティバレットジャーナルライブドアブログ環境構築確定申告開発環境

    アーカイブ

    • 2025年3月
    • 2025年1月
    • 2024年12月
    • 2024年3月
    • 2023年7月
    • 2023年1月
    • 2022年12月
    • 2022年11月
    • 2022年8月
    • 2022年4月
    • 2022年3月
    • 2022年2月
    • 2022年1月
    • 2021年12月
    • 2021年11月
    • 2021年10月
    • 2021年9月
    • 2021年8月
    • 2020年10月
    • 2020年8月
    • 2020年7月
    • 2020年6月
    • 2020年5月
    • 2020年4月
    • 2020年3月
    • 2020年1月
    • 2019年11月
    • 2019年9月
    • 2019年8月
    • 2019年5月
    • 2019年2月
    • 2019年1月
    • 2018年11月
    • 2018年9月
    • 2018年8月
    • 2018年7月
    • 2018年6月
    • 2017年10月
    • 2017年9月
    • 2017年7月
    個人事業主・女性起業家のためのWordPress・HP・ブログレッスン
    自分で作れる優しいホームページレッスン
    • プロフィールprofile
    • サービスService
      • WordPress個人レッスン
      • 起業女性に寄りそうWEBお悩み相談
    • 実績・お客さまの声portfolio
    • ブログblog
    • お問合せcontact
    自分で作れる優しいホームページレッスン
    • プロフィールprofile
    • サービスService
      • WordPress個人レッスン
      • 起業女性に寄りそうWEBお悩み相談
    • 実績・お客さまの声portfolio
    • ブログblog
    • お問合せcontact
    1. ホーム
    2. Web制作スキルアップ
    3. Web系プログラミング
    4. 【Mac】Localなら超簡単!WordPressのローカル環境を作る。

    【Mac】Localなら超簡単!WordPressのローカル環境を作る。

    2022 12/19
    Web系プログラミング
    2021-10-072022-12-19

    この記事では「Local」というソフトを使い、WordPressサイトをローカルPC上で動かす環境を作成していきます。

    この記事はこんな方におすすめ
    • WordPressで本格的にテーマ制作、カスタマイズをしたい方
    • 今のWordPressサイトをリニューアルするために、本番サイトのコピーをテスト環境に作りたい方
    目次

    ローカル環境とは?

    ローカル環境とは、PC内にWebサイトの置き場をつくること。

    ふだん私たちがみているWebページは、インターネット上のスペースに、文章や画像などのファイルが配置されています。
    全世界に接続されているので、ブラウザからURLを入力すると、誰でもアクセスできる状態になっています。

    本番で見せるサイトをいきなりカスタマイズすると、不具合があって動かなくなったとき、サイトが見れなくなってしまって大変です。

    なので、自分のPC内で試験的なWebサイトを作り、開発、テストしたものを、最終的にインターネット上に公開する流れになります。

    WordPressのローカル環境を作るツールはいくつかあります。
    以前は、MAMPを使ってデータベースを作り、WordPressをインストールしていましたが、最近は数クリックだけで簡単にからのWordPressサイトを作ってくれるLocalを愛用しています。

    ローカルのおすすめポイント
    • 数クリックだけでWordPressサイトのローカル環境がセットアップできる
    • 複数のWordPressサイトを管理できる
    • データベースの内容確認、操作もできる

    LocalをMacにインストール

    まずはMacに、Localをインストールします。

    右上のダウンロードをクリックします。

    プラットフォームをクリックして、名前とメールアドレスを入力して「Get it Now」をクリックすると、ダウンロードが始まります。

    ダウンロードファイルを解凍したら、「Local.app」はApplicationフォルダに入れておきましょう。

    ダウンロードしたソフト「Local.app」を開くとLocalが立ち上がります。

    LocalからWordPressサイトを新規作成する

    続いて、Localを立ち上げたら、WordPressサイトを作成します。

    左下の+ボタンを押す

    左下の「+」ボタン(Add Local Site/ローカルサイトを追加)をクリックします。

    サイトの名前を入力する

    サイトの名前を入力して、「CONTINUE」をクリックします。

    環境設定

    「Preferred」のまま「CONTINUE」をクリックします。

    管理者用のユーザー名、パスワード、アドレスを入力します。

    ここは、ユーザー名とパスワードを入力し「ADD SITE」をクリック。

    メールアドレスはそのままでOK。
    (ローカル環境なので実際のアドレスにメールを送ることはできません。)

    セットアップ完了するまでしばしまちましょう。

    なお、セットアップ中にPCの管理者パスワードを求められることがあります。

    パスワードを入れてOK。


    これでセットアップが完了しました。

    Local設定画面の見方

    wordpressサイトのトップページ/管理画面を開く

    右上のADMINをクリックするとブラウザが開いて管理画面へのログインページが開きます。「OPEN SITE」をクリックするとトップページが開かれます。

    LocalからWordPress管理画面を開く

    WordPressサイトの開始/終了

    左のWordPressサイトリストからサイトを選択し、右上のボタンからSTART SITE(サイトの開始)/STOP SITE(サイトの終了)を切り替えることができます。

    プラグラムファイルの置き場所

    サイト名の下のリンクをクリックすると、インストールディレクトリが開かれて、WordPressソフトのファイル、テーマ、プラグインなどが確認できます。

    Localのファイルの置き場所

    データベース

    サイトが開始されている状態で、DATABASEタブの「OPEN ADMINER」をクリックすると、ブラウザが立ち上がりデータベースの操作画面が開かれます。

    Localのデータベース

    ここから、データベースを操作することができます。

    管理画面のログイン情報を忘れてしまったとき、データベースからパスワード再設定するのに使ったりします。

    MAILHOG:メールの受信ボックス

    ToolsタブからOPEN MAILHOGを開くとブラウザが立ち上がり、メールボックス画面になります。

    お問い合わせフォームからの自動返信メールなどの送信機能が動作すると、このメールボックス内にメールが表示されるので、文面確認などに使ったりします。(実際のメールアドレス宛には届きません)

    サイトを削除するには

    サイトのリストを右クリックし、サブメニューから「Delete」を選ぶと、サイトを削除することができます。

    本番環境のサイトをテスト環境にコピーするには

    これで、新たにWordPressのサイトができましたので、あとは管理画面から設定をしたり、テーマファイルなどを更新してカスタマイズをしていくことができます。

    すでに運用しているHPと同じ環境をローカル環境に作りたい場合には、All-in-One WP Migrationというプラグインを使うと、サイトのコピーが簡単にできます。

    あわせて読みたい
    簡単にWordPressサイトをコピーする方法【All-in-One WP Migration】 WordPressサイトをコピーして、別ドメインに引っ越したい!簡単なやり方はないかな? 現在運営中のWordPressサイトをリニューアルしたい!本番サイトはそのままで、テス…

    トラブルシューティング:管理画面のユーザー名、パスワードを忘れてしまったら?

    開発環境上で管理画面へのユーザー名、パスワードを忘れてしまったときの対応方法です。
    登録したメールアドレスにメール送信→パスワード再設定ができないので、データベースから変更する必要があります。

    STEP
    データベースを開く
    STEP
    wp_usersを開く
    STEP
    テーブルのデータを選ぶ
    STEP
    ユーザーデータを編集

    user_loginのところにユーザー名、user_passのところにpasswardを入れます。パスワードは暗号化のため、md5という関数を左のプルダウンから選択します。

    入力したら保存を押します。

    これで、新しく入力したユーザー名とパスワードで管理画面にログインできます。

    Web系プログラミング
    開発環境 WordPress おすすめツール
    よかったらシェアしてね!
    中谷恵美
    あなたのお仕事を育てるホームページの先生
    システムエンジニア、ITコンサルタントを経て、フリーランスに。

    ・ホームページ作成
    ・ブログのカスタマイズ
    ・LINEやメルマガのセットアップ
    ・Canvaを使ったデザインの作り方
    ・Googleの分析ツール
    ・自分の強みを生かした集客
    などの、個人レッスンをしています。

    「仕事の発信に使えるようになりたい」
    「自分でも使えるスキルを身につけたい」
    ITが苦手な個人事業主さんに向けて、困ったときのWEB担当として幅広くサポートしています。

    HP作成のほかにも、心理カウンセラーとしても活動中。

    趣味は、文房具集め、ゲーム(牧場系とモンハン)、手芸(刺繍、洋裁)。
    運動が苦手で体が硬いのが悩み。今年、腰痛改善にジムに通い始めたが、果たして続くのか。。。
    詳しいプロフィールを見る
    活動実績

    【HP個人レッスン】

    ●ハワイアン伝統ロミロミサロン・Aさま
    ・2ヶ月でサロンのHPをリニューアル。新サービス立上げ時も自分でHPを作成できるように。
    「最初はパソコン音痴の私にできるか不安でしたが、とても丁寧な指導でわかりやすかったです。
    私好みの素敵なHPができあがり、とっても嬉しいです!」

    ●Mさま
    ・2回のミーティングでWordPress運営スキルを習得。オウンメディアを立上げ。

    ●Sさま
    ・5日間で無料ブログからWordPressへのお引越し。
    「半ば諦めかけていた移管を短期間で終えることが出来ました」

    【ホームページ作成】

    ●これまでご依頼いただいたお客さま
    (個人)写真家・美容サロン・弁護士・デザイナー・心理カウンセラー・占い師

    (法人)メーカー代理販売店、コンサルティング企業、人事支援企業

    【経歴・資格など】
    ・基本情報技術者
    ・簿記2級

    【営業時間】平日:10:00~19:00
    【休業日】土、日、祝、年末年始

    新着記事
    • 【お客様の声】ゴールが明確になり、とても安心できました
      2025-03-13
      Web・SNS集客
    • 【お客様の声】WordPressには自由度の高さを感じます
      2025-01-21
      ホームページ個別レッスン
    • WordPressに記事を一括アップロードするには
      2024-12-05
      はじめてのWordPress
    • 【お客様の声】等身大のちょっと先を提案してもらえた
      2024-03-08
      ホームページ個別レッスン
    • 【お客様の声】寄り添ってもらえたっていうのが一番心強かった
      2023-07-21
      ホームページ個別レッスン
    人気記事
    • 【CSSコピペOK】おしゃれな引用blockquoteデザイン10選
      2018-09-13
      WordPressプログラミング
    • 【Mac】SourcetreeからGitHubへSSH接続する
      2021-08-05
      Web系プログラミング
    • 【CSS】シンプルで女性らしい囲み枠デザイン48選
      2018-08-24
      アメブロカスタマイズ
    • 自分でできる。アメブロのおしゃれなカスタマイズまとめ
      2022-11-04
      アメブロカスタマイズ
    • Node.js+ExpressでMySQLに接続して一覧表示する
      2020-04-25
      Web系プログラミング
    目次