Trust indicator icon SVG codes

[Alluren]

Hello,

Is it possible to change the size of the trust indicator icon? For example on my home page I have added SVG codes for icons but would like them to be a bit bigger.

Website preview: https://q1oabhq17lm3sapn-80707387720.shopifypreview.com

SVG codes below:

1. Shipping & returns icon:

<?xml version="1.0" encoding="utf-8"?><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewbox="0 0 122.88 74.34" style="enable-background:new 0 0 122.88 74.34" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve"><style type="text/css">.st0{fill-rule:evenodd;clip-rule:evenodd;}</style>
<g><path class="st0" d="M94.42,18.73l-17.98-0.1V6.53c0-1.8-0.73-3.43-1.92-4.61C73.34,0.73,71.71,0,69.91,0H20.07 c-1.8,0-3.43,0.73-4.61,1.92c-1.18,1.18-1.92,2.81-1.92,4.61c0,0.98,0.79,1.77,1.77,1.77c0.98,0,1.77-0.79,1.77-1.77 c0-0.82,0.34-1.57,0.88-2.11c0.54-0.54,1.29-0.88,2.11-0.88h49.84c0.82,0,1.57,0.34,2.11,0.88c0.54,0.54,0.88,1.29,0.88,2.11v55.41 h-9.98c-0.98,0-1.77,0.79-1.77,1.77c0,0.98,0.79,1.77,1.77,1.77h11.75c0.98,0,1.77-0.79,1.77-1.77v-2.01h10.68 c0.81-18.42,27.26-20.96,29.95,0h5.81l-1.79-19.22l-19.07-7.3L94.42,18.73L94.42,18.73z M2.65,37.54c-1.47,0-2.65-0.8-2.65-1.78 c0-0.98,1.19-1.78,2.65-1.78h23.89c1.47,0,2.65,0.8,2.65,1.78c0,0.98-1.19,1.78-2.65,1.78H2.65L2.65,37.54z M8.12,27.96 c-1.1,0-1.99-0.79-1.99-1.77c0-0.98,0.89-1.77,1.99-1.77h18.43c1.1,0,1.99,0.79,1.99,1.77c0,0.98-0.89,1.77-1.99,1.77H8.12 L8.12,27.96z M10.65,18.38c-1.1,0-1.99-0.79-1.99-1.77c0-0.98,0.89-1.77,1.99-1.77h15.89c1.1,0,1.99,0.79,1.99,1.77 c0,0.98-0.89,1.77-1.99,1.77H10.65L10.65,18.38z M26.46,61.93c0.98,0,1.77,0.79,1.77,1.77c0,0.98-0.79,1.77-1.77,1.77h-6.39 c-1.79,0-3.42-0.78-4.61-2.01c-1.18-1.23-1.92-2.91-1.92-4.69v-13c0-0.98,0.79-1.77,1.77-1.77c0.98,0,1.77,0.79,1.77,1.77v13 c0,0.85,0.35,1.66,0.92,2.25c0.54,0.56,1.27,0.92,2.06,0.92H26.46L26.46,61.93z M44.46,50.37c-6.62,0-11.99,5.37-11.99,11.99 c0,6.62,5.37,11.99,11.99,11.99c6.62,0,11.99-5.37,11.99-11.99C56.44,55.74,51.08,50.37,44.46,50.37L44.46,50.37z M44.46,57.75 c-2.54,0-4.61,2.06-4.61,4.61c0,2.54,2.06,4.61,4.61,4.61c2.54,0,4.61-2.06,4.61-4.61C49.06,59.81,47,57.75,44.46,57.75 L44.46,57.75z M102.06,50.37c-6.62,0-11.99,5.37-11.99,11.99c0,6.62,5.37,11.99,11.99,11.99s11.99-5.37,11.99-11.99 C114.05,55.74,108.68,50.37,102.06,50.37L102.06,50.37z M102.06,57.75c-2.54,0-4.61,2.06-4.61,4.61c0,2.54,2.06,4.61,4.61,4.61 s4.61-2.06,4.61-4.61C106.67,59.81,104.61,57.75,102.06,57.75L102.06,57.75z M89.79,23.81l-8.93-0.1V35.2h14.97L89.79,23.81 L89.79,23.81z"></path></g></svg>

2. Secure online payments icon:

