Change Product chevron icon + add icon to "view all"

Hi.

I would like to change the cheron icon to the vertical product cards.

I have tried to reproduce the process in Adding a Custom Icon to FAQ Accordion Cards
However i do not manage to change it.

Based on what indicated in the article, I have chenger the product card in line 96-100 to

Could you advice what to do?

Similarly I would like to add a chevron icon to the “view all” tag in each vertical.

What do you recommend to do it?

Thank you.

Lucas B.

Hi Lucas,

The Community post you linked applies to FAQ accordion card since it uses the chevron for the row expand by default. To change the icons that appear next to CTAs such as on product cards, update the iconName or iconUrl property as described in the Data Mappings & CTAs unit.

Can you clarify what you’re looking for on adding a chevron icon to the View All link? There is a chevron icon by default.
image

Hi Kirsty.

They want to have their icon
image
They have provided the url for it.

Lucas B.

Hi Lucas,

In order to change the View All icon, you’ll need to override the theme by going to Tools > Jambo Commands > Override Theme. The file(s) you’ll want to override are answers-hitchhiker-themes > universalsectiontemplates > standard.hbs and the grid-two-columns.hbs or grid-three-columns.hbs if you’re using those files in your experience as well.

In the newly created theme override files, you can then change “iconName” to “iconUrl” similar to what Micaela did for FAQ accordion cards in the link you provided. It will look something like this:

 <div class="HitchhikerResultsStandard-viewMoreLabel">{{_config.viewMoreLabel}}</div>
 <div data-component="IconComponent"
      data-opts='{"iconUrl": "https://www.brandname.com/themes/simple/images/arrow-down.svg"}'
      data-prop="icon">
    </div>

Since you are overriding the theme, make sure to pay attention to this file any time you upgrade your theme. You’ll most likely want to pull the new file in the theme upgrade and make this change again.

2 Likes

Thank you Kisty. That did the trick.

Lucas B.