Frontend Development

App adds custom properties to line item in order to identify scheduled gift card product. Our app block (added through Shopify Theme Customizer) does that automatically for you, however it is also possible to add this line item fields manually in code editor.

This might be helpful if you want to add additional fields for scheduling gift card anywhere outside product page (for example on collection grid item). Also if your theme does not support App Blocks - you might add these properties manually on product page.

For a gift card product to be automatically scheduled you need to include one line item property named:

_gcp_checksum

The value of the property is a base64 encoded string of properties, i.e:

eyJnaWZ0X29wdGlvbiI6dHJ1ZSwic2NoZWR1bGVkX2F0IjoiMjAyNS0wMy0yN1QxMzoyMiIsInRpbWV6b25lIjoiRXVyb3BlL1JpZ2EiLCJzZW5kZXJfbmFtZSI6Ik1hdGV1c3oiLCJyZWNpcGllbnRfZW1haWwiOiJtYXRldXN6QGNvZGU1Ny5wbCIsIm1lc3NhZ2UiOiJUZXN0In0=

Decoded json:

{
  "gift_option": true,
  "scheduled_at": "2025-03-27T13:22",
  "timezone": "Europe/Warsaw",
  "sender_name": "John",
  "recipient_email": "[email protected]",
  "message": "Happy Birthday"
}

You can use following one-liner to create encoded value for _gcp_checksum :

let giftCardProperties = {
  "gift_option": true,
  "scheduled_at": "2025-03-27T13:22",
  "timezone": "Europe/Warsaw",
  "sender_name": "John",
  "recipient_email": "[email protected]",
  "message": "Happy Birthday"
}
const checksum = btoa(unescape(encodeURIComponent(JSON.stringify(giftCardProperties))))