Please let us know how this article can be improved.
Choose all that apply.*
Report a bad link
Out of date (instructions or screenshots)
Missing detail
Other
Button Settings in the floating cart
Learn how to edit font type and colors for the buttons that appear in the floating cart.
Jun 20, 2024
Article ID: SLN18989
You can customize the appearance of the Checkout and Apply buttons displayed in your floating cart. These settings are located in the Button Settings section of the Customize Appearance tab.
Primary Buttons - These settings control the appearance of the Checkout button displayed in your floating cart. The button color you select should have high contrast against the floating cart background color, for easy visibility and use by customers.
Secondary Buttons - These settings control the appearance of the Apply buttons displayed in the Shipping Calculator and Coupon/Promotion Code sections of your floating cart.
Locate the Button Settings section near the middle of the page.
Select font types and colors, and background colors for your primary (Checkout) and secondary (Apply) buttons. Font types can be selected using the Type pull-down menu. Colors can be selected in one of two ways:
Click on the color swatch and select a color from the color palette.
Or enter a hexadecimal value for the color you wish to use. For example, if you would like your primary button font color to be dark gray, you could enter the hexadecimal value for dark gray, which is 333333.
Once you've made changes to the font type and color selections, click the Save & Preview button to save and preview your changes. Previewing your changes before publishing is recommended.
Once you've finished making font type and color selections, publish your changes.
Note: Buttons displayed in the Styles and Colors Preview module include a beveled border. The beveled border does not appear for buttons on your live store. This is a known issue that is currently being investigated.
Button settings may also be customized using custom CSS. This is an advanced option, recommended only for developers or merchants familiar with CSS.