How do I remove the inter box in “image with text overlay” in the Grid theme. I just want the background image and to be able to have the text white line the “Heading” and “Subheading”. I can’t find anywhere to remove it.
Topic summary
A user seeks to remove the text box overlay from the “Image with text overlay” section in Shopify’s Grid theme, wanting only the background image with white text visible.
Proposed Solutions:
-
CSS modification approach: Add custom CSS to theme.css file to hide the text box background while keeping text visible:
background: none !important;color: #fff !important;- Or use
display: none;to hide the entire text content section
-
Theme customizer approach: Remove text directly through Shopify Admin by navigating to Sales channels > Online Store > Customize, then clearing the Heading and Subheading fields in the Image with text overlay section.
Both methods target the .pxs-image-with-text element. The discussion remains open with multiple community members offering alternative solutions, though no confirmation of which approach worked has been provided.
Hello @finlayandgreen
You can try this code: it will be helpful to you
Go to the Online Store->Theme->Edit code->Assets->theme.css>Add this code at the bottom.
.pxs-image-with-text-subheading {
background: none !important;
color: #fff !important;
}
Hi @finlayandgreen you can do that by removing texts in Text field of “Image with text overlay” section in your store from Shopify admin > Sale channels > Online store > Customize
I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.
Please add this css in your bottom of the theme.css file:
.pxs-image-with-text-content {display: none;}
Regards,
San