Modifying the email image my customers receive when buying a gift card

Solved
jjcastillot
Excursionist
20 0 4

Hello shopify team, currently we are selling some gift cards to our customers, and we want to make the e-mail they receive more christmas-related. I know in the "Language" section of the theme, we can modify some of the text of the mail (Not all), but we want to update the card image & text that currently are:

jjcastillot_0-1608062466227.png

Thanks a lot for the help and support you can provide.

 

0 Likes
Miles
Shopify Staff
Shopify Staff
477 68 121

This is an accepted solution.

Hi, @jjcastillot!

I'm Miles from the Social Care team at Shopify. Modifying your gift card image is something you can do in your Shopify admin, but it does require some coding. I'll walk you through each step, but I want to start with some information if you're unsure how to code.

If you're using a free theme from Shopify, then our Support team might be able to help you with this tutorial. Although Shopify can help you with many customizations, some kinds of customizations aren't supported.

If you're using a paid theme, then your theme was made by a third-party developer and Shopify's Support team can't help you with it. If you need help customizing a paid theme, then consider hiring a Shopify Expert. Similar to free themes, some kinds of customizations aren't supported because of limitations associated with the theme or Shopify admin.

Learn more about support for themes.

Uploading your image.

To upload a new image for your gift card, follow these steps:

  1. From your Shopify admin, go to Online Store > Themes.
  2. Find the theme you want to edit, and click Actions > Edit code.
  3. In the Assets directory, click Add a new asset: New asset menu 
     

     

  4. Click Choose File to browse to the new gift card image on your computer and upload it. We suggest using a simple filename, for example blue-giftcard.png.
  5. Click Upload asset. The new gift card image will appear in your Assets directory. Take note of the file extension (.png or .jpg) 
     

     

Attach picture to the gift card image.

  1. In the Templates directory, click gift-card.liquid.
  2. Find the following code within the file: <img src="{{ 'gift-card/card.jpg' | shopify_asset_url }}" alt="">
  3. Replace it with the following: <img src="{{ 'blue-giftcard.png' | asset_img_url: '1024x1024' }}" alt="">
  4. Click Save.

Note: Make sure to change "blue-giftcard.png" to the file name and extension of the new image as needed.

Preview your new gift card image.

  1. From the theme code editor, in the top right-hand corner, click Customize theme.
  2. Open the theme editor.
  3. From the drop-down menu at the top of the page, or from the Templates menu on mobile, select Gift card.

I hope this helps! Please let me know if you need any assistance or get stuck at any step.

Miles | Social Care @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

jjcastillot
Excursionist
20 0 4

Hi Miles, thanks a lot for your help!

I followed your instructions and the image was replaced succesfully:

jjcastillot_0-1608232842025.png

I will modify the image so the text and objects doesn't get covered by the gift-card code. I just need an extra help: How can I modify the text color of the card price (top-right corner of the image)

0 Likes
maranolo
Tourist
3 0 1

Hi there!

I am looking for a way to change the image in the email the customer gets - not the gift card image on the webpage. I changed the image of the shop-page (with the solution above) but the image in the email is still the shopify-standard-picture. Any way to change this as well?

By the way: where is the text of the cift-card-email coming from? I cannot find the text in the language files.

Thanks!

0 Likes
Miles
Shopify Staff
Shopify Staff
477 68 121

Hi, @maranolo!

You can change the email image and text as well. To do this, head over to Settings > Notifications and find the notification labelled "Gift card created".

To change the image in the email, find the following code:

<img src="{{ 'gift-card/card.jpg' | shopify_asset_url }}" alt="">

And simply replace it with the new code, replacing YOURFILENAME with the name of the file you uploaded into your theme asset:

<img src="{{ 'YOURFILENAME' | asset_img_url: '1024x1024' }}" alt="">

Once you've done that, you'll also be able to change the email contents as well. If you need a further hand, please let me know.

Miles | Social Care @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
sabrina2021
New Member
2 0 0

Hi there, 

I could not change my email image of the gift card from following the steps. Could you help me?

www.evelinethelabel.com

0 Likes
lucy_b
New Member
2 0 0

Hi there,

 

I have followed the steps shown above but it seems to break and now there is no image. I have tried with both a static image (jpeg) and a gif. Do you have any other suggestions as to what might be going wrong?

Also, is there a way to add our logo to the page? At the moment it just has our store name written in text.

 

Thank youscreen shotscreen shot

0 Likes
Temi18
Tourist
13 0 0

The same thing has happened to me and I can't seem to find a solution. Have you sorted it out since this post?

0 Likes
lucy_b
New Member
2 0 0
No, unfortunately not.
0 Likes
sabrina2021
New Member
2 0 0
Unfortunately not.
I had to contact shopify support for help in the end to make it into a readable size.

As for logo, you can change it at
Online Store > Themes > Customize Theme, click on Header from the new option panel on the left side. Then, you will see a box that will allow you to upload an image as your logo, or to input text below that box as your logo.
The sizing varies for desktop and mobile which you must change font sizing in the custom code though.

0 Likes