Skip to main content
All CollectionsGiving Widgets
Customizing widgets CSS
Customizing widgets CSS

How to customize your Shopify widgets using CSS styles.

Liam Houlahan avatar
Written by Liam Houlahan
Updated over a week ago
  1. From your Shopify admin go to your Theme > Customize > Theme settings > Custom CSS.

  2. In the Custom CSS field shown you will need to enter the CSS to style the widget that you would like to style.

  3. For each element you will need to target the element either by inspecting the element and / or using the ID of the widget. Below is a list of the IDs that you can use to select each widget you would like to style.

Widget

CSS selector ID

Donations banner (product page)

#pledger-banner

Customer donations

#customer_donations_widget

Impact calculator

#pledger-impact-banner

Once you have finished entering your styles into the Custom CSS field select [Save] (top right of screen) to save your custom CSS.

Did this answer your question?