Tutorial: Setting up your CardCraft App for your store

Vouchr

6 min readJan 26, 2023

This tutorial includes

Finish the Shopify App installation for Digital or Printable cards.
If you chose Printable, how to print it.
Deliver a Promotional Code with the greeting.
How to manage your greeting card content & create new ones

Finish Installation of the Shopify Greeting Card App for your store

Install the Greeting Card app in your Shopify Store

2. After you install you will be shown a Home screen like the one below.

Press the button to enable the app,
Choose whether you want to offer Digital or Printable greetings for your customers ,
Select a price if you are charging for the greetings

3. Follow this video to add the widget to your Cart and/or Product Page and configure settings like Promo Code, Colors, Logo.

Go to “online store / themes” then choose “Customize” next to the current theme. Choose the drop down menu at the top middle of the page and select “cart”. Choose “+add block” in the “Subtotal” section — select the App and drag it to the top of the section above the Subtotal price.

4. You will receive an email from team@vouchrsdk.com with a link to the content admin page, click it and sign in. Once you are signed in

Go here https://xo.cards/dashboard/applications/configuration You can change the text and style of the button for your store — watch the video

5. Inside each eCard, a call-to-action is automatically added to advertise your store to the recipient. See an example of a call to action below:

To change the call-to-action go here : https://xo.cards/dashboard/applications/merchant

To get started Choose the tile named “eCard” to edit it.

Choose eCard to edit the call to action the recipient sees

Edit the Button Link and Button Text so it points to your store, for example, change the button text to a call to action like “Shop for Gifts!” so when pressed the recipient is taken to your store. You can then change the Logo, Colours, and Message Title. See some examples screen shots below :

ADVANCED CONFIGURATION

You can add a button for the recipient to see their Tracking URL, or see the Order status in the Button Link or in any text field.

{
     "payment": {
          "redeem": {
                 "shopify_orderid": "123142355",
                 "shopify_status_url": "https://vouchr-gift-store.myshopify.com/55998251147/orders/c7728b57e0a1e2565e4e82363b32c1fe",
                 "shopify_tracking_url": "??",
                 "shopify_tracking_company": "UPS"
           }

}
}

For example, to let the recipient see Order Status, paste the below in the Button Link or a text field (which will display without a hyperlink).

{{voucher.payment.redeem.shopify_status_url}}

For more information read more here

PRINTABLE : If you selected Printable on the app page

Once someone chooses a greeting card to include with the order, you will see a link on your order page called “eCard Printable Url” in both the Notes section and Metafields section.

To enable Metafields please see the video how to enable Metafields here

Click or paste that link in your browser to print the card to include in the order.

On your order page, you will see a Printable url under Metafields and under Notes

The greeting card will display in your browser, then click “Print” see image below.

Then it will display in your print view, print the greeting card, then fold it on the lines and include it with the order box for shipping.

Print the card and include it in the box, when the recipient of the gift scans the QR code will deliver the comlpete digital experience.

DIGITAL : If you selected Digital on the app page

You should review the email template named “default” that are sent to deliver the eCard here https://xo.cards/dashboard/applications/email . Feel free to make any changes to the default email template and save them.

Example of “default” email template (for the recipient). You can change these.

As a precaution, go to Configuration and make sure Recipient Email is enabled with the “default” template.

Make sure you have enabled emails to recipient in Configuration (they should be enabled by default)

Check out this article for more tips about Configuring the Email Template.

Change the Product Name and Graphic

The system automatically will create a default product in your catalogue.

Find that produt and change the graphic and the name to something appropriate for your store.

IMPORTANT! Do not delete it, and do not make it unavailable or out of stock.

Add a Promotional Code for the Recipient

To add a Promotional Code so the recipient of the gift can use it to shop at your store,follow the 2 steps below:

Step 1 — Go to the Greeting Card Shopify App and add a promotional code that will work in your store — see image below

Add a promotional code for recipients to incentivize them to shop at your store

Step 2 — Go to https://xo.cards/dashboard/applications/merchant and select the ‘Shopify eCard’ merchant and you will be taken to the screen shown below. On that screen,

Choose Text Code in the Display format drop down at the bottom left of the screen (see at the bottom of the screen shot below)
Add text describing the what the promo code can be used for and save it!

Go back into the eCard merchant and add text to tell the recipient what the code is good for

The Promo Code will now display inside the eCard for the recipient to incentivize them to shop at your store and make a purchase!

ADVANCED: Rewriting the URL so promo code is automatically applied

If you want the unique promotional code to be applied automatically when they click the link, you can do this using Liquid syntax.

Specifically, change the Redirect Link to this replacing www.mysite.com with your own store address: https://www.mysite.com/?discount={voucher.payment.redeem.code}

More info on managing the dynamic text on the call to action card here

Manage & Create your own Greeting cards

Create your own greeting cards and manage pre-made default content read the tutorial here.

Manage pre-made messages

Go here : https://xo.cards/dashboard/quotes

Manage thank-you messages

https://xo.cards/dashboard/gratitude

Attach an Offer to each eCard

If you want to attach an additional offer for the recipient of each eCard

Make an offer here https://xo.cards/dashboard/offers

Build an offer that attaches to every eCard

Then go https://xo.cards/dashboard/applications/configuration and choose the offer you want to attach

On the configuration page select the offer you created to attach to every eCard

Multi-Languages

We support all languages that are found on Google Translate, out of the box. You can enable support for any language in your store, and our system will automatically translate them. Reach out to our support greeting-support@vouchrapp.co