HTMLコーディング

【WordPressでGO!】WordPressをローカル環境へインストールしてみよう

あけましておめでとうございます。
今年もよろしくお願いいたします。
2018年一発目の記事は、WordPressです(≧▽≦)

WordPressをローカル環境へインストールしてみましょう~!
あ、EC-CUBE3をローカル環境へインストールしてみようの時と同じで、xampp環境があることが前提となります。

WordPressをダウンロード

やはり、まずは最新のWordPressを一式ダウンロードしてきましょう。

WordPress公式サイト

インストールフォルダを用意

xamppの中にWordPressをインストールするためのフォルダを用意しましょう。

C:\xampp\htdocs

だいたい、上のようなパスになっていると思いますが、htdocsの下にwpとか適当な名前をつけてフォルダを作成します。

この辺のネーミングセンスが問われますが、好きな名前で大丈夫(/・ω・)/

データベースを用意

WordPress用のテータベースを用意します。
xamppなら以下のアドレスでphpMyAdminページが開くはずなので、そこでログインします。

localhost/phpmyadmin/

rootでログインです。
間違えないようにっ(`・ω・´)

phpMyAdminにログインしたら、WordPress用のデータベースの箱を作ります。
今回の設定はこちら。

データベース名:wp_test_db
データベースパスワード:wp_test_db_pass
データベースユーザーネーム:wp_test_admin

※あくまでテストなのでパスワードは簡単です。が、本番ではきちんと複雑なもの付けておきましょうね(=゚ω゚)ノ

phpMyAdminでデータベースを作ります。
上部のメニューからデータベースを選んだら、任意のデータベース名(今回はwp_test_db)を入力します。

毎度のことですが、データベースのタイプはutf8_general_ciです。
お間違いなきよう・・・_(:3 」∠)_

個別のデータベース専用ユーザーを作成

というわけで、wp_test_db専用のユーザーを作成します。

個別のデータベース専用ユーザーを作成 Add user accountから
メニューの「データベース:」の後ろがwp_test_dbになっていることを確認して、「Add user account」をクリック。

個別のデータベース専用ユーザーを作成 詳細設定
「Add user account」画面で、設定を入力しましょう。

User name:wp_test_admin
Host name:localhost ←プルダウンで「ローカル」を選択すれば自動的に入力されます。
パスワード:wp_test_db_pass

「データベース “wp_test_db” への全ての特権を与える。」のチェックが入ってるかどうかを確認して、いざ「実行」(`・ω・´)

WordPressをインストール

いよいよ本題。
WordPressをインストールしていきましょー!
みなさんよくご存じかなと思います。
基本、手順に沿って進むのみです。

xampp/htdocsの中にwpというディレクトリを作成したので、以下URLにアクセスしてみます。

http://localhost/wp/

そしたら、勝手にWordPressが判断してインストール画面に飛ばしてくれます。
かしこい子|д゚)

WordPressをインストール
特に問題ありませんね。
「さあ、始めましょう!」をクリック。

WordPressをインストール データベース情報もろもろを入力
データベースの名前やパスワードなど、必要な情報を入力します。
赤枠以外はデフォルトです。理由がなければそのままでオッケー(/・ω・)/

WordPressをインストール データベース部分のインストールが完了
これでWordPressからデータベースへ通信可能になりました。
続けてWordPressをインストールします。

WordPressをインストール WordPressログイン情報もろもろ入力
実際に公開するWordPressのブログ名とか、ログイン情報とか、ここで設定します。
「検索エンジンがサイトをインデックスしないようにする」のは、ローカル環境だからですね。
検索エンジンにインデックスされるとまずい時はチェック入れます。

あとは「WordPressをインストール」をクリック。

WordPressをインストール完了
おめでとうございます!
WordPressのインストール完了です(≧▽≦)

まとめ

あとは、ローカル環境で好きなようにWordPressをいじり倒してください(=゚ω゚)ノ
サーバーとか気にしなくても良いので、わりと何でもやりたい放題です。

最近、iPad ProApple Pencilとセットで購入して、その書き味に感激しまくりクリスタでイラストばっかり描いてるともさんでしたー

ピックアップ記事

  1. 【お客様インタビュー】サンキョウプラテック株式会社様

関連記事

  1. HTMLコーディング

    棒グラフをcssで表現してみよう

    何かおいしい日本酒銘柄があれば教えて欲しいと思っている、ともさんです。ちなみに、私のおすすめは「美少年」です。先日の案件で、サイト内に棒グ…

  2. HTMLコーディング

    css3だけで立体的でアニメーション付きのボタンを作ろう

    はじめまして、制作チームキャップの徳永です。今年でテイクフォーも4期目に突入し、そろそろ自社サイトでまじめに記事を書いていみようという事になったの…

  3. HTMLコーディング

    EC-CUBE3で自動返信メールが文字化けし、そしてタイトルが途中で切れたときの対処法

    大阪はすっきりしない天気が続いてロードバイクに乗れずテンション下がりまくりのともさんですこんにちは。さて、前回に引き続き今回もEC-CUBE関…

  4. HTMLコーディング

    EC-CUBE3をローカル環境へインストールしてみよう

    寒い!((((;゚Д゚))))寒すぎてロードバイク諦めかけてるともさんです、こんにちわ。EC-CUBE3のテスト環境を作りたくて、どこに作…

  5. HTMLコーディング

    EC-CUBE3でテンプレート適用後にパスが通らなくなってしまったときの対処法

    こんにちわ、ともさんです。みなさん元気ですかそうですか。さて、この前業務でEC-CUBEを触っていた時にとんでもないことが起こりました。…

  6. HTMLコーディング

    便利すぎるWebフォント「Font Awesome」でサイトの見栄えをワンランクUP!

    今回はWebフォント「Font Awesome」の使い方を紹介します。Font Awesomeとは、Web上でアイコンをフォントとして利用できるW…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

CAPTCHA


最近の記事

  1. レポート

    願い事が叶うと話題の鈴虫寺に行ってきました!
  2. ガジェット

    USB充電器を買ったのでレビュー(その1)
  3. WEB集客

    「Googleトレンド」を使いこなして人気のキーワードと流行を把握しよう
  4. レポート

    手描きの年賀状を作成しましたのでレポートします!
  5. Photoshopで部分的にカラーにしたモノクロ画像を手軽に作る方法

    WEBデザイン

    Photoshopで部分的にカラーにしたモノクロ画像を手軽に作る方法
PAGE TOP