Shopify themes, liquid, logos, and UX
Hello. I want to add a custom icon section to my store, just like the example Ive attached. What would the coding be for this?
Yes,
sure I will help you to add the icon. please share your Website Url and if included the password.
Thank you
Hi @ZaDu
follow this:
1. open theme editor and add "custom content" section, then add "custom HTML" section withing section.
2. add this html code:
<div class="product-reasons">
<ul>
<li>
<img src="//cdn.shopify.com/s/files/1/0009/0266/0159/t/6/assets/topreasons_2_image_150x.png">
</li>
<li>
<img src="//cdn.shopify.com/s/files/1/0009/0266/0159/t/6/assets/topreasons_2_image_150x.png">
</li>
<li>
<img src="//cdn.shopify.com/s/files/1/0009/0266/0159/t/6/assets/topreasons_2_image_150x.png">
</li>
<li>
<img src="//cdn.shopify.com/s/files/1/0009/0266/0159/t/6/assets/topreasons_2_image_150x.png">
</li>
</ul>
</div>
Change image to your images,
3. Add this css in Asset->theme.scss or theme.css file at bottom:
.product-reasons ul{list-style:outside none none;margin:0;padding:0;}
.product-reasons{text-align:center;}
.product-reasons ul>li{display:inline-block;margin-right:5px;width:95px;}
@media only screen and (max-width:480px){.product-reasons ul>li{width:18.5%;}}
Sorry when you say open theme editor, where abouts is that?
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024