Integrate Gatsby + Stamped

Reward your customers with loyalty points when they mention your brand on Instagram & TikTok

[Video coming soon]

 

 

Note: In order for this integration to work, your customer must be in both your Gatsby and Stamped accounts, using the same email address in both.

 

To help with this, we suggest you implement our native Stamped form for collecting Instagram and TikTok handles directly in your Stamped widget. Details for this are included below in the step-by-step.

 


Step 1: Create a "Custom Activity Rule" in Stamped

1. Log into Your Stamp Account >> Loyalty & Rewards >> Points >> Add New Rule

Screenshot 2023-05-10 at 11.59.25-1

2. Click Add Rule >> Scroll Down to Custom Activity >> Add Rule

Screenshot 2023-05-10 at 12.12.00

 

The image below shows what a blank Custom Activity Rule looks like:

Screenshot 2023-05-12 at 13.29.55

 


Step 2: Create reward for submitting Instagram handles

1. To collect & reward customers for entering their Instagram handle, copy and paste the script below and place it in the 'Description' field

<input type="text" name="gatsby_insta_handle" placeholder="Enter Instagram handle" id="gatsby_insta_handle" required />     <p class="gatsby-error gatsby-insta-errors" id="gatsby-insta-errors"></p>                        <div class="gatsby-loader" id="gatsby_insta_loader"></div>                                  <div class="gatsby-form-group">                                              <button class='gatsby-submit  stamped-rewards-content-button' id="gatsby_insta_Submit" onclick="parent.handleSubmit(handletype='Instagram')">Submit</button></div>

Screenshot 2023-05-10 at 12.19.28

2. Everything else on this form like # of points, title etc can be set however you wish.

 


(Optional) Step 3: Create reward for submitting TikTok handles

1. Repeat Step 1 to create a 'Custom Activity Rule'

2. To collect & reward customers for entering their TikTok handle, copy and paste the script below and place it in the 'Description' field:

<input type="text" name="gatsby_tiktok_handle" placeholder="Enter TikTok handle" id="gatsby_tiktok_handle" required />        <p class="gatsby-error gatsby-tiktok-errors" id="gatsby-tiktok-errors"></p>     <div class="gatsby-loader" id="gatsby_tiktok_loader"></div>         <div class="gatsby-form-group">              <button class="gatsby-submit stamped-rewards-content-button" id="gatsby_tiktok_Submit" onclick="parent.handleSubmit(handletype='TikTok')"> Submit</button>     </div>

Screenshot 2023-05-10 at 14.15.01

2. Everything else on this form like # of points, title etc can be set however you wish.

 


Step 4: Create reward for Instagram mentions

1. Repeat Step 1 to create a 'Custom Activity Rule'

2. Complete the form with any point value, title, and description you wish

Tip: Below is a suggested description for you to copy/paste, this is optional.

Step 1: Enter your Instagram handle using the form below  <br> Step 2: Tag us in your Story or Feed and get 100 points!

Screenshot 2023-05-10 at 14.26.14

3. That's it for now, we'll come back to this Custom Activity shortly

 


(Optional) Step 5: Create reward for TikTok mentions

1. Repeat Step 1 to create a 'Custom Activity Rule'

2. Complete the form with any point value, title, and description you wish

Tip: Below is a suggested description for you to copy/paste, this is optional.

Step 1: Enter your TikTok handle in the form below  <br> Step 2: Publish a TikTok video with #yourhashtag and get 100 points!

Screenshot 2023-05-12 at 13.40.47

3. That's it for now, we'll come back to this Custom Activity shortly

 


Step 6: Copy and paste "Campaign IDs" to Gatsby

Once you're done with Steps 4 and 5, navigate back into each of those Custom Rules, and copy / paste each Campaign ID into Gatsby, as follows

1. Copy the "Campaign ID" for your Instagram Mention Custom Activity

Screenshot 2023-05-16 at 19.19.46-1

2. Open Gatsby >> Integrations >> Stamped 

Screenshot 2023-05-18 at 14.41.38

Campagign ID

Once the Instagram and TikTok mention activity IDs are copied over, be sure to copy the rest of your Stamped settings keys as shown below

 


Step 7: Enter Stamped API Keys 

Stamped>>Settings>>API Keys>>Copy the API Public Key, Store Hash & API Private Key

Screenshot 2023-05-23 at 13.44.19

Screenshot 2023-05-23 at 14.03.19

 


Step 8: Copy / Paste the 'Default Form for Stamped' Tag

  • After you complete the integration you will see at the bottom of the Gatsby integrations page a new script labeled "Default Form for Stamped".

Copy that into your mouse: Screenshot 2023-05-23 at 17.20.31

  • Now that you have copied the Gatsby script, paste it into your Shopify Theme as shown below:

Note: This is required so that Gatsby can auto-receive the email / handles submitted by your users, via Step 2 and 3 above

Shopify >> Online Store >> Edit Code >> Layout>> theme.liquid

Screenshot 2023-05-23 at 17.00.57

  • Click on theme.liquid and scroll all the way down

Screenshot 2023-05-23 at 17.28.03

  • Paste your 'Default Form for Stamped' tag at the bottom of the page, right above </body> 

Screenshot 2023-05-23 at 17.36.13

Note: Remember to click save after pasting the Gatsby Default Form for Stamped

 


Step 9: Testing The Integration

  • To test the integration, go to your loyalty page and enter a test Instagram/TikTok handle and confirm you receive the points and that the submissions show up in your Gatsby account.
  • Then once you have confirmed that, tag your brand's Instagram account using the test handle you submitted a minute ago. Confirm you receive your points within a few minutes.
  • Do the same for TikTok. But remember TikTok tracking is based on a particular hashtag. Review the guide on setting up TikTok tracking

Tip: Remember that Instagram tags/mentions can take up to 15 minutes to appear in your Gatsby account. While TikTok can take up to 1 hour


That's it! If you have any questions, please don't hesitate to open a support ticket with us and we'll get back to you as quickly as possible. Thanks!