WooCommerce の現在の商品に対してサイドバー項目をアクティブにする方法

WooCommerce の現在の商品のアクティブなサイドバー項目

WooCommerce 商品詳細ページにサイドバーを追加することは、ユーザー エクスペリエンスを向上させる 1 つの方法です。ただし、現在の製品を識別し、それに応じて「アクティブな」クラスを表示するという課題が発生する可能性があります。

現在の製品 ID を取得する

「」を追加するにはactive" クラスをサイドバーで現在選択されている製品に追加するには、現在の製品の ID を取得する必要があります。 WooCommerce 3.0 より前のバージョンでは、次のコードを使用して製品 ID にアクセスできました:

echo get_the_ID();

ただし、WooCommerce 3.0 以降では、次の変更されたコードを使用する必要があります:

global $product;
$id = $product->get_id();

このコードは、グローバル $product 変数を使用して製品にアクセスし、get_id() を使用してその ID を取得します。

「アクティブ」クラスの追加

現在の製品 ID を取得したら、それをサイドバーの製品 ID と比較して、一致する場合は「アクティブ」クラス。以下に例を示します。

このコードは、前に取得した製品 ID ($id) と現在のサイドバー項目の ID ($li) を比較します。一致する場合、「アクティブ」クラスを

に追加します。

このコードを実装すると、WooCommerce テーマで現在選択されている製品に対応するサイドバー項目の「アクティブ」クラスを効果的に表示できます。

以上がWooCommerce の現在の商品に対してサイドバー項目をアクティブにする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。