Shopify Native Gift Card Integration in Nyla

Creating a Gift Card Product

To begin, you’ll need to create a Shopify gift card product. This is handled entirely through Shopify and not through Nyla. Shopify provides a built-in gift card product type, and merchants can configure pricing, imagery, and availability directly inside the Shopify admin.
You can follow Shopify’s official steps here:

• Create and manage gift card products
  https://help.shopify.com/en/manual/products/gift-card-products

Once your gift card product is created, you can design the gift card page using Nyla and add blocks that support Shopify’s native gift-card-to-recipient functionality.

Send to Recipient Functionality

Shopify’s native gift card system allows customers to send a digital gift card directly to a recipient via email. To support this, Nyla provides a set of purpose-built blocks and requires a small amount of configuration to pass the correct recipient information through the order.

Gift Card Blocks

There are two block types provided in Nyla for this integration:

1. Gift card block (Shopify)
   This block allows customers to enter:

   • Recipient name

   • Recipient email 

   • An optional message

   • A delivery date (if desired)

   You can place this block anywhere on your gift card page. The block includes two buttons: a standard Add to Cart button and a second button that opens the “Send to Recipient” modal.
   
   

2. Recipient details (Shopify GC)
   After the customer selects a recipient and adds the gift card to cart, this block displays the recipient information inside the cart. It reads the line item properties added to the gift card product, so the customer has a clear view of whom the gift card will be sent to before checking out.
   
   

   
   The property you see used on the video to determine the layout visibility is: variant.product.productType (with curly brackes to each side as shown in the video)

These blocks are fully customizable in terms of styling and layout so they match the design of your store.

Line Item Properties Configuration

To send recipient data through Shopify’s checkout and fulfillment pipeline, you must configure a line item rule inside Nyla.

Shopify requires the following property to determine whether the gift card should be emailed to the recipient:

• _shopify_send_gift_card_to_recipient

This must be set as a line item property and given a value of "true"

In addition, the modal will collect the following properties (this is already configured):

• Recipient email

• Recipient name

• Message

• Delivery date (optional)
  
  

   

Once the rule is in place, Shopify will handle the rest, generating the gift card and sending it to the designated recipient when the order is fulfilled.