Guarantee icons can aid in acquiring the trust of customers. It improves the credibility of the site and the customers will feel secure that their personal and financial information will not be shared or stolen. Changing the colors of the guarantee icons and aligning them with the website theme will define the mood of the visitors and will most likely augment conversions.

Tip:

You may change the guarantee icon color according to your preference. You may use either hex-decimal code or color name.

STEP 1. Under Sales Channels, select Online Store.

STEP 2. On the right portion of the page, click on Customize.

STEP 3. Located on the bottom part of the sidebar menu, tap Theme actions.

STEP 4. Tap Edit Code.


STEP 5. Go to Assets folder and select theme.scss.liquid

STEP 6. Here is an example code that you may paste at the bottom in a new line:

p.guarantee-icon { color: red}
h5.guarantee-title { color:red}


You have an option to use hexadecimal for color codes

p.guarantee-icon { color: #ff0000}
h5.guarantee-title { color:#ff0000}

Tip:

You can pick a color using online HTML color picker tools: https://www.w3schools.com/colors/colors_picker.asp

Did this answer your question?