Re: Blog featured image is not centered

Solved

How can I center my blog's featured image?

annarudd303
Tourist
6 0 1

hi 

I am trying to centralize my blog featured image, but it is not happening. 

https://maximsports.com/blogs/news/aches-pains-5-herbs-to-get-your-body-flowing-again

How to make it center, when it says inline-block. 

Accepted Solutions (2)

Moeed
Shopify Partner
5371 1453 1739

This is an accepted solution.

Hey @annarudd303 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
.blog-post-detail .featured-image {
    text-align-last: center !important;
}
</style>

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

- Need a Shopify Specialist? Chat on WhatsApp

- Custom Design | Advanced Coding | Store Modifications


View solution in original post

Huptech-Web
Shopify Partner
930 187 196

This is an accepted solution.

Yes you can paste it in main CSS but as you can see the article.css article CSS is meant for articles page so adding the CSS on specific CSS file will maintain the proper CSS code and also easily manageable if you have any changes in the future.

If you found this response helpful, please do like and accept the solution. Thanks!
Need support with Customizing your Shopify store?
Feel free to contact me at [email protected] or Visit our website Huptech Web.
Instant Shortcode Builder: Integrate customizable UI features anywhere in your store - No coding knowledge required

View solution in original post

Replies 7 (7)

Huptech-Web
Shopify Partner
930 187 196

Hi @annarudd303 
You can add below CSS to article.css to make the image center aligned

.featured-image {
  text-align: center;
}

 

If you found this response helpful, please do like and accept the solution. Thanks!
Need support with Customizing your Shopify store?
Feel free to contact me at [email protected] or Visit our website Huptech Web.
Instant Shortcode Builder: Integrate customizable UI features anywhere in your store - No coding knowledge required
annarudd303
Tourist
6 0 1

Hi Rishi,
Thank you so much for the quick response, should I paste this on to the main CSS or different?

thank you

Huptech-Web
Shopify Partner
930 187 196

This is an accepted solution.

Yes you can paste it in main CSS but as you can see the article.css article CSS is meant for articles page so adding the CSS on specific CSS file will maintain the proper CSS code and also easily manageable if you have any changes in the future.

If you found this response helpful, please do like and accept the solution. Thanks!
Need support with Customizing your Shopify store?
Feel free to contact me at [email protected] or Visit our website Huptech Web.
Instant Shortcode Builder: Integrate customizable UI features anywhere in your store - No coding knowledge required
annarudd303
Tourist
6 0 1

Thank you Rishi. 
Your way also sort out the issue. 

Cheers

Moeed
Shopify Partner
5371 1453 1739

This is an accepted solution.

Hey @annarudd303 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
.blog-post-detail .featured-image {
    text-align-last: center !important;
}
</style>

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

- Need a Shopify Specialist? Chat on WhatsApp

- Custom Design | Advanced Coding | Store Modifications


annarudd303
Tourist
6 0 1

Thank you so much Moeed for this detailed guideline.

it sort out my issue.

cheers. 

Moeed
Shopify Partner
5371 1453 1739

Thank you for your reply. I'm glad to hear that the solution worked well for you. If you require any more help, please don't hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.

- Need a Shopify Specialist? Chat on WhatsApp

- Custom Design | Advanced Coding | Store Modifications