How can I spread out trust badges & text on footer?

Mang_Yu
New Member
2 0 0

This is how it looks like right now. I want the trust badges and text to be spread out evenly along the page width. Thank you.

Screen Shot 2021-03-18 at 12.35.15 AM.png

 

footer.liquid


<div class="product-reasons">
<ul class="res_ul">
<li>
<img src="image1 url"
width="120px" height="105.7px">
<span>FREE DELIVERY</span>
<p>For orders over $50</p>
</li>
<li>
<img src="image2 url"
width="120px" height="105.7px">
<span>15 DAYS RETURNS</span>
<p>No questions asked</p>
</li>
<li>
<img src="image3 url"
width="120px" height="105.7px">
<span>SECURE PAYMENT</span>
<p>100% Safe checkout</p>
</li>
<li>
<img src="image4 url"
width="120px" height="105.7px">
<span>24/7 SUPPORT</span>
<p>Dedicated support</p>
</li>

</ul>
</div>

theme.scss

.res_ul li span{display: block; font-size: 20px; font-weight: 600;}
.product-reasons ul{list-style: outside none none; margin: 0 auto; padding: 0; display: flex; max-width: 1050px;}
.product-reasons{text-align:center;}
.product-reasons ul>li{display: inline-block; margin-bottom: 10px; text-align: center; vertical-align: top;}
@media only screen and (max-width:480px){.product-reasons ul>li{width:45%;}.product-reasons ul{display:block;}}

0 Likes
sophiagarcia
Tourist
15 0 1

If your trust badges look cheesy or like they don't belong in the checkout,  Typically these services will give you either an image file (unlikely) or javascript  your site seal, and then paste this into a new text widget in your footer:  figure out how it's outputting that button as the template may be overridden.

 

I hope this answer will help!

0 Likes
Natztech
Shopify Partner
843 229 612

hello @Mang_Yu 

Please provide website url and if your store is password protected then also provide password So I will check and provide a solution here.

Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution

PageFly Advanced Page Builder- My favorite drag and drop page builder - Visit the Shopify app store
0 Likes