WooCommerceショップを管理していると、新しいファイルを製品詳細ページに追加情報を追加するなどの状況がある。製品仕様、特定の特性または技術的パラメータ.この記事では、WooCommerceに商品の仕様や属性を追加する方法と、プラグインを使用してそれらを拡張する方法について詳しく説明します。
![画像[1] - WooCommerceの商品詳細ページに商品の仕様と属性を追加する方法 - Photon Flux.com|専門的なWordPress修理サービス、グローバルなリーチ、迅速な対応](https://www.361sale.com/wp-content/uploads/2024/09/2024091402400493.png)
なぜ製品の仕様や属性を追加するのか?
製品情報を追加することには、いくつかの利点があります:
- ユーザーエクスペリエンスの向上製品の特性をより直感的に理解してもらう。
- SEOの強化リッチな商品ページは、SEOのパフォーマンスを向上させます。
- コンバージョン率の向上詳細な製品情報は、ユーザーがより良い購買決定を下すのに役立ちます。
- 専門ディスプレイ: 技術製品(電子製品、機械装置など)の場合、詳細な仕様を示すことが特に重要です。
I. WooCommerceの商品属性機能を使う
WooCommerceには、各商品に追加の仕様や属性を追加するために使用できる、シンプルで強力な属性管理システムが付属しています。
1.グローバル・プロパティの作成
グローバル・アトリビュートは複数の商品に適用することができ、特に類似した商品を数多く扱うショップに便利です。手順は以下の通りです:
- WordPressのバックエンドに移動し、次の場所に移動します。 製品情報 > プロパティ.
![画像[2] - WooCommerceの商品詳細ページに商品の仕様と属性を追加する方法 - Photon Flux.com|専門家のWordPress修理サービス、グローバルなリーチ、速いレスポンス](https://www.361sale.com/wp-content/uploads/2024/09/2024091401421460.png)
- で "新しい属性の追加"エリアに、プロパティ名(色、サイズなど)を入力します。
![画像[3] - WooCommerceの商品詳細ページに商品の仕様と属性を追加する方法 - フォトンゆらぎネットワーク|WordPress修理のプロフェッショナル、ワールドワイド、迅速対応](https://www.361sale.com/wp-content/uploads/2024/09/2024091401435895.png)
- 属性の可視性を設定し、製品のフィルタリングに使用するかどうかを選択します。
- 打点 プロパティの追加すると、右側の物件リストにその物件が表示されていることがわかります。
![画像[4] - WooCommerceの商品詳細ページに商品の仕様と属性を追加する方法 - フォトンゆらぎネットワーク|WordPress修理のプロフェッショナル、ワールドワイド、迅速対応](https://www.361sale.com/wp-content/uploads/2024/09/2024091401491999.png)
- の右にある新しく作成されたプロパティをクリックする。 設定用語を追加する。ピンクそして青そしてよりグリーン(など)。
![画像[5] - WooCommerceの商品詳細ページに商品の仕様と属性を追加する方法 - フォトンゆらぎネットワーク|WordPress修理のプロフェッショナル、ワールドワイド、迅速対応](https://www.361sale.com/wp-content/uploads/2024/09/2024091401503816.png)
2.個々の製品にカスタム属性を追加する
特定の商品に関する追加情報のみを追加したい場合はカスタムプロパティ::
- 入り込むお飾り商品を編集するには、編集したい商品を見つけて コンパイラ.
![画像[6] - WooCommerceの商品詳細ページに商品の仕様と属性を追加する方法 - フォトンゆらぎネットワーク|WordPress修理のプロフェッショナル、ワールドワイド、迅速対応](https://www.361sale.com/wp-content/uploads/2024/09/2024091401520760.png)
- スクロールダウンして "製品データ「セクションを"因果性タブ
![画像[7] - WooCommerceの商品詳細ページに商品の仕様と属性を追加する方法 - フォトンゆらぎネットワーク|WordPress修理のプロフェッショナル、ワールドワイド、迅速対応](https://www.361sale.com/wp-content/uploads/2024/09/2024091401531353.png)
- 打点 増加 ボタンをクリックして、すでに作成されているグローバル・プロパティを選択するか、カスタム・プロパティを作成します。
![画像[8] - WooCommerceの商品詳細ページに商品の仕様と属性を追加する方法 - フォトンゆらぎネットワーク|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応](https://www.361sale.com/wp-content/uploads/2024/09/2024091401540779.png)
- 属性値を入力し、" "にチェックを入れる。商品ページに表示".
![画像[9] - WooCommerceの商品詳細ページに商品の仕様と属性を追加する方法 - フォトンゆらぎネットワーク|WordPress修理のプロフェッショナル、ワールドワイド、迅速対応](https://www.361sale.com/wp-content/uploads/2024/09/2024091401551288.png)
- 変更を保存して商品ページを表示すると、新しい属性がすでに商品詳細セクションに表示されているはずです。
第二に、プラグインを使用して製品情報の表示を拡張することである。
WooCommerceに内蔵されているプロパティ機能はシンプルですが、特に表示形式やレイアウトをカスタマイズする必要がある場合、柔軟性に欠けます。これらの機能はプラグインの助けを借りて簡単に拡張することができます。
アドバンスドカスタムフィールド(ACF)による複雑なフィールドの追加
より強力なカスタムフィールド管理機能については アドバンスドカスタムフィールド(ACF) プラグインです。これは、テキストボックス、画像、ドロップダウンボックス、チェックボックスなど、あらゆるタイプのカスタムフィールドを商品に追加できる非常に柔軟なツールです。
使用方法
- インストールとアクティベーション ACF プラグイン。
- カスタム・フィールド・グループを作成するには ACF > 新しいフィールドグループの追加.
![画像[10] - WooCommerceの商品詳細ページに商品の仕様と属性を追加する方法 - Photon Flux.com|WordPressの専門修理サービス、グローバルリーチ、迅速な対応](https://www.361sale.com/wp-content/uploads/2024/09/2024091402002485.png)
- 必要なフィールドを追加し、選択する。適用性ページまたは商品タイプ(特定の商品カテゴリーを指定できます)の
![画像[11] - WooCommerceの商品詳細ページに商品の仕様と属性を追加する方法 - Photon Flux.com|WordPressの専門的な修理サービス、グローバルリーチ、迅速な対応](https://www.361sale.com/wp-content/uploads/2024/09/2024091402030756.png)
- ある製品の編集そうすると、新しく追加されたカスタムフィールドの入力ボックスが表示されます。
- 商品を保存すると、これらのフィールドがフロントエンドの商品詳細ページに表示されます。
ACFは、単純なテキスト・フィールドの追加だけでなく、以下のようなリッチ・コンテンツ・タイプの追加もサポートしています。ファイルアップロード、画像、複雑なHTMLコンテンツなど、WooCommerceの商品ページの柔軟性を大幅に向上させます。
![画像[12] - WooCommerceの商品詳細ページに商品の仕様と属性を追加する方法 - Photon Flux.com|専門的なWordPress修理サービス、グローバルなリーチ、迅速な対応](https://www.361sale.com/wp-content/uploads/2024/09/2024091402045121.png)
第三に、商品詳細ページで表示をカスタマイズする。
WooCommerce組み込みの"追加情報"タブは通常、見せる場所である。製品仕様のような場所で、より美的に、あるいはブランドにふさわしい方法で情報を表示したいと思うこともある。
1.テーマのカスタマイズコードの使用
基本的なHTMLとCSSの知識があれば、テーマファイルを修正することで商品ページに表示される情報をカスタマイズすることができます。現在のテーマの 単一製品.php
ファイルで、商品の仕様と属性を表示するコードのセクションを見つけ、必要に応じてカスタマイズする。
2.ページビルダーの使用(Elementorなど)
のようなページビルダー・プラグインの助けを借りれば、ページビルダーを使うことができる。 エレメンタElementor Proバージョンでは、商品詳細ページのあらゆる部分をカスタマイズし、属性情報の追加や表示をデザインすることができます。
手順は以下の通り:
- ElementorとElementor Proをインストールし、有効化する。
- 入り込む テンプレート属しんちくまたは既存のテンプレートを選択します。
![画像[13] - WooCommerceの商品詳細ページに商品の仕様と属性を追加する方法 - Photon Flux Network|プロフェッショナルなWordPress修理サービス、グローバルリーチ、迅速な対応](https://www.361sale.com/wp-content/uploads/2024/09/2024091402101067.png)
![画像[14] - WooCommerceの商品詳細ページに商品の仕様と属性を追加する方法 - Photon Flux.com|専門的なWordPress修理サービス、グローバルなリーチ、迅速な対応](https://www.361sale.com/wp-content/uploads/2024/09/2024091402122923.png)
- エディタページに移動し、Elementorのドラッグ&ドロップエディタを使ってWooCommerceの"追加情報「商品詳細ページレイアウトにドラッグ&ドロップするウィジェットです。
![画像[15] - WooCommerceの商品詳細ページに商品の仕様と属性を追加する方法 - Photon Flux.com|専門的なWordPress修理サービス、グローバルなリーチ、迅速な対応](https://www.361sale.com/wp-content/uploads/2024/09/2024091402250331.png)
- 必要に応じてスタイルやレイアウトをカスタマイズできます。
- テンプレートを保存し、すべての商品ページまたは一部の商品ページに適用します。
第四に、商品ページの機能性を高めるための追加情報プラグインの使用である。
ACFによるカスタムフィールドに加えて、WooCommerceのために特別に設計されたプラグインが数多くあります。追加情報"タブまたはカスタムの場所に、より多くの製品詳細を表示します。
として: YITH WooCommerce 商品アドオン&追加オプション
このプラグインは、商品オプションを追加できるだけでなく、顧客が購入時に特定の商品構成を選択できるようにします(例ギフトラッピング、名入れ彫刻など)、ユーザー体験を大幅に向上させる。
![画像[16] - WooCommerceの商品詳細ページに商品の仕様と属性を追加する方法 - Photon Flux.com|WordPressの専門修理サービス、グローバルリーチ、迅速な対応](https://www.361sale.com/wp-content/uploads/2024/09/2024091402342772.png)
概要
WooCommerceの商品詳細ページに商品の仕様や属性を追加することは、ユーザーエクスペリエンスを向上させる素晴らしい方法です。WooCommerceのビルトイン属性機能を使えば、基本的な情報を追加するのは簡単です。より複雑なフィールドやカスタマイズされた表示が必要な場合は、ACFプラグインや専用のWooCommerce拡張プラグインを使用することで実現できます。これらの方法によって、商品の特性に合わせて柔軟に情報を表示することができ、コンバージョン率と顧客満足度を高めることができます。
お問い合わせ |
---|
記事が読めない?無料でお答えします!個人サイト、中小企業サイトのための無料ヘルプ! |
① 電話:020-2206-9892 |
② QQ咨询:1025174874 |
三 Eメール:info@361sale.com |
④ 勤務時間: 月~金、9:30~18:30、祝日休み |
この記事へのリンクhttps://www.361sale.com/ja/19813
この記事は著作権で保護されており、必ず帰属表示を付けて複製してください。
コメントなし