Gift Card Pro UI Extensions
Introduction
Gift Card Pro provides UI extensions, which allow for your staff and customers to easily view the gift cards associated with an order. To leverage the extensions, you must first add them to their respective pages via the Shopify Admin.
Extension Overview:
1) Admin UI Extension
- Added to Order page in Shopify Admin
- Allows staff to view the gift cards associated with an order
2) Customer Account UI Extension – Order Status Page
- Added to Customer Account storefront Order Status page
- Allows gift card purchasing customers to view and resend the gift cards associated with their order
3) Customer Account UI Extension – Orders Page
- Added to Customer Account storefront Order Status page
- Allows gift card recipient customers to view the gift cards received by the email associated with their account
How to Get Started:
Admin UI Extension
1. In the Shopify Admin, access Orders and click on an order to view it
2. Scroll down to the “App Blocks” section of the Order page, which is above the order timeline
3. Click “+ App Block” and add Gift Card Pro’s “Issued Gift Cards” app block

4. Pin the App Block to ensure it is always visible on the Order page

5. Now staff can easily view and access the gift cards associated with an order
Customer Account UI Extension
NOTE: Customer Account UI extensions are not available when using Shopify’s legacy customer accounts.
1. In the Shopify Admin, click Settings at the bottom left corner of the screen and access the “Checkout” tab
2. Click the “Customize” button beside your live checkout configuration

3. In the Checkout editor, click “Checkout” at the top center of the screen and change the selection to “Order status”

4. On the Order status page, select “Sections” at the top left of the page, click the “Add app block” button under “Order details” and select Gift Card Pro’s “Gift Card Status” app block

5. Save your Order status page configuration

6. Next, change the page selection to “Orders”

7. On the Orders page, select “Sections” at the top left of the page, click the “Add app block” button under “Order list” and select Gift Card Pro’s “Gift Card Status” app block

8. Save your Orders page configuration
