Solved

Resizing Image in "Image with text section" | Startup Theme

ryvolution
Tourist
7 0 3

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?

 

www.mycofi.co

 

Screen Shot 2021-11-19 at 10.41.10 AM.png

Stay Awesome
Accepted Solution (1)

diego_ezfy
Shopify Partner
2936 562 883

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

◦ Follow my blog & youtube for coding tutorials. Most questions in here are already answered there!
◦ Top #4 Shopify Expert, 24h reply. Click here to hire me.
Download copy/paste code snippets that can replace most apps.

View solution in original post

Replies 5 (5)

KetanKumar
Shopify Partner
36839 3635 11972

@ryvolution 

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 */
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
ryvolution
Tourist
7 0 3

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?

Stay Awesome
KetanKumar
Shopify Partner
36839 3635 11972

@ryvolution 

sorry but i can't see now this code you have removed!

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

diego_ezfy
Shopify Partner
2936 562 883

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

◦ Follow my blog & youtube for coding tutorials. Most questions in here are already answered there!
◦ Top #4 Shopify Expert, 24h reply. Click here to hire me.
Download copy/paste code snippets that can replace most apps.

ryvolution
Tourist
7 0 3

awesome this worked out. Image could be slightly sharper as you mentioned, but totally workable.

Stay Awesome