Shopify themes, liquid, logos, and UX
Hello,
I'm using a "Image with text" section to display a product comparison chart. However, the image is rendering too small despite it being native 1400x1167. I couldn't find a way to adjust this in the settings. Any ideas?
Solved! Go to the solution
This is an accepted solution.
@ryvolution,
1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.css and paste this at the bottom of the file:
[data-section-type="dynamic-image-with-text"] .module-inner,
[data-section-type="dynamic-image-with-text"] .module-inner img{
max-width: 1000px !important;
width: 100% !important;
}
You can change the 1000px to any other width you wish.
It's expected that the image looks somewhat blurry though, since they are resized in the code itself to be smaller.
This particular issue is a more complex and would require an actual developer taking a look into the theme and fix it accordingly, it's not something simple to guide through.
Kind regards,
Diego
sorry for that issue can you try this code
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.
#shopify-section-template--15179977654459__1637301895fb5cf73e img.feature-image {
max-width: 640px; /* chnage value as you like */
}
Hi KetanKumar,
Unfortunately, it doesn't seem to work.
I copied the code and pasted it at the bottom of the "theme.css.liquid" file as you suggested. Doesn't seem to change anything.
Any other ideas?
sorry but i can't see now this code you have removed!
This is an accepted solution.
@ryvolution,
1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.css and paste this at the bottom of the file:
[data-section-type="dynamic-image-with-text"] .module-inner,
[data-section-type="dynamic-image-with-text"] .module-inner img{
max-width: 1000px !important;
width: 100% !important;
}
You can change the 1000px to any other width you wish.
It's expected that the image looks somewhat blurry though, since they are resized in the code itself to be smaller.
This particular issue is a more complex and would require an actual developer taking a look into the theme and fix it accordingly, it's not something simple to guide through.
Kind regards,
Diego
awesome this worked out. Image could be slightly sharper as you mentioned, but totally workable.
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024