この度は私が開発いたしました軽量のプラグインについて、ご紹介させていただきます。WordPressサイトにおいて、複数のサービスや商品を一覧で比較し、訪問者にわかりやすく情報を伝える比較表は、コンバージョン向上において重要な役割を果たしております。しかしながら、比較表を設置するには、通常、HTMLやテーブルタグを直接編集する必要があり、専門知識のない方にとっては容易な作業とは言えません。本記事では、WordPressの投稿や固定ページに、簡単なショートコード1つで比較表を設置でき、かつログイン時にはサイト上から直接編集・列追加が可能となる「比較表ショートコード」の機能と利点について、ご説明させていただきます。
比較表ショートコードとは
比較表ショートコードは、WordPress向けの比較表表示機能でございます。投稿や固定ページの本文に、[comparison_table] というショートコードを記入するだけで、評価点・最大の特徴・調査料金・得意エリア・アフターケア・公式サイトリンクといった比較項目を持つ、見やすく整った比較表が自動的に表示されます。複雑なコードの記述は一切不要で、初心者の方でも手軽にご利用いただける点が大きな特徴でございます。
ページごとに独立したデータの保存
比較表ショートコードの最大の特徴の一つとして、表示しているページ・投稿ごとにデータが別々に保存される仕組みがございます。すなわち、Aページで比較表の内容を編集・変更した場合でも、BページやCページに設置されている比較表には一切影響が及ばないため、各ページに異なる比較内容を設置し、ページのテーマに合わせたきめ細かい情報提供が可能となります。複数ページに同一のショートコードを設置されている場合でも、それぞれ独立した比較表として機能いたします。
ログイン時のみの編集モード
比較表の編集機能は、WordPressにログインしている管理者・編集者のみが利用できる仕様となっております。ログアウト状態の訪問者がサイトを閲覧する際には、編集用のボタンや入力欄は一切表示されず、完成された比較表のみが表示されます。これにより、一般の訪問者に対して誤った操作を招くことを防ぎつつ、管理者は必要な際にいつでも内容を更新できるという、セキュリティと利便性を両立した設計となっております。
1列目を含む全セルの編集が可能
従来の比較表ツールでは、左端の列（比較項目のラベル列）が固定となり、編集できない場合が多くございました。本比較表ショートコードでは、ログイン時の編集モードにおいて、ヘッダー「比較項目」および各行のラベル（評価点・最大の特徴・調査料金など）を含む1列目も含め、表の全セルをサイト上から直接編集いただくことが可能です。比較項目の名称を用途に合わせて変更し、より目的に沿った比較表を構築することができます。
列の追加と削除
ログイン時の編集ツールバーには、「＋ 列を追加」ボタンが用意されております。ボタンをクリックするだけで、新しい比較対象（例：新しいサービスや商品）の列が表に追加され、各項目の値を入力・編集いただくことができます。また、各列には削除ボタンが表示されており、不要になった列を簡単に削除することも可能です。なお、最低1列は残す必要がございます。
編集内容の自動保存
比較表内のセルを編集し、フォーカスを外すか、入力操作を行ってから約0.6秒経過すると、編集内容が自動的にサーバーに保存されます。保存が完了すると「保存しました」というメッセージが表示され、ページを再読み込みした後も、編集した内容がそのまま反映された状態で表示されます。手動での保存ボタン操作は不要で、スムーズな更新作業が行える仕様となっております。
横スクロール対応
比較対象が増えて列数が多くなった場合、画面幅を超えて表が横長になることがございます。本比較表ショートコードでは、表の周辺に横スクロール用の領域を設けており、表が横幅にはみ出す場合にも常に横スクロールバーが表示されるよう設計されております。スマートフォンやタブレットでの閲覧時にも、指でのスワイプ操作により、表全体をスムーズに閲覧いただくことができます。
評価点の星表示
評価点の項目には、数値（例：4.9）に加えて、★と☆を用いた5段階の星表示が自動的に適用されます。数値を入力・編集いただくだけで、対応する星の表示が即座に更新され、訪問者にとって直感的に理解しやすい視覚的な評価表示を実現いたします。
導入方法について
導入につきましては、Code Snippetsプラグインをダウンロードし、
PHPコードとしてダウンロードしたコードをそのまま貼り付けるだけで完了します。あとは、表示したい場所にショートコードを配置するだけで機能します。
コード提供について
本プラグインのコードは、こちらよりご提供しております。
コードはこちら：d.kuku.lu/mdc57ucjs
なお、ダウンロードができない場合は、お声がけいただければご提供致します。
まとめ
比較表ショートコードは、[comparison_table] というシンプルなショートコード一つで、WordPressサイトに高機能な比較表を設置できる、大変便利なツールでございます。ページごとに独立したデータ保存、ログイン時のみの編集モード、1列目を含む全セルの編集、列の追加・削除、自動保存、横スクロール対応など、実務において求められる機能が一通り揃っております。サービス比較、商品比較、料金プラン比較など、多様な場面でご活用いただけます。本ツールを導入いただくことで、更新作業の効率化と、訪問者へのわかりやすい情報提供の両方を実現していただけますと幸いでございます。
