WordPressの開発はどうすればいい?準備から開発方法まで解説

WordPressを操作する男性

WordPressとは、端的にいえばWebサイトの作成や管理の用途に使用されるツールです。
世界的に普及しており、ビジネスで使用されるケースも少なくありません。中には、「WordPressの開発って大変そう」「エンジニアじゃないと作れないのでは?」など、悩む方も多いのではないでしょうか。しかしWordPressは、ポイントさえ理解できれば、簡単に開発へ活用可能です。この記事ではWordPressの開発でできることや、WordPressの開発環境を構築する方法などについて解説します。

 

目次

 

ホームページ制作会社選びはプロにお任せ完全無料で全国5000社以上からご提案

即戦力のシステム開発会社を探すなら「発注ナビ」

・ベストマッチな発注先が見つかる
・たった1日のスピード紹介
・ITに詳しいコンシェルジュがサポート
・ご相談~ご紹介まで完全無料

 

 

WordPressの開発でできること

Webサイトを構築しようとした場合、HTMLやCSSなどさまざまな知識が必要です。しかしWordPressの開発には、そのような知識は必要ありません。自作テンプレートを作れる、自作テーマを作成できるなど、自由度が高いのがメリットです。以下では、「WordPressの開発でできること」の具体的に見ていきましょう。

 

●自作テンプレートが作成できる(会社の情報、ロゴ、サイズ 等)

WordPressには、デザインテンプレートの「テーマ」があります。WordPressのテーマは、無料のものと有料のものがあり、自由に変更可能です。そのため、画像にロゴを使う、サイズを変更する、テキスト部分に企業情報を入れるなど、自由にデザインできることが人気の秘密です。

 

●自作テーマが作成できる

WordPressでは、オリジナルのテーマを作成できます。もともとWordPressにあるテーマには、必要のない機能も混じっているため、読み込みに時間がかかることもあります。しかしそのような機能を外したオリジナルテーマを作ることで、表示が速くなるのがメリットです。また、テーマを作成する場合、PHPの知識が必要です。ただし、エンジニアのような知識は必要ありません。PHPの基礎知識と仕組みを知ってさえいれば、定型コードのコピー&ペーストなどでテーマを作成できます。

 

●自作プラグインが作成できる

プラグインとは、WordPressの拡張機能のことをいいます。WordPressには標準機能がありますが、プラグインをダウンロードすることで、便利な機能を追加できます。例えば、以下のようなあらゆるプラグインが存在します。

  • サイトマップ表示のためのプラグイン

  • お問い合わせフォーム設置のためのプラグイン

  • 吹き出しを表示できるプラグイン

  • スパム投稿の防止ができるプラグイン

便利なプラグイン機能ですが、既存のプラグインでは使い勝手が悪いこともあるでしょう。自作のプラグインを作成すると、そのような悩みも解決可能です。PHPの開発経験やHTML・CSSの知識がある人なら、自作のプラグインを作成できるでしょう。

 

WordPressの開発をする時に気を付けたいポイント

WordPressを開発する時、どんなことに気を付けたら良いのでしょうか。ここでは、WordPressの開発における主な注意点を解説します。

 

●WordPressの基本構造を理解しておく

WordPressの開発は、基本構造を理解する必要があります。まずは、テーマがどのような構造になっているのか見ていきましょう。WordPressのテーマは、「/wp-content/themes/」の中に入っており、テーマの構成ファイルは下記のようになっています。

構成ファイル 概要
index.php ブログなどWordPressで作成したページの表示に使用されるページです。
header.php ページの上部を構成するファイルです。会社のロゴマークなどが設置されている部分です。
footer.php ページの下部を構成するファイルです。copyrightや会社の住所などを表示します。
page.php page.phpは固定ページとして表示されます。SEOを意識したページを作る場合、便利なページです。
single.php single.phpは投稿ページを表示します。
archive.php カテゴリーページなど、記事のリストを表示します。
sidebar.php 2カラムや3カラムなどのページでサイドバーを表示します。
404.php 存在しないページにユーザーが飛んだ時に表示します。
style.css ページのデザインを定義するファイルです。色や幅などデザインに関することが記述されています。
function.php 機能に関するファイルです。ウィジェットの追加、メニューの表示場所の設定などができます。

 