<svg xmlns="http://www.w3.org/2000/svg" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewbox="0 0 512 395.92"><path d="M30.98 0h441.51c17.03 0 30.93 13.9 30.93 30.93v165.61c-6.67-6.51-14-12.34-21.89-17.36v-26.67H21.94v170.91c0 7.16 5.91 13.07 13.06 13.07h246.34c2.59 7.62 5.87 14.94 9.72 21.89H30.98C13.95 358.38 0 344.49 0 327.45V30.98C0 13.9 13.9 0 30.98 0zm47.1 290.54c-7.12 0-12.89-5.78-12.89-12.9 0-7.11 5.77-12.89 12.89-12.89h117.28c7.12 0 12.89 5.78 12.89 12.89 0 7.12-5.77 12.9-12.89 12.9H78.08zm0-61.88c-7.12 0-12.89-5.77-12.89-12.89 0-7.12 5.77-12.89 12.89-12.89h35.08c7.12 0 12.9 5.77 12.9 12.89 0 7.12-5.78 12.89-12.9 12.89H78.08zm74.1 0c-7.12 0-12.89-5.77-12.89-12.89 0-7.12 5.77-12.89 12.89-12.89h25.55c7.12 0 12.89 5.77 12.89 12.89 0 7.12-5.77 12.89-12.89 12.89h-25.55zm66.7 0c-7.12 0-12.89-5.77-12.89-12.89 0-7.12 5.77-12.89 12.89-12.89h25.42c7.12 0 12.89 5.77 12.89 12.89 0 7.12-5.77 12.89-12.89 12.89h-25.42zm190.33-38.34c56.76 0 102.79 46.04 102.79 102.79 0 56.77-46.03 102.81-102.79 102.81-56.77 0-102.81-46.04-102.81-102.81 0-56.75 46.04-102.79 102.81-102.79zm-28.79 87.87 16.2 15.21 38.08-39.35c3.52-3.56 5.72-6.42 10.04-1.96l14.04 14.39c4.62 4.55 4.39 7.24.03 11.48l-54.16 53.91c-9.17 8.99-7.58 9.54-16.88.33l-30.99-30.83c-1.94-2.08-1.73-4.2.39-6.31l16.3-16.9c2.47-2.6 4.44-2.37 6.95.03zM21.94 69.15h459.54V35c0-7.15-5.91-13.06-13.06-13.06H35c-7.15 0-13.06 5.91-13.06 13.06v34.15z"></path></svg>

3. Here to help icon:

