Full Size Image in Blog Post

Solved
kkredo
Excursionist
25 0 14

Hello,

 

I am trying to have some full width images in my blog posts. Even when I set the image to the max 2048 x 2048 size the image has lots of padding on both sides. I would like to image to take up the entirety of the page.

 

Is this something that I can do in CSS, if so how?

I want the second image of the guy holding the fish to be full width and take up the whole screen.

 

Thank you!

 

https://imzaph5qd8cjuo1v-55048011927.shopifypreview.com

KetanKumar
Shopify Partner
17277 1871 6459

@kkredo 

yes, please try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme--async.css ->paste below code at the bottom of the file.
this code apply for after 5 - 6 second

.featured-blog--grid {max-width: 100%;}
@media only screen and (min-width: 768px) {
.featured-blog--item {
    width: calc(100% / 1);
    padding: 0;
}
}

 

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 Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
kkredo
Excursionist
25 0 14

Hi @KetanKumar ,

 

Thank you for reaching out. I tried the code you sent me and it did not do anything to my image. Is there something I did wrong or maybe something else I can try?

 

Thanks!

0 Likes
KetanKumar
Shopify Partner
17277 1871 6459

@kkredo 

if possible to give me your rough idea how do you have like so i will give your proper code

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 Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
kkredo
Excursionist
25 0 14

Hi @KetanKumar ,

 

Basically I would like to be able to resize some of the images in my blog to take up the entire screen.

For example the first image on my blog is fine, but I would like the second image of the man holding the fish to be full width.

https://www.fasthouse.com/pages/fasthouse-ducati-scrambler-mint400

This page I attached a link to has the look I am trying to create. A mix of full width images along with smaller images. However even when I upload the largest photo size onto shopify theme builder they still are not full width.

 

Thank you!

 

https://kredoart.myshopify.com/blogs/news/bass

KetanKumar
Shopify Partner
17277 1871 6459

@kkredo 

thanks, can you please add this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.
this code apply for after 5 - 6 second

article.page-width {
    max-width: 100%;
    padding: 0;
}
.template-article .main-content .medium-up--push-one-twelfth {
    left: 0;
    width: 100%;
}

 

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 Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
kkredo
Excursionist
25 0 14

@KetanKumar 

Thank you for sending that however it did not do anything to my page.

0 Likes
KetanKumar
Shopify Partner
17277 1871 6459

@kkredo 

can you please add me staff account so i will check and fix 

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 Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
kkredo
Excursionist
25 0 14

@KetanKumar 

 

Here is a request code for you:

6901

0 Likes
KetanKumar
Shopify Partner
17277 1871 6459

@kkredo 

i have sent please check

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 Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes