🧠 概要：
概要
この記事は、初心者向けにWordPressを導入し、開発環境を構築する方法を詳しく解説しています。特に、技術的な用語を懇切丁寧に説明し、初心者がつまずきやすいポイントを意識して書かれています。開発環境には「XAMPP」が推奨され、このツールを利用することで、自分のPC上に仮想サーバーを立ち上げることができます。
要約の箇条書き
-
WordPress概説: サイト制作ツールであり、テーマやプラグインが豊富。
-
サーバーの必要性: WordPressを公開するにはサーバーが必須だが、契約すればコストが発生。
-
XAMPPの利用: 開発段階でサーバーの代わりとしてXAMPPを使用。ローカル環境での開発が可能。
-
XAMPPのダウンロードと起動:
- 公式サイトからダウンロードし、デスクトップにショートカットを作成。
- コントロールパネルで「Apache」と「MySQL」を起動。
-
データベースの作成: phpMyAdminを使用して新規データベースを作成。
-
WordPressのインストール:
- WordPressのzipファイルをダウンロード、解凍後に所定のフォルダに配置。
- インストール時にデータベース情報を入力。
-
ユーザー登録: インストール後、ユーザー情報を登録し、ログイン情報を保存。
-
管理画面の表示: WordPressの管理画面にアクセスできるようになり、本格的に制作が開始できる。
-
用語一覧: サーバー、開発環境、本番環境、XAMPP、phpMyAdmin、Apache、MySQLの説明。
- 次回予告: 次の記事ではWordPressの基本機能や注意点について触れる予定。
WordPressとは？
WordPressは、豊富なテーマやテンプレート、プラグインがあるサイト制作ツールです！コードを書いて完全オリジナルのページを作ることもできます。
開発にはサーバーが必要
WordPressは、サーバー（サイトを置く場所）がないと開くことができません。しかし、サーバーを契約すると、制作段階から継続的に費用がかかります。（完成にかかる時間も分からないのにランニングコストがかかるのはちょっと…ですよね）
開発環境を用意する
そこで、開発段階でサーバーの代わりになるのが「XAMPP」です。自分のパソコンで仮想のWebサーバーを立ち上げるツールで、投稿やユーザー情報などのデータを保存するデータベースや、Webページの表示など、本番のサーバーのような機能が備わっています。（MacユーザーはLocalやMAMPなど、他の選択肢もあります）自分のパソコン内の開発用サーバー（＝開発環境）で制作したコードやデータベースは、本番のサーバー（＝本番環境）にほとんどそのまま持って行くことができます。
XAMPPをダウンロード
公式サイト(https://www.apachefriends.org/jp/download.html)からXAMPPをダウンロードしましょう。コントロールパネルは毎回使うのでショートカットをデスクトップに置きましょう。
XAMPPを起動
ダウンロードが完了したら、XAMPPコントロールパネルを起動します。起動すると小さいウィンドウが開くので、上の2つのボタン
「Apache」と「MySQL」
を押しましょう。ログにrunningと表示されればOKです（ボタンが緑になります）。
「Apache」はWebサーバー
「MySQL」はデータベース
という認識でOKです。毎回XAMPPの立ち上げを行ってから作業に入ります。（よく忘れます）
データベースを新規作成する
立ち上げが終わったら、簡単にデータベースを作ります。まずは以下のURLにアクセスしましょう。
http://localhost/phpmyadmin/
phpMyadminはデータベース管理、作成できるツールで、XAMPPに付いてきます。これもショートカットを追加しておくと便利です。URLにアクセスしたら、データベースの新規作成からデータベースを作ります。入力の内容は以下の通りです。
データベース名:（プロジェクト名）_db など
なんでもOKです。「_db」としておくとデータベース感あります。
照合順序：utf8mb4_general_ci (推奨)
こうしておくと、日本語、絵文字を含むあらゆる文字を扱えます。また、大文字小文字を区別しないので、検索フォームなどにもいい感じに効きます。
WordPressをダウンロード&インストール
次は公式サイトからWordPressのzipファイルをダウンロードしましょう。zipファイルを解凍するとwordpressというフォルダが出てきます。このフォルダを置く場所は
C:xampphtdocswordpress
つまり、「PC▶︎xampp▶︎htdocs」の中です。※htdocsの直下に置けば、wordpressという名前でなくてもOKです（プロジェクト名にするなど）。フォルダを配置したら、
http://localhost/wordpress/
もしくは、wordpressフォルダの名前をプロジェクト名（A-project）に変更した場合、
http://localhost/A-project/
にアクセスしましょう。作業は毎回ここで行うので、ショートカットをデスクトップに追加しておくといいと思います。URLにアクセスすると、「WordPressへようこそ」という文章が出ます。言語などを適切に選んでいただいて、データベース情報を以下のように入力してください。
データベース名:phpMyadminで決めた名前「(プロジェクト名)_db」など
さっきデータベースを作った時につけた名前です。例通りなら
ユーザー名:root（デフォルトの場合）
特にMySQLで名前を設定していない場合、XAMPPのデフォルトのユーザー名「root」になります。設定した覚えがない人は「root」と入力しましょう。
パスワード:（空欄）
パスワードはローカル環境では必要ありませんが、MySQLで設定した場合は、そのパスワードを書きましょう。本番移行時は、必ずパスワードを設定しましょう。
ホスト名:localhost
開発環境では、localhostにします。本番環境で、データベースだけ他のサーバーにある場合は、「ローカルがホスト」ではなくなります(その場合はマニュアルに書いてあると思います)が、本番環境でもlocalhostである場合が多いです。
テーブル接頭字:(Example)_など
ハッカーは「wp_」である前提で攻撃してくることが多いため、変更した方がセキュリティ的には良いです。(Example)は例です。プロジェクト名に合わせましょう。
これらの情報はwp-config.phpに記載されます。後に変更したい場合は、このコードから変更できます。
データベース情報の入力が終わると、WordPressのインストールが始まります。
WordPressのユーザー登録
WordPressのインストール後、ユーザー情報を登録します。
作業開始毎にログインの必要があるので、パスワードとユーザー名は必ずメモしておいてください。
WordPressの管理画面が現れる！
ここまできて、やっとWordPressの管理画面が表示されます。はい、これ明らかに、
初見では無理！
普通のソフトと違ってダウンロード後インストールしてすぐ使える訳ではないので、相当頑張らないと辿り着けませんよね…。ここからは晴れてサイト制作に入れるわけです。次の記事では今回の記事の続きでもある、WordPressの簡単な機能の説明、注意点などを説明したいと思います。
お疲れ様でした！
用語一覧
・サーバー：サイトを載せる場所・開発環境：自分のパソコン上など(＝ローカル環境)、仮想サーバーなど・本番環境：実際にサイトを公開するサーバーなど・XAMPP：今回使った開発環境をつくるソフト・phpMyadmin：データベースを操作するWebツール・Apache：Webサーバーソフト
・MySQL：データベースそのもの
Views: 2