●WordPress開発の全体像を知る

WordPressの開発の基本構造がわかったら、次は全体像を知りましょう。WordPressのファイル構成は、以下のようになっています。開発をする場合、必ずバックアップを取るのをおすすめします。万が一ファイルが壊れるとサイトが表示されなくなるため、注意が必要です。

構成ファイル 概要
wp-admin 管理画面を構成するフォルダです。
wp-content テーマやプラグインが入ったフォルダです。自作のテーマやプラグイン作成の場合、このフォルダを使います。
wp-includes システムに関するフォルダです。
wp-config.php 設定情報に関する重要なファイルです。
index.php ユーザーがサイトにアクセスした時、読み込まれるファイルです。
wp-login.php ユーザー登録、認証などログインに関するファイルです。
wp-load.php 関数など動作に必要なプログラムを読み込むファイルです。
.htaccess アクセス制御に関するファイルです。

 

●WordPress開発の環境を構築する

パソコンでWordPressの環境を構築する場合、ローカル環境を設定します。すでに動いているサイトで構築した場合、失敗するとサイトが閲覧できなくなるなどのリスクがあるからです。ローカル環境下で開発することにより、初心者の方でも安心して開発できます。ローカル環境下では、何度でもテスト可能です。テストで問題なければ本番環境に移行しましょう。なお、WordPressの基本的な使い方については、以下のページでも解説しています。WordPressの基本構造について知りたい方は、別ページをご覧ください。

WordPressとは?基本的な使い方から導入するメリットなどを詳しく紹介

 

WordPressの開発環境を構築するには

WordPressを使った開発を検討している方に向けて、WordPress(日本語版)の開発環境を構築する手順を解説します。ローカル開発環境を構築するためには、「XAMPP」をインストールする必要があります。ここでいうローカル環境開発とは、自分のパソコン上でのみ動作するWebサイトの仮想環境のことです。ローカル環境は、インターネットに接続していない状態でも作業できる、本番環境を気にせず何度でも検証できる、サーバなしでサイト構築できるなどのメリットがあります。

XAMPP は、Webサイトの動作に必要なツールを一括してパソコン上に導入できる無料のソフトウェアのことです。このXAMPPは、以下の要素で構成されています。

  • X:クロスプラットフォーム

  • A:Apache(アパッチ)

  • M:MySQL(マイ・エスキューエル)

  • P:PHP

  • P:Perl

XAMPPの名前の由来は、5つの言葉の頭文字です。Apacheとは、最も普及しているWebサーバであり、MySQLはオープンソースのリレーショナルデータベース管理システムです。PHPとPerlはプログラミング言語のことを指します。XAMPPを使った、ローカル環境の作り方について解説します。

 

●XAMPPを公式サイトからインストールする

まずは、XAMPPを公式サイトからインストールしましょう。以下の手順でXAMPPをインストールし、コントロールパネルの準備をします。

  1. 「ダウンロード」の場所から該当するXAMPPを選び、インストーラーをダウンロードする
  2. OSのバージョンは「Windows」「Linux」「Mac」の3種類から使用しているパソコンに合うものを選ぶ
  3. XAMPPをインストールする
  4. インストーラーに従って作業していき、完了させる
  5. 「C:¥xampp¥xampp-control.exe」からXAMPPのコントロールパネルを開く
  6. ApacheとMySQLを起動する

この手順で、XAMPPのインストールは完了です。

 

●WordPressをインストールする

続いて、WordPress日本語版を公式サイトからインストールしましょう。以下の手順でWordPressをインストールし、XAMPP内に設置します。

  1. 公式サイトの「WordPressをダウンロード」のボタンをクリックしてZIPファイルをダウンロード
  2. ZIPファイルをPC上で解凍する
  3. 取得したWordPressのフォルダを、XAMPP内の「htdocs」フォルダ配下に移動(C:¥xampp¥htdocs¥wordpress)
  4. 設置したWordPressフォルダのパスを控えておく(Webサーバの設置で必要なため)

 

●Webサーバを設定する

「Apache」の設定ファイルを変更すると、ブラウザからWordPressにアクセスできるようになります。以下の手順でWebサーバを設置します。

