We are using the new Klaviyo Back In Stock feature and I wanted to know if there was any way to add a border-radius to the submit button in the modal window? There are lots of other options that can be configured via the script, but nothing for this property.
modal: {
headline: "{product_name}",
body_content: "Get notified via email when this product is back in stock.",
email_field_label: "Enter your email address",
newsletter_subscribe_label: "Add me to your email marketing list.",
subscribe_checked: true,
button_label: "Notify me",
subscription_success_label: "Great, we will let you know when this is back in stock.",
footer_content: '',
additional_styles: "@import url('https://fonts.googleapis.com/css?family=Helvetica+Neue');",
drop_background_color: "#3a3532",
background_color: "#FFFFFF",
text_color: "#3a3532",
button_text_color: "#FFFFFF",
button_background_color: "#3a3532",
close_button_color: "#ccc",
error_background_color: "#fcd6d7",
error_text_color: "#C72E2F",
success_background_color: "#3a3532",
success_text_color: "#FFFFFF"
}
Page 1 / 1
Welcome to the community
To add a 10px radius (for example) around the ‘notify me’ button, you can add the following CSS to your Shopify theme CSS:
.klaviyo-bis-trigger {
border-radius: 10px;
}
However, adding a radius to the modal button requires some additional work to import a custom CSS fle. This is due to the pop-up being contained in an iframe. There’s a great post here on how to achieve this:
Hope that helps
Andy
Ideal - that should solve it. Loading in an additional stylesheet. Thank you for sharing.
No problem
Reply
Log in to the Community
Use your Klaviyo credentials
Log in with Klaviyo
Use your Klaviyo credentials
Log in with KlaviyoEnter your E-mail address. We'll send you an e-mail with instructions to reset your password.