【講座導入】WordPressプラグイン開発で自由自在なカスタマイズを実現する本講座の目的と概要
みなさんこんにちは。
WordPressサイトのカスタマイズ専門家、講師の矢部と申します。
本講座では、約10種類のWordPressプラグインを実際に開発しながら、WordPressサイトのカスタマイズ方法について理解を深めていただける内容となっています。
講座タイトルにも「プログラミングを伴うWordPressサイトのカスタマイズ」という言葉を添えています。
最近では、プログラミングを必要としない「ノーコード」という考え方や、AIのサポートを受ける開発手法が注目を集めています。
そのため、「プログラミングを学ぶ必要はもうないのでは」と考える方もいらっしゃるかもしれません。
しかし、プログラミングの知識は、こうした先進的なツールをより効果的に活用する上でも重要ですし、どのような技術が登場してもその価値を失うことはありません。
プログラミング未経験の方や、プログラミングに苦手意識がある方もいらっしゃるかもしれませんが、本講座は初心者から上級者までを対象に、理解しやすく実践的な内容で構成しています。
また、WordPressのプラグイン開発やカスタマイズにとどまらず、ウェブ開発全般やセキュリティ対策など、幅広い知識を身につけていただけるように心がけています。
この講座を通じて、WordPressカスタマイズやウェブ開発の魅力と可能性を発見していただければ幸いです。
タイトルにある通り、WordPressのプラグイン開発を主軸としていますが、プラグイン開発そのものを最終目的とは考えていません。
「WordPressサイトを自由自在にカスタマイズできるようになる」というゴールをイメージして、そうした能力を身につけていただくことを目標に、この学習に取り組んでいただければと思います。
次に、本講座を受講していただきたい方、受講に向いていそうな方についてお話ししたいと思います。
【受講対象者】WordPressカスタマイズ・プラグイン開発講座はこんな方におすすめ!
WordPressが利用されるシーンは様々です。
例えば、個人がブログサイトとして情報発信をしているケース、企業が自社のウェブサイトをWordPressで管理しているケース、店舗がネットショップや予約サイトとしてWordPressサイトを運営しているケースなど、挙げればキリがありません。
そして、こうしたWordPressサイトの管理者の中には、自らサイトのデザインを工夫したり、必要な機能を導入するなどして、管理者自身でカスタマイズを行っている方も多く見られます。
本講座は、そのように自分でサイトを改善したいという方にマッチしていますし、それ以外にも、ここで挙げたような方におすすめできる内容となっています。
本講座の受講が向いている方の例として、まずは先ほども触れましたが、WordPressサイトを管理・運営している方です。
例えば、サイトを改善したい、もっと便利に使いたい、独自の機能を実装したいといった場合、この講座を学んでいただくことで、ある程度のカスタマイズを自分で行えるようになります。
次に、ウェブ制作やデザインに関わる仕事をしている方にも本講座はおすすめです。
マークアップエンジニア、フロントエンドエンジニアと呼ばれるウェブ制作に関わる方と話をしていると、「HTMLやCSSはできるけれど、それ以上のことはちょっと…」という声をよく聞きます。
WordPressは世界中の数十パーセントのウェブサイトで使われている、非常に人気の高いウェブサイト構築プラットフォームです。
ウェブ制作に関わる多くの方がWordPressを扱ったことがあるでしょうし、今後も避けて通れないものだと思います。
本講座は、そうしたウェブ制作者のスキルアップやキャリアアップにも大いに役立つはずです。
また、一度学べば一生使えると言うと大げさかもしれませんが、この講座で身につけた知識やスキルは、ウェブ業界で長く使える武器になるはずです。
3つ目として、開発に関わる仕事をしている方にもおすすめです。
プログラミングや開発に抵抗がない方でしたら、この講座を難しいと感じることはないと思います。
WordPress関連の開発ができるようになると、仕事やキャリアの幅が広がりますし、先ほども触れたように、WordPressサイトは世の中に数え切れないほど存在し、開発案件もそれなりにあります。
例えば、WordPressの開発一本でフリーランスエンジニアとして生計を立てることも十分に目指せます。
講座の本編を進めていただければお分かりいただけると思いますが、WordPressのカスタマイズやプラグイン開発は、ウェブデザインの高度なスキルやデザインセンスをほとんど必要としません。
「開発はできるけれどデザインは苦手」という方にも向いていると言えます。
そして最後に、Web開発に興味がある方や、これからプログラミングを学習したい方にも本講座はおすすめです。
WordPressはプログラムの開発環境を無料で簡単にセットアップできますし、サイトのカスタマイズやプラグイン開発を学ぶことで、フロントエンドとバックエンドの両方を効率よく習得することができます。
また、アイデア次第ではたった数行のプログラムでも役立つ機能を作ることができるため、達成感が得られやすく、学習のモチベーションを維持しやすいという点でも優れています。
以上が本講座の受講に向いている方の例でした。
次のセクションでは、WordPressのカスタマイズについてさらに掘り下げてみたいと思います。
【WordPressカスタマイズの全体像】多種多様なニーズに応える4つのアプローチと構成技術
WordPressサイトのカスタマイズ方法は様々です。
例えば、サイトの背景や文字の色を変えたい、見出しのデザインを変更したいといったデザイン面の調整であれば、ある程度は管理画面からカスタマイズすることが可能です。
一方で、「ここにこれを表示したい」「これは表示したくない」といった表示の制御については、管理画面だけでは対応が難しい場合が多く、テーマファイルを編集してカスタマイズする必要が出てきます。
さらに、問い合わせフォームなどの操作を伴う機能を導入することもカスタマイズの一種です。
「こんな機能が欲しい」「こんな部品が欲しい」といったニーズに応えるカスタマイズですね。
このような場合の多くは、既存のプラグインで機能を拡張することになりますが、欲しいプラグインが見つからなかったり、既存プラグインの機能が不十分な場合は、プラグインを自作するなど独自に開発する必要があります。
つまり、管理画面でのカスタマイズ、テーマファイルの編集、既存プラグインでの拡張、独自開発でのカスタマイズと、大きく分けて4つの方法があります。
この講座では、テーマファイルの一部をカスタマイズすることも扱いますが、メインはプラグインを自作するというアプローチです。
どちらもプログラミングを伴うカスタマイズを行うことになります。
ここで、プログラミングを伴うカスタマイズに使われるWordPress関連の技術について整理してみましょう。
WordPressはHTML、CSS、JavaScript、PHP、MySQLという5つの主要な技術に基づいて構築されています。
まずウェブサイトの基盤となるのがHTMLです。
HTMLはウェブページの構造を定義するマークアップ言語で、テキストや画像などをブラウザ上でどのように表示するかを指定します。
次に、ウェブページの見た目やスタイルを調整するためにCSSが使われます。
例えば文字の装飾、色やサイズの変更、レイアウトの調整など、デザイン要素を細かく指定できます。
さらに、ウェブページに動的な機能を加えるためにJavaScriptが使用されます。
ユーザーの操作に反応してコンテンツを更新するなど、サイトをより魅力的で使いやすくする機能を実装できます。
これら3つの技術はフロントエンドの開発に関わり、主にブラウザ上で動作します。
対照的に、ウェブサイトの裏側、つまりサーバーで動作するバックエンド技術としてPHPとMySQLがあります。
PHPはサーバー側で実行されるウェブ開発に特化したプログラミング言語です。
WordPressのテーマやプラグインもPHPで記述されています。
MySQLはデータベース管理システムの一種で、サイトのコンテンツや設定データを保存・管理します。
データベースとのやり取りにはSQLという言語が使われ、効率的なデータの出し入れが可能です。
これら5つの技術が連携して、WordPressサイトを構成しています。
また、WordPressには「WordPressコア」と呼ばれるカスタマイズできない部分と、カスタマイズ可能な部分があります。
このカスタマイズ可能な部分の代表例がテーマとプラグインです。
先ほども触れましたが、プログラミングを伴うサイトのカスタマイズでは、テーマやプラグインに対してこれらの技術を使って開発を行うイメージです。
このように、WordPressサイトをカスタマイズする際は、テーマやプラグインに対して行うわけですが、カスタマイズのパターンにはある程度決まった形があります。
その内容について、この後のセクションでご紹介したいと思います。
【プログラミングでカスタマイズ】WordPressテーマとプラグイン拡張の選択肢
WordPressサイトでは、何かしらの「テーマ」が使われていることはご存知かと思います。
テーマは様々なファイルで構成されていますが、その中に「functions.php」というテーマを拡張するためのファイルがあり、これを編集してカスタマイズするのが、WordPressサイトの一般的なカスタマイズ方法です。
このfunctions.phpの編集だけでカスタマイズできるケースもあれば、そうでない場合もあります。
functions.phpの編集だけでは対応しきれない場合は、その他のファイルを編集する必要が出てきます。
ただし、市販のテーマや誰かが作ったテーマを直接編集することは、オリジナルを崩してしまうことになるため、あまりおすすめできません。
そこでWordPressには「子テーマ」という、テーマを安全に拡張するための便利な仕組みがあります。
この子テーマは、親テーマとセットで用意されている場合もありますが、そうでない場合もあります。
もし子テーマが用意されていない場合でも、親テーマを元に自分で簡単に作ることができますので、テーマをカスタマイズしたい場合は「子テーマを使う」と覚えておいてください。
後ほど、親テーマと子テーマを使ったカスタマイズ事例もご紹介します。
次に、テーマを使ったカスタマイズとは別に、「プラグインによるカスタマイズ」という方法について見ていきます。
多くのWordPressユーザーは、問い合わせフォームを設置するためのプラグインや、SEOやセキュリティ対策を強化するためのプラグインなど、何かしらの公式プラグインを導入していると思います。
公式プラグインというのは、WordPressに正式に認定され、世界中の誰でも使うことができるプラグインだと考えてください。
ですが、自分のサイト、または特定のサイトをカスタマイズするという目的で考えたときに、必ずしもWordPressに正式に認定されるプラグインを作る必要はありません。
つまり、世界中の誰もが利用できる「公式プラグイン」を作るのではなく、配布を目的としない「自分専用のプラグイン」を作成して、WordPressサイトを自由自在にカスタマイズしましょう、ということです。
公式プラグインとそうでないプラグインとで分類したことで、少しわかりにくく感じたかもしれません。
ですので、次のセクションでは「公式プラグイン」と「非公式(自作)プラグイン」の違いについて詳しくお話ししたいと思います。
【公式 vs 自作】WordPressプラグイン開発の特性と使い分け
WordPressには「公式プラグイン」とそうでないプラグインがありますが、ここでは公式ではないプラグインのことを「自作プラグイン」と呼び、公式プラグインと自作プラグイン、それぞれの違いを解説します。
まず、公式プラグインとしてWordPressに認定されるためには、登録審査が必要です。
この審査ではソースコード、つまり開発したプログラムファイルを提出し、細かくチェックを受けます。
そして審査に合格するまでプログラムの修正を繰り返す必要があります。
一方、自作プラグインは登録審査などは不要で、わずか数行のプログラムでも成立します。
次に、プラグインの利用方法についてですが、公式プラグインは不特定多数の人に利用されることを想定しているため、慎重に作る必要があります。
例えば、複数のWordPressのバージョンで動作確認をしたり、なるべくすべてのテーマで問題なく動作するように配慮する必要があります。
「すべてのテーマで動作するべき」というのは当たり前のように思われるかもしれませんが、特定のテーマでしか動かないプラグインになってしまうこともありますので、公式プラグインを作る際は注意点が多いのです。
一方、自作プラグインは特定のサイトで利用されることを想定して作ることが多いため、公式プラグインと比べて配慮すべき点がかなり限定され、開発しやすいと言えます。
また、先ほどの利用方法とも重なりますが、公式プラグインは様々なテーマで動作することが求められるため、デザイン面にも配慮が必要です。
どういうことかというと、一例を挙げると、表示幅が十分広いテーマで横幅1000ピクセルを想定して適切に表示される予約カレンダーのプラグインを作った場合、別のテーマに導入すると横幅が不十分でうまく表示されないことがあります。
自作プラグインは特定のテーマを前提に作ることが多く、デザインの調整もそのテーマに合わせて行えるため楽ですが、公式プラグインにする場合はある程度のデザインの汎用性を確保する必要があります。
最後に国際化対応についてです。
公式プラグインは世界中のWordPressユーザーに利用される可能性があるため、国際化対応、つまり多言語の翻訳に対応した作りにすることが望まれます。
WordPressの国際化対応の仕組み自体はよくできているので難しいものではありませんが、プログラムを書く際の配慮が増えたり、日本語と英語の両方のテキストを考慮する必要が出てくるなど、手間が増える面があります。
一方、自作プラグインを使うシーンは、日本人しか訪問しないような特定サイトの場合がほとんどだと思いますので、国際化対応を施す必要はほとんどありません。
これらのことからお分かりいただけると思いますが、公式プラグインの開発は自作プラグインの開発と比べて総じてハードルが高いと言えるでしょう。
このことをまとめたのがこちらのスライドです。
不特定多数に利用されることを前提とした公式プラグインの開発はハードルが高く、特定サイトのカスタマイズのために作る自作プラグインの開発はそれほどではありません。
本講座では、サイトカスタマイズのために様々なプラグインの作り方を解説していきますが、扱うのは自作プラグインが中心です。
もちろん、公式プラグインを作って多くの人に利用されることを目標や喜びとする方もいらっしゃると思いますが、まずは自作プラグインを作って経験を積んでから、公式プラグイン開発にチャレンジするというアプローチをおすすめします。
以上が、公式プラグインと自作プラグインの違いについての説明でした。
【セクション1まとめ】WordPressカスタマイズとプラグイン開発の基本概念
本セクションのまとめになりますが、WordPressサイトのカスタマイズ方法は多種多様です。
管理画面や既存のプラグインでもある程度は対応できますが、それだけでは対応しきれない場合は、プログラミングを伴う独自のカスタマイズが必要になることがあります。
WordPressはHTML、CSS、JavaScript、PHP、MySQLといった技術に支えられて作られていますので、プログラミングを伴うカスタマイズではこれらの技術や言語を使用します。
WordPressには「WordPress Core」というカスタマイズできない部分と、カスタマイズが可能な部分があります。
このカスタマイズ可能な部分の代表が「テーマ」と「プラグイン」です。
テーマを使ってカスタマイズする場合は、親テーマではなく「子テーマ」を使うことが推奨されています。
また、プラグインでカスタマイズする場合は、いきなり公式プラグインを目指すのではなく、まずは敷居の低い「自作プラグイン」として開発することをおすすめします。
この講座を効果的に学習していただくために、推奨する進め方をご説明します。
本講座はセクション3を除き、セクション1から順番に学習を進めていただく構成となっています。
具体的には、前のセクションで習得した知識やスキルを次のセクションでも活用するよう設計されています。
例えば、これまでのセクションを飛ばしてしまうと、以前に解説した内容を簡略化して進めているため、深く理解することが難しくなります。
結果として、期待するスキルが身につかない可能性もあります。
そのため、もしお急ぎの場合でも、倍速再生などを活用しつつ、すべてのセクションを順番にご覧いただきながら学習を進めていただければと思います。
一点、例外としてセクション3については、WordPressの開発に必要となるプログラミング言語の基礎を紹介しています。
これらの言語にすでに詳しい方は、このセクションをスキップしていただいても問題ありません。
この学習ルートに沿って進めていただくことで、最終的には「こんなプラグインを作りたい」「こんな機能を実装したい」という具体的なアイデアを実現できる力が身につくはずです。
それでは、講座の本編をご覧ください。