1. XAMPPのコントロールパネルからConfigボタンを押して「Apache(httpd.conf)」をクリック

2. Apacheの設定ファイルを開き、ファイルの末尾に下記の設定内容を追加

# wordpress
Listen 50000

ServerName localhost:50000
DocumentRoot “C:xampp¥htdocs¥wordpress”
<Directory “C:¥xampp¥htdocs¥wordpress”>
Options Indexes FollowSymLinks Includes ExecCGI
AllowOverride All
Require all granted

※複数のWordPressサイトを設置する場合、ポート番号「localhost:50000」の番号をずらす(例:50001)

3.ファイルを保存し、Apacheを再起動する

4.WordPressにアクセスできるかブラウザで確認(ブラウザのURLは http://localhost:50000/)

5.WordPressのインストール画面が出たら設定が正しいことを確認

 

●WordPressにアクセスし、データベースを作成する

WordPressにアクセスし、データベースを作成します。データベースとは、コンピュータ上に集積された情報のことです。WordPressでは、「MySQL」を使用します。以下の手順でデータベースを準備します。

  1. XAMPPのコントロールパネル、MySQLの欄にある「Admin」をクリックする
  2. MySQLの管理ツールである「phpAdmin」の画面が表示される
  3. 画面左の「新規作成」をクリックする
  4. データベース名を任意名「wordpress」とし、右側は「utf8_gereral_ci」を選び、作成ボタンを押すと完了
  5. MySQL上に新しいデータベースが作成されたことがphpAdminの画面より確認できる

 

●インストール作業を完了させる

「http://localhost:50000/」を開き、以下の手順でインストール作業を進めます。

  1. 「さあ、始めましょう」をクリックする
  2. 作成したデータベース情報より「データベース名」「ユーザー名」「パスワード」「データベースのホスト名」を入力し送信
  3. 「インストール実行」をクリックする
  4. 「サイトのタイトル」「ユーザー名」「パスワード」「メールアドレス」を入力する
  5. 「WordPressをインストール」をクリックする
  6. 「ログイン」をクリックし、「ユーザー名」「パスワード」を入力後、「ログイン」をクリックする

 

WordPressの開発例「自作テーマの作り方」

WordPressでは、自作テーマを作成できます。ここから自作テーマの作り方について解説します。

 

●作成に必要なWordPressのテーマファイルを決める

テーマは上述のようにindex.php、header.php、footer.php などから構成されています。

まず、WordPressの/wp-content/themes/の配下に自作用のフォルダを作成しましょう。フォルダ名は英数表記で作成します。次にフォルダの中にindex.phpとstyle.cssを作成しましょう。続けてstyle.cssの1行目に下記の内容を入れます。style.cssにコメントヘッダーを入れないとテーマとして認識されません。style.cssにコメントヘッダーを入れると、WordPressの管理画面から認識できるようになります。

/*
Theme Name: Sample WordPress Theme
Theme URI: テーマのURLを記入
Author: テーマの作者(組織名)を記入
Author URI: テーマの作者のURLを記入
Description: テーマの説明文を記入
Version: 1.0
*/

 

●入力項目に沿って作成する

必要なphpファイルを作成し、テーマフォルダに入れることで自作のテーマを作成できます。

例としてindex.phpの作成方法の手順をご紹介します。

  1. あらかじめindex.htmlを作成
  2. WordPress内の自作のテーマ内(/wp-content/themes/<自作テーマ名>)のindex.phpに貼り付ける
  3. 貼り付けたindex.phpの中に<script></script>タグがある場合削除
  4. WordPressの/wp-content/themes/<自作テーマ名>の配下にheader.phpとfooter.phpを置く
  5. index.phpのヘッダー部分をheader.phpにカット&ペーストする
  6. index.phpのフッター部分をfooter.phpにカット&ペーストする
  7. index.phpのヘッダーがあった部分に<?php wp_header();?>のコードを追加する
  8. フッター部分には<?php wp_header();?>のコードを追加する

 

●作成したファイルをftp上でアップロードする

作成したテーマは、ftpソフトで/wp-content/themes/へアップロードします。

 

●オリジナルテーマを有効にする

自作のテーマを有効化することで外観を変えることができます。下記の手順でテーマを有効化しましょう。

  1. WordPressの管理画面に入る
  2. サイドバーの「外観」から「テーマ」をクリックする
  3. 自作テーマが出てきたら「有効化」をクリックする
  4. トップページにアクセスし、自作のテーマになっているか確認する

 

テーマ作りのポイント

ここからはテーマ作りを成功させるポイントを見ていきます。

 

●作成するテーマファイルの意味を理解する

自作テーマを成功させるには作成するテーマファイルの意味を理解することが必要です。「header.phpはヘッダーのこと」「index.phpは内容のこと」などそれぞれのファイルがどのような働きをするのか知ることが大事でしょう。意味を理解することで変更もスムーズになります。

 

●カスタマイズができるようにしておく

WordPressのテーマ制作のポイントはカスタマイズです。自作のテーマであれば、余分な機能を外し、読み込みの速いサイトを作れます。WordPressを自作することで、理解も深まり、自由に好みのデザインや機能を持ったサイトを作れるようになるでしょう。

 

早急にWordPressの開発をしたいなら外注も視野に

WordPressは自作でテーマを作ることが可能です。HTML、CSS、PHPの知識があれば自社で作ることも可能でしょう。しかし、対外的にアピールできるような魅力的なサイトにするには、プロの力を借りることも必要です。「WordPressの開発についての知識がないけど、すぐ開発したい」「Webサイトをすぐにグレードアップしたい」という方は、システム開発会社に依頼することをおすすめします。

外注するメリットについては、以下のページでご紹介しています。

Webシステムは内製か外注か?メリット・デメリットを理解し比較検討しよう!

また、外注先がなかなか絞れない、選ぶのが難しいという方に向けて、以下のページではおすすめの開発会社をご紹介しています。いずれも、WordPressの扱いに長けたシステム開発会社なので、企業の希望に見合ったサイト制作を行ってくれます。

 

ホームページ制作会社選びはプロにお任せ完全無料で全国5000社以上からご提案

即戦力のシステム開発会社を探すなら「発注ナビ」

・ベストマッチな発注先が見つかる
・たった1日のスピード紹介
・ITに詳しいコンシェルジュがサポート
・ご相談~ご紹介まで完全無料

 

 

■ホームページ制作に関連した記事

 

即戦力のシステム開発会社を探すなら「発注ナビ」

希望ぴったりの外注先がラクして見つかる
soudan_banner

人気記事

関連記事

関連特集

offer_banner
即戦力のシステム開発会社を探すなら発注ナビロゴ
発注ナビは、システム開発に特化した
発注先選定支援サービスです。
紹介実績
19000
対応社数
5000
対応
テクノロジー
319
紹介達成数
92%
システム開発の発注先探しで
こんなお悩みありませんか?
checkbox
なかなかいい外注業者
見つからない。
checkbox
ITの知識がなくて
発注内容をまとめられない。
checkbox
忙しくて外注業者を探す
時間がない
悩んでいる人物
発注ナビの主な特徴
IT案件に特化
IT案件に特化
日本最大級5000社以上のシステム開発・WEB制作会社が登録。IT専門だから細かい要望が伝わり、理想的なパートナーが見つかる。
ITへの不安を徹底サポート
ITへの不安を徹底サポート
専門コンシェルジュがしっかりヒアリングするので、IT知識に不安があっても、まだ要件が固まっていなくても大丈夫。
完全無料・最短翌日紹介
完全無料・最短翌日紹介
コンシェルジュに発注内容を話すだけで最短翌日に開発会社をご紹介。しかも完全無料・成約手数料も無し。
さらに
東証プライム上場
「アイティメディア株式会社」
グループが運営
ご相談内容は一般公開しないため、クローズド案件でも安心。
ご紹介企業は第三者調査機関にて信用情報・事業継続性を確認済です。

発注先探しの
ご相談フォーム

発注ナビは貴社の発注先探しを
徹底的にサポートします。
お気軽にご相談下さい。
必須
必須
必須
■必要な機能・課題■ご予算■スケジュールなど
■企画書やRFPの添付が可能です(10MBまで)

お問い合わせには、
発注ナビ 利用規約  及び 個人情報の取扱い  への
同意が必要です。