remove feature blog photo from blog post in baseline theme

Store Design

Topic summary

Users are experiencing an issue where featured images appear twice on individual blog posts in the Baseline theme—once as the featured image and again within the post content.

Proposed Solution:
One contributor suggested adding CSS code to hide the duplicate image by targeting specific classes. The code should be added to the bottom of the theme’s CSS file (base.css, style.css, or theme.css):

.col-span-12.relative.full-h.bg-scheme-background.p-2\:lg.p-4\:lg {
  display: none !important;
}

Mixed Results:

  • The original poster successfully resolved the issue by adding the code to the custom CSS editor within the page editor itself, rather than the theme file.
  • At least two other users reported the CSS solution did not work when applied to their Baseline theme’s CSS files.

Current Status:
The discussion remains open with users seeking alternative solutions specifically for the Baseline theme, as the CSS fix appears inconsistent across different implementations.

Summarized with AI on November 10. AI used: claude-sonnet-4-5-20250929.
1

I’ve been trying to do this for hours in the code and cannot find a solution for the featured image repeating itself twice when clicking into a blog post. Can someone help.

example:

https://public-land-store.myshopify.com/blogs/news/charlotte-beaverss-2024-risograph-calender

1 Like
2

Hello @nitsua81

Is it possible to check the code you have for the blog post. Can I have access? Let me know here.

Thanks

1 Like
3

Hi @nitsua81

Do you mean the 1st image? If it is check this one.

  • From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  • Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  • In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
.lg\:col-span-12.relative.full-h.bg-scheme-background.p-2.lg\:p-4 {
    display: none !important;
}

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

1 Like
4

Hello @nitsua81

If possible can I have your store access ONLY FOR CODE EDITOR and I will fix the issue for you.

For confirmation you don’t want the first image appearing on the blog post right?

I am not able to reply to your mail if possible please email your whatsapp.

Thanks

1 Like
5

Screen Shot 2023-12-05 at 11.21.11 AM.png
Screen Shot 2023-12-05 at 11.21.11 AM.png2014×548 133 KB

didn’t do anything when inserted at the bottom of Theme.css?

6

Thank you. I ended up adding that code into custom thmee css on the actual page editor and it worked :smiley:

1 Like
7

Hello, I’m having the same issue, I copied the code and paste in theme.css but it doesn’t work. I’ve also copied it in the blog post css style editor and it doesn’t work.

Please help!

8

Hello, I’m having the same problem however when I copy and paste the code it doesn’t work. Is there any other solution for baseline theme?