FREENANCE Ad

WordPressプラグインをカスタマイズするための3つのアイデア

wordpressplugin
FREENANCE Ad
ENGINEER

WordPressを使ってなにかを実現したいときに、プラグインは有効な手段ではありますが、ほとんどの場合100%完璧にやりたいことが実現できるわけではありません。またある時には、ヘビーユースしている特定のプラグインに、もう少し必要な機能を追加したかったりすることもあります。

こういう時には、既存のWordPressのプラグインをカスタマイズするのがおすすめです。「経験豊富なエンジニアにしかできないんじゃないの……?」と思われるかもしれませんが、実はプラグインのカスタマイズは簡単です。何を実装したいかによりますが、PHPとHTML、CSSの基本的な知識があれば、十分に使える機能を追加できるでしょう。

この記事ではプラグインをカスタマイズする方法と、目的別にいくつかの基本的なカスタマイズ手段について紹介します。

まずは適切なWordpressプラグインを見つけよう

最初のステップであり、最も重要なステップ、それはプラグインを選ぶことです。どんなプラグインでもカスタマイズできますし、すでに使っているプラグインをカスタマイズしたい人もいるでしょう。しかしプラグインをカスタマイズして追加機能をつける際に、もし何かトラブルがあると大変です。プラグインのカスタマイズは慎重に行う必要があります。

多くの場合、カスタマイズを検討するプラグインは、Webサイトにおいて重要な役割を果たすプラグインです。例えばEコマースの有名プラグインである『WooCommerce』は、オンラインストアにおける主要な機能を担います。また多くのイベントを開催する組織は、高機能なカレンダープラグインを使うでしょう。

どのようなプラグインにせよ、大切なのは「長く使える」ことです。そのため選ぶべき適切なプラグインの基準は、以下のとおりとなります。

  • プラグイン作者によって充分に管理されている
  • プラグインを使用しているユーザーが多い
  • バグ修正やサポートリクエストに定期的に回答されている
  • 自分の必要とする機能の大部分はすでにプラグインの機能として存在する

もちろんこれだけが良いプラグインの特徴ではありませんが、まずは上記を基準に使用するプラグインを選びましょう。

WordPressプラグインをカスタマイズする3つのアイデア

プラグインを選び終えたら、どのようなカスタマイズをするか考えましょう。

どのような機能をカスタマイズして実装するかは、あなたの持っているスキルと想像力によります。しかし、先人の知恵をたどるのも大切です。まずは『Gravity Forms』や『Advanced Custome Fields』など、開発者がこれまで作ってきたすばらしいアドオンに注目してみましょう。プラグインのアドオンは、優れた機能をより使いやすくするカスタマイズの良い例です。

今回はよりあなたのサイトに特化した機能にフォーカスしてみましょう。あなた自身のサイトでやりたいことを実現するのです。つまり、あなた自身、もしくはクライアントがより管理しやすくなるような機能を考えるのです。

以下で、プラグインをどうカスタマイズするかを助ける、基本的な3つのアイディアをご紹介します。

1. カスタムフィールドでデータ入力項目を増やそう

インストールしたプラグインはデフォルトの状態だと、あなたが必要とするデータをすべて含んでいる状態とはいえないでしょう。しかしWordPressのカスタムフィールドを用いることで、どのようなデータでも好きに追加できるのです。

例えばカレンダープラグインの場合。あなたのサイトでミーティングの予定を登録できる機能があるとします。しかしながらそのプラグインは、他のユーザーとアジェンダやドキュメントのリンクを自由に共有する機能が付いていませんでした。

それぞれのイベントに管理者が手作業でリンクを追加すれば良いかもしれませんが、それは管理の観点から見てもベストな解決策ではないでしょう。代わりに、よりユーザーフレンドリーでシンプルな機能を構築してみましょう。

ここでは、各投稿にリンクを貼れるカスタムフィールドを組み込むことで、使い勝手の良さを大幅に引き上げられるでしょう。また、フロントエンドとバックエンドでの一貫性も担保できます。フロントエンドではユーザーが重要な情報を見つけやすいようにスタイルでき、バックエンドではデータを簡単に管理できるのです。

