How do I remove the blog post title from the header image and put it in the text?

Hello, our theme automatically puts the blog post title in a overlay over the header image, I would like to remove that and add it as a heading in the text. I know I could use display:none; to remove the title over the image and manually add an H1 as the title in the text, however we have loads of blog posts and I want something that will work across the board without having to go back and manually add the titles for all past blog posts.

Thanks-

1 Like

@Lauren_Brooke

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

1 Like

Thank you, here is an example of one of our blog posts, we want the title at the top of the text instead of as an overlay on the image.

https://www.laurenbrookecosmetiques.com/blogs/blog-posts/5-colour-stick-secrets-for-a-gorgeous-look

Michele

@Lauren_Brooke

thanks for details

  1. Go to Online Store->Theme->Edit code
  2. Asset->/main.scss.liquid->paste below code at the bottom of the file.
#shopify-section-template-article .flexible_block__overlay h1 {display: none;}
1 Like

Thank you, this removes the title from the header but doesn’t add it to the top of the blog post as a heading.

Michele

@Lauren_Brooke

do you mean like this?

1 Like

Thanks so much, yes that definitely looks better, I was imagining it as a header in the text, so like this:

[image]

# 3 Secrets for a Gorgeous Colour Stick Look

Creamy multi-sticks...

But as you had it looks nice too. Thank you!

1 Like

@Lauren_Brooke

thanks or confrim yes is possible to change backend code and new custom code if you need this can you please share store details on personal message so we have discuss

1 Like