WordPress

【外出自粛中オススメ】サイト作りの始め方・WordPressの環境構築 for Mac

初めまして、だーやまです。
今回の記事ではWordPress(ワードプレス)の環境構築について紹介していきます。

WordPress?環境構築ってどうやるの?そんな人にも分かりやすく、すぐサイト作りが始められる段階まで紹介していきます。

外出自粛中の新たな趣味として、自分好みのオリジナルサイトを作ってみませんか?

そもそもWordPressとは?

WordPressとは無料で使えるCMS (Contents Management System)です。
CMSとはプログラミングの知識が無くてもwebサイトやコンテンツを構築、管理、更新できるシステムのことです。

「自分でサイトを作るなんて聞いただけでも難しそうで手が出ない」
「自分らしさが出たブログを作りたいけど、難しい単語や知識を覚えたくない!」
といった方にこそオススメなのがWordPressです。

オススメできるメリットは開発、運用が楽なところです。
1から開発や運用をするには、データベースの取り扱いやその知識、どんなサイトを作るかの組み立てやデザイン作成などの時間も必要です。

しかし、WordPressをはじめとしたCMSならブログ機能など様々な機能が標準搭載されています。
そのため、多くの知識を事前に勉強したり人を集めたりすることなく、少人数でも1人ででも開発できます!

「そんな簡単に出来てしまってセキュリティは安全なの?」
「1人で開発していて分からないことがあったらどうしよう」
もちろんメリットばかりではなくデメリットもありますが
デメリットもカバー出来るのがWordPressです。

WordPressは世界中のWebサイトのうち約37%と、圧倒的なシェア率を保っています。

CMSのシェア率を表した円グラフの画像

下記サイトより情報を参照。
2020年8月5日現在

w3techs.com

分からないことがあったら検索してみましょう!
シェア率が高い=利用者数が多いので、解決策を教えてくれる人が多いです。
また、セキュリティ面に関してもしっかり対策すれば安全に使用できます。

WordPressの環境構築をしてみよう

WindowsもMacも同様の手順で環境構築出来ます。
筆者はMacを使用しているため画像はMacの画面のものとなります。
ご了承ください。

仮想サーバーを準備しよう

まずはサーバーが必要になります。
サーバーとはホームページに表示する内容を置いておくためのものです。

WordPressを使用するために、下記の2つが使えるサーバーを探してみましょう。
・Apache(アパッチ) : Webサーバーソフトウェアのこと
・MySQL(マイエスキューエル) : データベース管理システムのこと

この記事ではMAMP(マンプ)を使用してサーバーの準備をします。
5つに分けて説明していきます。

1.MAMPをダウンロードする

 検索から移動した方はページトップの「Free Download」をクリックしてください。
こちらのURL (https://www.mamp.info/en/downloads/)を入力して移動した方は対応OSをクリックしてダウンロードしましょう。

MAMPのダウンロードページのスクリーンショット

2.MAMPをインストールする

 インストーラーを起動し、手順に沿ってインストールします。
利用規約を承諾し、場合によってはPCのユーザー名とパスワードを入力し進めてください。
「インストールが完了しました。」と表示されたらインストーラーを閉じ
MAMPを起動させましょう。

◆ポイント◆
青色の像アイコンと灰色の像アイコンがあります。灰色のアイコンの方を起動させましょう!

MAMPのアイコン画像

3.MAMPを起動して設定をする

MAMPのトップページのスクリーンショット

起動するとこのような画面が出てきます。
それではMAMPの設定をしていきましょう。上部のメニューバーの「MAMP」から「Preferences」を選択します。

「Port」タブに切り替え「Set Web & MySQL ports to 80 & 3306」をクリックします。
下記の画像のようにApache PortとNginx Portの数値が共に80に、My SQL Portが3306になっていたらOKで進みます。

MAMPアプリのポート番号設定画面

4.仮想サーバーを起動する

 MAMPを起動した時と同じ画面になったら「Start Server」を押します。場合によってはPCのユーザー名とパスワードを求められるので、入力して進めます。

仮想サーバーを起動すると自動的にブラウザが開き、STARTページが開きます。「Welcome to MAMP」と中央に大きく書かれたページです。

もし開かなかったら「Start Server」の左隣にある「Open Web Startpage」を押すと開きますよ。

MAMPのスタートページのスクリーンショット

5.データベースを作成する

 英語だらけだと作業しづらい方はデータベースを作成する前に言語設定をしてみましょう!

STARTページの左上「TOOLS」から「PHPMYADMIN」を開きます。「Appearance settings」の「Language」を日本語に設定すると、わかりやすくなったのではないでしょうか。

その後、言語設定をした箇所の上部にある「データベース」タブをクリックしてデータベースを作成します。

MAMPにWordPressのデータベースを設定する画面のスクリーンショット

・データベース名 : 任意のもの (画像では「test」という名前にしました)
・照合順序 : utf8_general_ci (デフォルトでこちらになっています)

これらを入力、選択し「作成」を押します。仮想サーバーの準備は完了です!

仮想サーバーにWordPressを入れよう

仮想サーバーが準備出来たらWordPressを入れましょう。サイト作りを始められるまであと3工程です!

1.WordPressをダウンロードする

 こちらのURL(https://ja.wordpress.org/)からサイトへ移動します。右上の「WordPressを入手」をクリックし、WordPressをダウンロードするボタンをクリックします。

WordPressのダウンロード画面のスクリーンショット

2.WordPressのファイルを解凍し移動する

 ダウンロードしたzipファイルを解凍し「htdocs」というディレクトリの中に移動しましょう。
「htdocs」は右記アイコンのMAMPの中にあります。

MAMPのアイコン画像

探しやすくするために、ダウンロードしたWordPressのディレクトリ名は任意のものに変更してから移動するのがおすすめです。

ファイルを移動したらMAMPのSTARTページ内、左上の「MY WEBSITE」を押します。

MAMPのスタートページのMy WEBSITEの位置を示したスクリーンショット

すると先ほどのWordPressのディレクトリ名が表示されます。(下記の画像のように左上に表示されています)

WordPressを開いた時のスクリーンショット

3.WordPressの設定をする

 ついに環境構築の最終段階です!2の工程で表示されたディレクトリ名をクリックしWordPressの設定を設定します。

  • データベース名
  • ユーザー名
  • パスワード

これらを入力し送信します。
ホスト名とテーブル接続辞は変更しなくても進められますよ。
インストールを実行し、サイトの運営者の情報を設定します。

  • サイトのタイトル
  • ユーザー名
  • パスワード
  • メールアドレス

これらの情報を設定します。設定後はログイン画面です。
ログインが出来たら環境構築は終了です!
お疲れ様でした。自分好みのサイト作りを楽しんでください!

WordPressの固定ページのスクリーンショット

まとめ

WordPressとはどんなものなのか、なぜおすすめ出来るのか
また、始めたいときはどのように環境構築するのかについて紹介しました。

「今までの夏とは違う休日の過ごし方を見つけたい」
「外出自粛中に観た映画のおすすめブログをおしゃれに作ってみたい」
といった方々が気軽に挑戦できるきっかけになればと思います。

最後までお付き合いいただきありがとうございました。

作者情報

かつては船通勤なんてこともしていた、IT業界未経験者。
フットワークが軽く、趣味のためならどこへでも行けてしまうが
現在自粛中。