商品が増えるサイトは、ページの見た目より先に、共通の仕様項目と例外の扱いを決めると追加方法を設計しやすくなります。一覧で比較する情報、詳細だけに載せる情報、商品ごとに異なる補足を分け、代表商品を入力してから全商品の制作へ進みます。
顧客の商品紹介やBtoBの営業支援を担う制作会社・広告会社・代理店では、カタログ、営業資料、展示会で使う商品情報を、Webでも継続して伝える案件があります。最初の20点をきれいに掲載しても、21点目だけ別の仕様表になったり、寸法の単位が混在したりすると、比較する人にも更新する人にも負担が残ります。
先に揃えるのは、見出しではなく項目の意味
たとえば「サイズ」とだけ決めても、幅だけなのか、幅・奥行・高さなのかで入力が変わります。型番は商品を区別する値、用途は絞り込みに使う区分、寸法は単位を含む表示、と意味を合わせます。値が分からない「未確認」と、その商品に適用しない「対象外」も同じ空欄にはしません。
ただし、すべてを必須にすると例外商品を登録できなくなります。全商品で揃う項目は共通欄にし、特殊な条件は補足欄へ逃がす方法が候補です。項目を増やす前に、サイトを見る人が比較や問い合わせに使う情報か、管理上だけ必要な情報かを顧客と確かめます。
架空例：20商品に使う共通の項目定義表
以下は架空の部品メーカーを想定した記入例です。GreenCodingの実績や実在商品の仕様ではありません。一覧では型番と用途を比較でき、詳細では仕様と資料を読める構成にしています。
| 項目 | 記入例・ルール | 掲載場所 |
|---|---|---|
| 型番 | AB-120。商品ごとに固有、必須 | 一覧・詳細 |
| 用途 | 搬送。決めた区分から選択 | 一覧・詳細 |
| 寸法 | 幅120×奥行80×高さ40 mm | 詳細 |
| 材質 | アルミ。未確認は公開前に照会 | 詳細 |
| 規格 | 対象外。空欄とは区別して管理 | 詳細 |
| 関連資料 | 仕様書PDF、改訂日付き | 詳細 |
| 固有の補足 | 特注寸法は個別相談 | 詳細の補足欄 |
もう一つの架空商品「CD-200」が寸法を固定できない特注品なら、共通の寸法欄を無理に埋めず、「注文仕様により異なる」と表示する例外を定義します。「入力なしなら非表示」にするか、「個別相談」と表示するかも仕様です。この二点を先に試すと、標準品だけでは見えない表示上の違いを確認できます。
WordPressの仕組みは、更新の単位から選ぶ
商品を一件ずつ追加するなら、商品専用の投稿種別と、仕様を入力する欄を設ける方法があります。WordPress公式のカスタム投稿種別の案内では、独自の投稿種別の登録、取得、公開表示を扱っています。商品一覧と詳細を同じデータから表示する設計の候補ですが、仕組みを追加しただけで項目が揃うわけではありません。
WordPress公式の入力欄に関する案内も、投稿に関する情報を収集する方法を説明しています。実装には、入力値の検証、編集権限、保存・表示の処理が必要です。既存サイトの更新機能が使える場合もあるため、特定のプラグイン導入を前提にせず、担当者の入力作業とサイトの構成に合わせて選びます。
代表2点と追加1点で、納品後の作業を試す
- 標準品と例外品を入力する：共通項目、補足、空欄の扱いを確かめ、一覧・詳細の見本を顧客が確認します。
- 担当者が一件追加する：用意した写真・仕様から入力し、説明なしで迷う欄や、公開前に確認したい情報を洗い出します。
- 改訂を試す：寸法とPDFを差し替え、PC・スマートフォンで表示、一覧への反映、資料リンクを確認します。
依頼する単位も「商品ページ一式」だけで終えず、項目定義、一覧・詳細の実装、初期20点の入力、追加方法の説明を分けます。仕様の正確さと掲載許可は顧客、原稿整理と確認の進行は制作側、入力・表示の実装と検証はWeb担当、という役割案を合意しておくと、改訂時の確認先が明確になります。
GreenCodingへ相談できる工程
GreenCodingには、商品情報からの要件整理、カスタム投稿・カスタムフィールドを使う更新画面、一覧・詳細のコーディング、既存サイトへの追加・修正、表示と更新方法の検証、公開後確認・保守を相談できます。在庫管理、受発注連携、大規模なECや営業代行まで、この商品紹介の設計と同じ範囲で扱うものではありません。
相談時は、代表商品の仕様資料、例外商品の一例、現在のサイトURL、追加や改訂を担当する人を共有してください。全部の商品原稿が揃う前でも、共通項目と未定事項を分け、任せたいWeb側の工程を検討できます。