フィールドのデータをカスタマイズした、カレンダープラグインの画面イメージ

2. データのアウトプットを変更しよう

お次はアウトプットも変更してみましょう。

以下のようなケースでは、アウトプットを変更することをおすすめします。

文言があなたのサイトに合わないケース

場合によっては、プラグインが標準で表示する文言が、あなたのサイトとマッチしていないことがあるでしょう。例えばあなたのサイトが、Eコマースプラグイン『WooCommerce』を使ってオンライン寄付を募っている場合。商売が目的ではないため、WooCommerceに内蔵されたカートの文言は、ユーザーを混乱させてしまうかもしれません。

デフォルトでは、WooCommerceは出品されているすべてのものを「Product(商品)」と表現しています。一般的なオンラインストアでは全く問題ありませんが、今回は「Donation(寄付)」に変更したいと思います。

“gettext” WordPressフィルターを使用することで、すべてのインスタンスの「Product」を「Donation」、もしくはもっと適した言葉に変更することができます。

プラグインをカスタマイズして、ProductをDonateに変更した画面のイメージ

特定条件化のデータのみに変更を加えたいケース

Webサイト上のユーザー体験を向上させるのは、実はさりげない要素だったりします。

またも『WooCommerce』を例にあげますが、たとえば特定のカテゴリ(ここでは「Jackets」)の商品だけに、追加情報(ここでは「Wear a jacket – it is very cold outside!」)を表示したい場合。WooCommerceの”is_product()”ファンクションと、WordPressの”has_term()”ファンクションを組み合わせることで、特定のカテゴリの商品に対して追加情報を表示できます。

<?php 
// Add important information to products within the "Jackets" category.
add_action( 'woocommerce_single_product_summary', 'jacket_information', 10);
// Check to see if it's a WooCommerce product and in the "Jackets" category.
    if ( is_product() && has_term( 'Jackets', 'product_cat' ) ) {
        
        // Now, provide the important information.
        function jacket_information() {
        echo 'Wear a jacket - it is very cold outside!';
        }
    }
?>

非常にシンプルな条件文ですが、これだけでプラグインをカスタマイズできてしまうのです。

3. 別のWordpressプラグインと合体させよう

場合によっては、あるプラグインの機能すべて(もしくは一部)を別のプラグインと組み合わせたいと思うこともあるでしょう。これだけ聞くと「初心者には難しいのでは?」と思われるかもしれませんが、想像より簡単です。

以下、いくつかのカスマイズをご紹介します。

  • WooCommerceストアで最も売れている製品を動的に表示するために『slider plugin』を組み合わせる
  • オンラインコースで特定の講義を修了した後に、商品を購入する権利を与える
  • 一ヶ月間続けてメンバーシップサイトに登録していたユーザーに対し、ユーザーアカウントページに統計結果を含める

これらのタイプのコンビネーションは、プラグインに特化したフックや、すでにWordPressが備えている機能で実現できます。可能性は無限大です。ほんの少しの想像力と、コードを書く意志さえあれば実現できます。Wordpressやプラグインに関するドキュメントを読むことでも、さまざまなことができるでしょう。

プラグインをカスタマイズするアイディアを思いつくイメージ

WordPressプラグインをカスタマイズして、あなただけのWebサイトを作ろう

優れたWebサイトを作るのに、複雑かつあらゆる機能を実装する必要はありません。ほとんどの場合、ちょっとした工夫で普通とは異なる素晴らしいWebサイトになるのです。

WordPressのプラグインは、さまざまな便利機能を提供し、サイト運営を助けてくれます。さらにそこに少しだけ腕を加えると、よりあなたの目的に適った、あなただけのカスタマイズされたWebサイトを作れるでしょう。

(原文:Eric Karkovack 翻訳:Yui Shimizu 編集:Workship MAGAZINE編集部)

SHARE

  • 広告主募集
  • ライター・編集者募集
  • WorkshipSPACE
エンジニア副業案件
Workship