Add CSS to subscription elements

You can use CSS rules to adjust the look and spacing for the Recharge subscription widget. The following example explains one way to adjust widget spacing.

Adding CSS to BigCommerce

You can add CSS to a BigCommerce theme by editing your theme files.

  1. Navigate to assets/scss/theme.scss
  2. Add custom styles to the bottom of theme.scss

To learn more about editing a BigCommerce theme's CSS, see Theme Assets.

Increase spacing on subscription selector

  1. Increase margin-top and margin-bottom of the .rca-subscription-form class to a desired amount to separate the widget from surrounding buttons.
  2. Add margin-bottom: 10px to the .rca-subscription-form-buttons class to adjust the height of the subscription frequency selector.
  3. Add margin-left: 0 to the .rca-subscription class to move add-to-cart button left.

The widget should look like this:


Need Help? Contact Us