• Resolved adempozhari

    (@adempozhari)


    hello

    I’m trying to change the name of the “Red” filter option (one of my tags) to an icon, but I’m having no luck with the hooks I’ve found. I’m not great with coding, so I might be missing something simple.

    I’ve tried a few hooks like yith_wcan_term_name, woocommerce_layered_nav_term_html, and some others, but none of them worked.

    What might be the right hook for that?

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Support Vanesa

    (@vanesarodriguez)

    Hi there!

    You can try to achieve it by CSS:

    .yith-wcan-filter [data-term-id="58"] .term-label {
    visibility: hidden;
    position: relative;

    }
    .yith-wcan-filter [data-term-id="58"] .term-label:before {
    content: "\2605";
    font-size: 24px;
    visibility: visible;
    color: #ffc100;
    }

    In this case you should target the exact label with the specific data-term-id: [data-term-id=”58″], which you should change for yours.

    Please, try it and let us know.

    Thread Starter adempozhari

    (@adempozhari)

    hi,,, yes it works perfectly. i was able to change all my color tags text like “Red” to a nice gradient icon….

    later I found out the plugin also has an option to assign a color swatch to any tags as filter type and its better because i can show the swatches in 4 columns ??.

    You may ask why all the struggle with codes without checking all plugins filter types and options!? Because of ChatGPT suggestion to use Yith filter with additional code in CSS!

    anyway i will use CSS code again to have nice gradient swatch and the below code works

    /* red*/
    a[data-term-id=”573″] .color-swatch {
    background: linear-gradient(to bottom right, #FFFFFF , #FF0000 , #BF0000);

    I need the gradient because i have the gold and silver which cant be shown in plain color swatch

    Thank you for your help.

Viewing 2 replies - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.