「Advanced Custom Fields Pro 柔軟コンテンツ」というプラグインをご存知でしょうか？
このプラグインは、WordPressのサイトを運営する中で感じる「もっと自分達で更新できるページを増やしたい」、「デザインにこだわりたい」といったお悩みを解決するための機能です。

今回は、コーディングスキルがなくても簡単に更新ができ、ページのデザインをカスタマイズできる「Advanced Custom Fields Pro 柔軟コンテンツ」について紹介します。

Advanced Custom Fields Pro 柔軟コンテンツとは

「Advanced Custom Fields Pro柔軟コンテンツ」とは、WordPressの投稿や固定ページにカスタムフィールドを追加し、入力項目を自由にカスタマイズできるプラグインのことです。
もう少しわかりやすく言うと、ページを更新する際、都度レイアウトや見出しなどのパーツを選択すると専用の入力ボックスが立ち上がるようになります。
入力ボックス内にテキストや画像を貼り付ければ簡単に更新ができるようになるプラグインです。

通常、独自のカスタムフィールドを作成するためにはプログラムを書く必要があり専門的な知識を必要とするため、事前に更新したい項目や対象ページを決めておく必要がありますが、「Advanced Custom Fields Pro柔軟コンテンツ」を利用すれば管理画面上で簡単に作成することができます。
また、カスタムフィールドを利用するため、ページの更新自体はノーコードで行うことが可能です。

「Advanced Custom Fields Pro 柔軟コンテンツ」の導入メリット

• ページの更新に関しては、サイト制作の専門知識は一切不要。
• パーツを選んで入力するだけなので、情報の追加も簡単。
• 事前にパーツを用意するので、ページごとにデザインがバラバラにならずに更新できる。
• 機能追加で対応でき、ページに合わせて何個もテンプレートを作成する必要が無いため費用を抑えられる。

管理画面の入力方法

更新したいページを開き、「パーツを追加」から使用したいパーツを選択します。
すると、選択したパーツに合わせた専用のカスタムフィールドが立ち上がります。

下の画像のようなパーツを選択した場合は、画像とテキストを追加するカスタムフィールドが立ち上がります。

パーツイメージ

パーツ自体はプラグイン導入時に作成しておく必要がありますが、下の画像のようなパーツを制作しておくことで、更新の幅が広がります。

通常のWordPressサイトによくある課題

「Advanced Custom Fields Pro 柔軟コンテンツ」を利用することで、WordPressによるサイト運営で起こりやすい下記のような課題を解決できます。

課題1. 最初に決めたテンプレートでしか情報が登録できない。

通常のWordPressサイトでは、作成したテンプレートに基づいて情報を登録します。そのため、テンプレートに設定されたカスタムフィールドやレイアウト以外の情報を登録することが難しく、柔軟性に欠けるケースがあります。

課題2. テンプレートの修正は都度改修が必要で時間と費用がかかる。

テンプレートを修正する際にコーディングが必要となる場合があります。修正ごとにエンジニアや制作会社に依頼し、都度改修をおこなわなければならないため、時間と費用がかかります。

課題3. ビジュアルエディタだと使用できるパーツが少なく、デザインにこだわれない。

一般的なビジュアルエディタを使用する場合、利用可能なデザインパーツが制限されます。
そのため、細かなデザインのカスタマイズや独自のスタイルを追加することが難しく、サイトのデザインにこだわりにくいです。

課題4. 自分たちで更新したいページがたくさんあったが、費用がかかりすぎる。

更新したいページを増やせば増やすほど、それだけ多くのテンプレートや各ページにカスタムフィールドを追加したりと、工数がかかります。
そのため、エンジニアや制作会社に依頼すると費用が膨らみがちです。

各種比較

一般的な投稿タイプの更新方法と、「Advanced Custom Fields Pro 柔軟コンテンツ」を利用した際の更新方法を比較してみます。

更新方法の比較

一般的な投稿タイプを使った更新方法

一般的な更新方法は、事前に決めた入力項目に情報を入力し、自由に投稿したい箇所はビジュアルエディタを使って見出しやテキストを入力します。

「Advanced Custom Fields Pro 柔軟コンテンツ」を使った更新方法

「Advanced Custom Fields Pro 柔軟コンテンツ」を利用すれば、入力ボックスの中からパーツを選択できます。パーツを選択したあとはテキストと画像を入れるだけなので簡単です。パーツは繰り返し挿入できるため、掲載したいコンテンツに合わせてページを作成できます。

制作工程の比較

一般的な制作工程

通常、サイト制作時に更新したい情報を決め、制作会社に入力欄を管理画面に用意してもらいます。
そのため、後から項目を増やそうとすると改修が必要になります。また、決まった形式でしか更新ができません。

「Advanced Custom Fields Pro 柔軟コンテンツ」を使った制作工程

「Advanced Custom Fields Pro 柔軟コンテンツ」では、どのようなパーツを用意するかを事前に取り決めます。事前に取り決めたパーツを組み合わせて更新できるため、情報の追加やページ毎のレイアウト変更が簡単にできます。また、スマートフォンでの見え方など、各パーツのデザインをこだわって作成することができます。

費用の比較

製品ページ、事例、新着情報を簡易に更新できるようにする場合の構築費用をそれぞれ比較してみます。
※価格は一例です。依頼先や条件によって異なります。

通常の構築費用

入力項目を用意する形で多くのページを更新できるようにしようとすると、その分のテンプレート（投稿タイプ）が必要になるため、費用も高くなりがちです。また、入力項目が増えるほど費用も上がってしまいます。

製品ページ　投稿タイプ作成　¥120,000
事例　　　　投稿タイプ作成　¥100,000
新着情報　　投稿タイプ作成　¥80,000
合計 ¥300,000

「Advanced Custom Fields Pro 柔軟コンテンツ」を利用した構築費用

「Advanced Custom Fields Pro 柔軟コンテンツ」を利用すると、事前にパーツを多く作成しておくことによりさまざまなページの更新に対応することができます。また、入力項目を用意する必要もなくなるため、新たにテンプレートを作る場合の費用も下がります。

Advanced Custom Fields Pro 柔軟コンテンツ　\150,000
事例　　　投稿タイプ作成　¥60,000
新着情報　投稿タイプ作成　¥40,000
合計 ¥250,000

製品ページはACFP柔軟コンテンツを使用。
会社情報など、他のページでも使用できます。

導入の流れ

WordPressのサイトであれば「Advanced Custom Fields Pro 柔軟コンテンツ」の追加ができます。
リニューアルの場合もWordPressを利用すれば実装可能です。

1. パーツ選定

見出しや、画像とテキストを組み合わせたレイアウトを精査し、更新に必要なパーツを選定します。

2. パーツデザイン

各パーツのPCデザイン、SPデザインを作成し、パーツリストページを作成します。

3. WordPressへの導入

「Advanced Custom Fields Pro 柔軟コンテンツ」をインストールし、パーツを組み合わせて更新できるように設定を行います。

4. 更新方法の確認、受け入れ

更新方法を確認し、問題が無ければ作業完了、運用者への引継ぎなど、受け入れを行います。

まとめ

「Advanced Custom Fields Pro 柔軟コンテンツ」を使った更新方法を紹介しました。導入するだけでは機能しないため、機能の追加と合わせて事前の設定が必要となりますが、さまざまなレイアウトをパーツとして用意することで、よりスピーディーで簡単にサイトを更新できます。

導入を検討したい、実際の管理画面を見てみたいなど、もし気になることがございましたら下記フォームからお問い合わせください。