Buy buttons block (Product)

Setting Description
Show quantity Enable to display the quantity input field on the product page.
Add to cart button style

Choose the button’s appearance:

  • Primary: The main button style. It uses the primary color from your color scheme. You can choose to fill it with the background color or display it as an outline if the background is set to transparent.
  • Secondary: A secondary action style, using the secondary color from your color scheme. Like the primary button, it can be filled or outlined depending on the background settings.
Add to cart button icon

This setting lets you add a small visual indicator to your button.

  • None: The button displays only the text, with no icon.
  • Dot: A small dot appears before the button label.
Show dynamic checkout buttons Displays dynamic checkout buttons (PayPal, Apple Pay, etc.)
Dynamic checkout button style

Choose the button’s appearance:

  • Primary: The main button style. It uses the primary color from your color scheme. You can choose to fill it with the background color or display it as an outline if the background is set to transparent.
  • Secondary: A secondary action style, using the secondary color from your color scheme. Like the primary button, it can be filled or outlined depending on the background settings.
Dynamic checkout button icon

This setting lets you add a small visual indicator to your button.

  • None: The button displays only the text, with no icon.
  • Dot: A small dot appears before the button label.
Show gift card recipient form This setting enables the display of a recipient information form specifically for gift card products. Customers can choose to send the gift card directly to a recipient, along with a personalized message.

Dynamic checkout buttons

Using the payment methods available on your store, customers see their preferred option, like PayPal or Apple Pay. Learn more


There are two different kinds of dynamic checkout buttons:

  • Unbranded — These buttons display Buy it now text. When a customer clicks an unbranded button, they skip the cart and go to the Shopify checkout.
  • Branded — These buttons show the logo for a third-party accelerated checkout method. When a customer clicks a branded button, they complete their payment with that accelerated checkout method. The following third-party accelerated checkout methods are available:

Only the payment methods that you've activated in your payment settings display as options to your customers. If you don't have a third-party accelerated checkout method activated, then only the unbranded button is displayed.


Example of unbranded dynamic checkout button:


Example of branded dynamic checkout button:


Recipient information form for gift card products

Actions:

  1. Gift Card Denominations: Select the Gift Card Amount from the dropdown list.
  2. Checkbox Interaction: Click on the checkbox to reveal the recipient information form.
  3. Form Completion: Fill out the form with the recipient's email address, recipient's name, your personal message, and select the desired delivery date for the gift card.
  4. Add to Cart: Click the “Add to Cart” button after completing the recipient information form.
  5. Cart Drawer Navigation: Once the Cart drawer appears, you have the option to proceed directly to the checkout process.
  6. Checkout Details: Complete the necessary information during the checkout process to finalize the order.
  7. Order Confirmation: After successfully placing the order, an order confirmation will be displayed.
  8. Order Tracking: To track your order and access your order history, navigate to the login section in the header. Enter your login credentials and access your account dashboard to view your orders.


Product notes


Setting Description
Enable product notes Enable notes to be displayed on the product page. After enabling this option, customers will see a note field where they can enter important information. The note will be visible to the seller in the order details, under the related order, as a message displayed below the product card.
Notes heading Enter the heading title for the product notes section. You can also make the heading a link. In the demo store, it is used to link to the gift box page.
Preset

Choose preset style for the Notes heading.

In Theme Settings → Typography → Fonts, you can set font settings for Heading, Subheading, Caption, and Paragraph.

  • H5-H6: This style allows you to select a heading level from H5 to H6 and customize it using the options below.
  • Subheading: This style is used for text that appears below a main heading, typically smaller or less prominent than the heading, but still visually distinct from body text.
  • Caption: This style is used for short supporting text, such as labels or annotations.
  • Paragraph: This style is used for standard body text.
Color

Choose color for the Notes heading.

Each color scheme includes Heading, Text, and Accent color settings. Use this dropdown to select which color to apply. The available options may vary depending on the selected block color scheme.

  • Heading
  • Text
  • Accent

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us