Success
Buy buttons
Customize the product buy area with checkout options, purchase details, and sticky buy behavior.
Use this block to control the main purchase actions on a product page. For a broader overview of how theme content is organized, see Shopify documentation on sections and blocks. Alongside the add-to-cart button, you can show faster checkout options, fulfillment details, payment cues, and a sticky buy bar that keeps key actions visible as shoppers scroll.
Core settings
Section titled “Core settings”These settings shape how much buying support appears around the primary button. A lean setup works well when products are simple and easy to decide on, while a more detailed setup can reduce hesitation for products that need extra context.
The button icon is a small visual enhancement for the main action. It can help the add-to-cart button stand out, especially when the product form includes several controls nearby.
Additional checkout buttons are useful when you want to shorten the path to purchase for ready-to-buy customers. If your page already has a lot happening around the product form, turning them off can keep attention on the main add-to-cart action.
Free shipping information, local pickup options, and payment icons help answer common pre-purchase questions near the button. Use them when they add clarity, but avoid stacking too many support elements if the purchase area starts to feel crowded.
The sticky bar on scroll is most helpful on longer product pages. It keeps purchase actions within reach when shoppers move past the initial buy area to read details, browse media, or compare information.
The gift card recipient option only applies to gift card products. When enabled, it adds the option to send the gift card by email to someone else.
Keep this block focused on decision-making and purchase actions. Enabling every available option can make the buy area feel busy and reduce the prominence of the main button.
Installment information is most useful for higher-priced products where payment flexibility can improve confidence. If that messaging is not relevant to your catalog or setup, leaving it off can keep the block cleaner.
Standard block settings
Section titled “Standard block settings”Color settings
Section titled “Color settings”This block uses your theme’s primary button styling unless you override it here. Use the color controls when the buy button needs stronger contrast, better visual alignment with the surrounding layout, or a custom hover state for this specific product area.
Keep the default and hover states visually connected so the button still feels like one consistent action. Check text, border, and background combinations carefully to preserve readability and prominence.
Visibility settings
Section titled “Visibility settings”Use visibility controls to show or hide this block on desktop or mobile. This is helpful when you are building different product-page layouts for smaller screens and larger screens.
If you hide the block on one device size, make sure the purchase path still appears clearly elsewhere on that layout.
Usage notes
Section titled “Usage notes”- Keep the buy area simple. Show the supporting details that help customers decide, and remove the ones that add noise.
- Use sticky buy on long pages. Enable the sticky bar when shoppers are likely to scroll well past the main product form.
- Match features to product type. Gift card recipient options fit gift card products, while installment messaging is more valuable for higher-priced items.
- Check button contrast. If you override colors, make sure the button remains easy to see and read in both default and hover states.
- Plan mobile and desktop separately. Review both viewport sizes when you use visibility controls, because the buy area can present differently across layouts.
- Keep form states readable. If your purchase area includes customer input, make sure empty, validation, and submitted states remain easy to scan, especially when multiple buy options are shown.