Trouble Publishing Store Due to Custom CSS for Banner Heading

Technical Q&A
, ,

Topic summary

Issue: Store cannot be published after adding custom CSS to inject a banner heading via the ::before pseudo-element.

Details:

  • CSS used: .banner__heading::before { content: “WALL ART OPTIONS”; display: block; color: black; font-weight: bold; font-size: 80%; }
  • User tried multiple browsers and incognito; publishing still fails.
  • A screenshot of the intended heading was attached (image is illustrative of desired result).
  • Store URL was requested and provided: https://wallmarvel.com/

Key points raised:

  • Inserting text via CSS (::before with content) is discouraged in Shopify due to localization/translation issues and maintainability.
  • Suggested approach: modify the theme/section by adding actual HTML for the heading and expose it as a configurable setting in the section schema (Shopify’s JSON settings for theme sections).

Status:

  • No confirmed cause identified for the publishing failure.
  • No resolution yet; further troubleshooting or theme changes (HTML + schema setting) recommended.
Summarized with AI on January 6. AI used: gpt-5.
1

Hey, Having trouble publishing my store due to custom CSS for the image banner heading. Here’s the code I’m using

.banner__heading::before {
content: “WALL ART OPTIONS”;
display: block;
color: black;
font-weight: bold;
font-size: 80%;
}

I’ve also attached a screenshot of the heading that I’m trying to add. Despite applying this CSS, I’m unable to publish the store. Can anyone assist with troubleshooting this issue? I have tried different browser and incognito tab.

CSS for this
CSS for this1496×694 83.1 KB

2

Hi,

Can you provide your store url

3

Hi @harsh300969 . This is bad approach to add text value within css in shopify (localization issues). Why not just extend section with additional html and add setting to schema?

4

YEAH SURE,

STORE - https://wallmarvel.com/