Shopify forms popup button help

Start a Business

Topic summary

A user is trying to customize the appearance of a Shopify Forms popup button (specifically a yellow “10% discount” button) but CSS code isn’t working as expected.

The Problem:

  • Standard CSS targeting .shopify-form-teaser fails to modify the button’s styling
  • This appears to be a recurring issue, as another user posted the same question on March 3, 2025 without receiving a working solution
  • Neither direct CSS injection nor JavaScript injection methods are producing results

What’s Been Tried:

  • CSS code targeting background color, text color, border, padding, and font size
  • The provided code snippet modifies the teaser container but doesn’t affect the actual button element

Current Status:
The issue remains unresolved. The user is seeking help from anyone who knows how to properly target and style this specific Shopify Forms button element. An image showing the yellow button in question has been attached for reference.

Summarized with AI on October 28. AI used: claude-sonnet-4-5-20250929.
1

Hello guys so, some one posted this question over here on 03-03-2025 but did not get any working answer. I will post a link to that post here. I am now encountering the same issue on my shop where i installed forms to create my pop-up, but no matter what CSS code i put in there or inject into the java script it still does not seem to work. The yellow 10% discount yellow button is what i wan tot target. The other code that the other person gave does not work, this is the code they gave :

If anyone knows how to edit this button layout i will be very grateful thanks!

Screenshot 2025-05-09 133555.png
Screenshot 2025-05-09 133555.png1086×208 31.8 KB

2

this is the code they gave :

.shopify-form-teaser {
background-color: #f0f0f0; /* Replace with your desired background color /
color: #333; / Replace with your desired text color /
border: 1px solid #ccc; / Adjust border color as needed /
padding: 10px; / Adjust padding for spacing /
font-size: 14px; / Adjust font size as needed */
}