<?xml version="1.0" encoding="utf-8"?><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="122.88px" height="86.411px" viewbox="0 0 122.88 86.411" enable-background="new 0 0 122.88 86.411" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve"><g><path fill-rule="evenodd" clip-rule="evenodd" d="M83.298,8.182h25.469c7.763,0,14.113,6.351,14.113,14.113v24.907 c0,7.761-6.352,14.113-14.113,14.113H97.802c1.569,6.206,3.469,11.781,9.272,16.929c-11.098-2.838-19.664-8.576-25.952-16.929 h-1.895c-0.737,0-1.509-0.058-2.303-0.168c4.193-3.396,7.106-7.659,7.106-12.275V38.493c0.926,0.644,2.051,1.021,3.264,1.021 c3.164,0,5.73-2.566,5.73-5.729s-2.566-5.729-5.73-5.729c-1.213,0-2.338,0.377-3.264,1.02V13.535 C84.031,11.683,83.774,9.888,83.298,8.182L83.298,8.182z M57.055,28.881c-3.201,0-5.796,2.596-5.796,5.796s2.596,5.796,5.796,5.796 c3.2,0,5.796-2.596,5.796-5.796S60.255,28.881,57.055,28.881L57.055,28.881z M21.488,28.881c-3.201,0-5.796,2.596-5.796,5.796 s2.596,5.796,5.796,5.796s5.796-2.596,5.796-5.796S24.689,28.881,21.488,28.881L21.488,28.881z M39.271,28.881 c-3.201,0-5.796,2.596-5.796,5.796s2.595,5.796,5.796,5.796s5.796-2.596,5.796-5.796S42.472,28.881,39.271,28.881L39.271,28.881z M59,3.572H19.542c-8.785,0-15.971,7.187-15.971,15.971v28.184c0,8.783,7.188,15.971,15.971,15.971h12.407 c-1.775,7.022-3.924,13.332-10.493,19.156c12.558-3.211,22.252-9.704,29.367-19.156h2.145c8.783,0,22.002-7.187,22.002-15.971 V19.542C74.971,10.759,67.784,3.572,59,3.572L59,3.572z M19.542,0H59h0.005v0.014c5.386,0.002,10.27,2.193,13.8,5.724l-0.008,0.007 c3.536,3.539,5.731,8.422,5.732,13.796h0.014v0.002h-0.014v28.184h0.014v0.003h-0.014c-0.002,5.746-3.994,10.752-9.312,14.248 c-4.952,3.256-11.205,5.277-16.247,5.277v0.015h-0.002v-0.015h-0.404c-3.562,4.436-7.696,8.225-12.43,11.333 c-5.235,3.438-11.157,6.028-17.799,7.727l-0.003-0.012c-1.25,0.315-2.628-0.06-3.541-1.091c-1.302-1.472-1.165-3.721,0.307-5.023 c2.896-2.567,4.816-5.239,6.207-8.041c0.774-1.559,1.398-3.188,1.939-4.878h-7.702h-0.005v-0.015 c-5.384-0.001-10.269-2.193-13.799-5.723c-3.531-3.531-5.724-8.417-5.725-13.804H0v-0.002h0.014V19.542H0v-0.005h0.014 C0.015,14.263,2.126,9.466,5.541,5.952c0.062-0.073,0.127-0.145,0.196-0.214c3.531-3.531,8.417-5.724,13.804-5.725V0H19.542 L19.542,0z M105.57,28.056c-3.163,0-5.729,2.566-5.729,5.729s2.566,5.729,5.729,5.729c3.164,0,5.73-2.566,5.73-5.729 S108.734,28.056,105.57,28.056L105.57,28.056z"></path></g></svg>

[ZestardTech · Accepted solution]

Hi @Alluren 

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:

.section-trust-indicators__decorator svg {
width: 5.6rem!important;
height: 5.6rem!important;
}

[Alluren]

Perfect @ZestardTech . Thank you!

Are you able to tell me how to remove the button from the 'Secure online payments' trust indicator please?

[dws_pvt_ltd]

Hello @Alluren 

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code
Step 2: Search file base.css, theme.css, styles.css, custom.css, or theme.scss.liquid
Step 3: Insert the below code at the bottom of the file -> Save

@media screen and (min-width: 750px) {
	.section-trust-indicators .section-trust-indicators__decorator svg {
	  width: 6.4rem;
	  height: 6.4rem;
	}
	.section-trust-indicators .section-trust-indicators__decorator{
		border-radius: 0;
	}   
}
 

Looks fine.

Best Regards,
Dws_pvt_ltd

[Alluren]

Thank you

[dws_pvt_ltd]

Welcome. Let me know if I can help out further with this.

[Alluren]

Hi @dws_pvt_ltd ,

How are you? I am hoping you could help me fix my trust indicators please. Unfortunately when I have updated my theme the Trust indicators now do not appear to be in one line which each other. Are you able to help me with a code to make the text of the 3 trust indicators in line please?

As you can see in the image, the middle trust indicator 'secure online payments' is sitting lower than the rest.

Additionally, are you able to help me with a coding to add a 4th trust indicator?

You assistance would be greatly appreciated.

Kind regards,

Lauren

Preview:

[Alluren]

https://1p0at925cjkjsq57-80707387720.shopifypreview.com

[Team_OSC]

Hi @Alluren 

Go to Editor > Base.css > Paste the below code

@media screen and (min-width: 750px) {
    .section-trust-indicators__decorator {
        width: 10.4rem;
        height: 10.4rem;
    }
}
@media screen and (min-width: 750px) {
    .section-trust-indicators__decorator img, .section-trust-indicators__decorator svg {
        width: 6.6rem;
        height: 4.6rem;
    }
}
.section-trust-indicators__decorator {
    width: 7.8rem;
    height: 7.8rem;
}
.section-trust-indicators__decorator img, .section-trust-indicators__decorator svg {
    width: 7.8rem;
    height: 5.8rem;
}

Let me know if it's solved by like and mark my solution as accepted.

Regards

Team_OSC

[Alluren]

Thanks @Team_OSC , I have a solution above.