Customizing the subscription widget
You can customize aspects of your subscription widget such as colors, fonts, and more.
Stores using the BigCommerce Checkout Integration do not have access to checkout settings in Recharge, as this is handled directly by BigCommerce. Refer to BigCommerce’s guide on Customizing the style of your checkout.
Platform:
- BigCommerce Checkout Integration
Add CSS to the BigCommerce subscription widget
You can add CSS to a BigCommerce theme by editing your theme files.
- Navigate to assets/scss/theme.scss in your theme files.
- Add custom styles to the bottom of theme.scss.
To learn more about editing a BigCommerce theme's CSS, see Theme Assets.
Adjust spacing on subscription selector
The following lists different ways you can adjust spacing for the widget:
- Increase
margin-top
andmargin-bottom
of the.rca-subscription-form
class to a desired amount to separate the widget from surrounding buttons. - Add
margin-bottom: 10px
to the.rca-subscription-form-buttons
class to adjust the height of the subscription frequency selector. - Add
margin-left: 0
to the.rca-subscription
class to move add-to-cart button left.
Updating the CSS for the widget in this method will provide additional padding around the widget, as seen in the following screenshot:
Updated 23 days ago