サポート » 使い方全般 » ウィジェットに画像を表示する方法

ウィジェットに画像を表示する方法

  • okkun

    (@okkun)


    3年前

    Webサイトの開発に携わっていらっさる方にご質問です。

    Webサイト開発の依頼を受けたクライアント様から、「ウィジェット（ショップサイドバー）のカテゴリーの各文章の横に画像をつけて欲しい」との依頼を受けました。

    具体的には、以下のイメージのようにショップサイドバーのカラー文字の横に円形のカラー画像を挿入したいと考えております。ただし、「商品を属性で絞り込む」のウィジェットを利用することを前提で実装したいと考えております。

    ⬇︎ショップサイドバーのイメージ

    カラー
    ー
    ブラック（丸い形の色画像）
    レッド（丸い形の色画像）
    ブルー（丸い形の色画像）

    上記のように、「商品を属性で絞り込む」のウィジェットを利用する前提で、ショップサイドバーの文字列を「文章＋画像」に変更する方法をご存知の方がもしいらっしゃればご教示よろしくお願い致します。

1件の返信を表示中 - 1 - 1件目 (全1件中)
  • ishitaka

    (@ishitaka)

    3年前

    こんにちは

    woocommerce_layered_nav_term_html や woocommerce_layered_nav_count フィルターフックで、各項目の HTML を変更することができます。

    例:

    add_filter( 'woocommerce_layered_nav_count', function( $html, $count, $term ) {
	return '<span class="layered-color-' . esc_attr( $term->slug ) . '"></span> ' . $html;
}, 10, 3 );
1件の返信を表示中 - 1 - 1件目 (全1件中)
  • トピック「ウィジェットに画像を表示する方法」には新たに返信することはできません。

トピックタグ

表示