Developer Tools¶

The Developer Tools page provides API access, webhook configuration, headless mode, and advanced integration options. Go to For Developers in the left navigation.

Developer tools

Storefront API¶

The Storefront API lets your custom storefront code interact with GiftCard Hero's gift card data.

Enable Storefront API — toggle on to activate API access
Disable gift card page animation — removes the CSS animation on the gift card display page; useful for headless or custom template implementations

Once enabled, your storefront can query gift card balance and status data via the Storefront API.

REST API¶

The REST API lets you integrate GiftCard Hero with external systems — CRMs, analytics dashboards, loyalty platforms, and more.

Enabling¶

Toggle Enable REST API to on. Then click Send me access token — GiftCard Hero sends the API access token to your store's admin email address.

A Postman collection download link is available on the page for quick API exploration.

Available endpoints¶

Method	Endpoint	Description
`POST`	`/api/external/gift-cards`	Create a gift card
`POST`	`/api/external/gift-cards/{id}/disable`	Disable a gift card
`GET`	`/api/external/gift-cards`	List gift cards (filterable by status)
`GET`	`/api/external/gift-cards/{id}`	Get a single gift card
`GET`	`/api/external/gift-cards/search?query=...`	Search gift cards by code or email
`PUT`	`/api/external/gift-cards/{id}`	Update a gift card
`PUT`	`/api/external/gift-cards/{id}/balance`	Update a gift card's balance

Webhooks¶

Webhooks configuration

GiftCard Hero can send HTTP POST requests to your server when specific gift card events occur.

Setting up a webhook secret¶

Click Generate Secret to create a signing secret. Use this secret on your server to verify that incoming webhook payloads are genuinely from GiftCard Hero — the signature is sent in the X-GiftHero-Signature header (HMAC-SHA256).

Click Regenerate Secret to rotate the secret if it has been compromised. Update your server to use the new secret after regenerating.

Webhook endpoints¶

Configure your server URLs for these three webhook types:

Webhook	When it fires
Order with gift card	An order containing a gift card product is created
Gift card payment	A gift card code is applied as payment at checkout
Gift card balance change	A gift card's balance is modified (top-up, redemption, or manual adjustment)

Enter your endpoint URL in each field and save.

Custom Code Editor¶

Add custom CSS and JavaScript to GiftCard Hero's storefront components without modifying your Shopify theme directly.

Click Open custom code editor to open the editor. It has separate tabs for CSS and JavaScript.

Custom code editor

Use the custom code editor to adjust widget appearance, integrate analytics tracking, or connect third-party tools.

Save Gift Card Data to Metafield¶

When enabled, GiftCard Hero writes gift card data to a Shopify metafield on the customer record:

Namespace: gift_hero
Key: cards_data

This allows you to read gift card information from Liquid templates or external integrations that can access Shopify customer metafields.

Disable gift card page animation for templates with suffix — when using a custom template suffix on your gift card product page, this option removes the animation for that template specifically.

Headless Mode¶

Enable Headless Mode for custom or headless Shopify storefronts that don't use Shopify's standard theme system.

Toggle Enable Headless Mode to on. A code snippet appears with placeholder values you replace with your store's specifics:

Placeholder	Replace with
`[MONEY_FORMAT]`	Your store's money format string
`[PRODUCT_ID]`	Your gift card product's Shopify numeric ID
`[MYSHOPIFY_DOMAIN]`	Your store's `.myshopify.com` domain
`[ADD_TO_CART_CALLBACK]`	Your custom add-to-cart JavaScript function
`[LOCALE]`	The active locale string (e.g., `en`, `fr`)

Copy the snippet and integrate it into your custom storefront codebase.

Custom Fulfillment¶

If you use a third-party fulfillment system, enable the custom fulfillment webhook to have GiftCard Hero send order data to your fulfillment endpoint whenever a gift card order is created.

Warning: Enabling custom fulfillment disables GiftCard Hero's automatic order fulfillment. Make sure your external system handles fulfillment before switching this on.

The badge at the top of this section shows the current status (Enabled / Disabled). Click the toggle button to switch.