HELP NEEDED!! Testimonial Icons Swap? Any Help Will Be Appreciated!

TumaDor
Excursionist
12 2 2

Hi Shopify Community, 

I was attempting to replace the icons in the testimonials section, and ran into an issue of the image size being restricted. The default icons are quotation marks and stars, so I was trying to upload my own image instead.

TumaDor_0-1632376112395.png

TumaDor_1-1632376112408.png

 

I tried to make the background-size as small as possible, and made sure the image had the same px, but the issue was still there. Lastly, if needed, this is the code I edited to try to upload the image: Many thanks !!

 

{%- if block.settings.icon == 'quote' -%}
                <span class="quote-icon"><svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-quote" viewBox="0 0 41 35"><path d="M10.208 17.711h6.124v16.332H0V21.684C0 8.184 5.444.956 16.332 0v6.125c-4.083 1.14-6.124 4.414-6.124 9.82v1.766zm24.498 0h6.124v16.332H24.498V21.684C24.498 8.184 29.942.956 40.83 0v6.125c-4.083 1.14-6.124 4.414-6.124 9.82v1.766z" fill="#000" fill-rule="evenodd"/></svg></span>
              {%- elsif block.settings.icon == '5-stars' -%}
                <span class="testimonial-stars">★★★★★</span>
              {%- elsif block.settings.icon == '4-stars' -%}
                <span class="testimonial-stars">‎</span>
              {%- elsif block.settings.icon == '3-stars' -%}
                <span class="testimonial-stars">★★★</span>
              {%- elsif block.settings.icon == '2-stars' -%}
                <span class="testimonial-stars">★★</span>
              {%- elsif block.settings.icon == '1-star' -%}
                <span class="testimonial-stars">★</span>
              {%- endif -%}

 

 

0 Likes

@TumaDor ,

Hello,
Welcome to the Shopify community!
Share your store url with password.

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes
TumaDor
Excursionist
12 2 2

Hi, thanks for responding! Here is the info you requested:

Store URL:

zurainelx.myshopify.com

Password:

ilyaga

0 Likes

Hi @TumaDor ,

See screenshot, like this you want ?

oscprofessional_0-1632392956936.png

 

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes
TumaDor
Excursionist
12 2 2

Yes, that is what I am looking for. Just for the flag to not have a restricted size like the current one shows on the store. I can't see the flag icon too well, but as long as it's the full image, perfect 

0 Likes

@TumaDor ,

If you reduce the size then image quality will destroy. create new image with small size in HD quality.

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes

@TumaDor ,

I have adjusted this size only

oscprofessional_0-1632396022738.png

try to decrease it.. 30 to 35

 

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes