Save the date! Join us on October 16 for our Product Ops launch event. Register here.
Apr 07, 2023 02:11 AM
Hey all,
Having a request from a client I found a way to add image in our signatures for email we send using Gmail action in Airtable.
Due to the fact that the image element is not included in Airtable's markdown list we can add it by adding a piece of html code in our action. Below is the code and the explanation of using it.
</td><td width=96 valign=top>
<div class=t102 style="display:inline-table;text-align:initial;vertical-align:inherit;width:48.97959%;max-width:96px;">
<table role=presentation width=100% cellpadding=0 cellspacing=0 class=t104><tr>
<td class=t105><div style="font-size:0px;"><img class=t106 style="display:block;border:0;height:auto;width:15%;Margin:0;max-width:25%;" width={image_width} height={image_height} src={image_public_url}></div></td>
Comments about the code:
For those who already have a website, I would recommend to use an image's path from there, it works 100% 😎
Hope this will help you make improvements and create better user experiences. Below are some screenshots from an example. Please feel free to post here any kind of question and any incredible idea for improvements 😊.
Last but not least, in the same way we can embed call to action buttons in Gmail action 😉
Yours sincerely,
Dimitris Goudis
Aug 01, 2023 10:57 PM
Hey @Cristina_Garcia,
thanks for your message. This is very nice idea. Yea you can do it you just need to update the html code by adding the tag with the redirection link and will work. 🙂
Yours sincerely,
Dimitris Goudis
Aug 02, 2023 11:59 AM
What would be the formula to link the photo of the signature?
Aug 02, 2023 03:37 PM
Hi @Dimitris_Goudis !!
Thank you for the code! I tried using it but the image doesn't appear. I have my signature image in Google Drive but made public (tried it on incognito window). When I try running it this is what appears instead of the image:
This is how I put the code:
</td><td width=96 valign=top>
<div class=t102 style="display:inline-table;text-align:initial;vertical-align:inherit;width:48.97959%;max-width:96px;">
<table role=presentation width=100% cellpadding=0 cellspacing=0 class=t104><tr>
<td class=t105><div style="font-size:0px;"><img class=t106 style="display:block;border:0;height:auto;width:15%;Margin:0;max-width:25%;" width=100% height=100% src=https://drive.google.com/file/d/1N7R1ivK4qMupA1N-1Ep-YGul81s54LFB/view?usp=sharing></div></td>
Aug 03, 2023 12:45 AM
Hey @Arturo_Hinojosa,
Thanks for your reply! the image source should be in a public url while the google drive's urls are not public. To test it try to open the images url from an incognito window, if the image appears then you can use this link in your code.
Yours sincerely,
Dimitris Goudis
Aug 03, 2023 12:46 AM
Hey @Cristina_Garcia,
You have to add the href tag before the img tag in code. Please check the instructions from here.
If you have troubles again please feel free to DM me 🙂
Yours sincerely,
Dimitris Goudis
Oct 23, 2023 11:24 AM
Hello,
I'm wondering if publishing the signature via Canva will work? It appears it is not for me but i'm wondering if I am doing it wrong. This is how it shows in the bottom of my email when I test it:
This is what I am using as the code in the automation:
</td><td width=96 valign=top>
<div class=t102 style="display:inline-table;text-align:initial;vertical-align:inherit;width:48.97959%;max-width:96px;">
<table role=presentation width=100% cellpadding=0 cellspacing=0 class=t104><tr>
<td class=t105><div style="font-size:0px;"><img class=t106 style="display:block;border:0;height:auto;width:15%;Margin:0;max-width:25%;" width={image_width} height={image_height} src=https://www.canva.com/design/DAFujmo-9s4/view></div></td>
Here is another variation I tried filling in the length and height and all it did was leave an empty space at the bottom of the email:
</td><td width=96 valign=top>
<div class=t102 style="display:inline-table;text-align:initial;vertical-align:inherit;width:48.97959%;max-width:96px;">
<table role=presentation width=100% cellpadding=0 cellspacing=0 class=t104><tr>
<td class=t105><div style="font-size:0px;"><img class=t106 style="display:block;border:0;height:auto;width:15%;Margin:0;max-width:25%;" width=90 height=90 src=https://www.canva.com/design/DAFujmo-9s4/view></div></td>
Thank you
Oct 25, 2023 11:06 AM
Hi
I just have a question regarding this code. We created our signature using WiseStamp, when we pull it uo it doesn't seem to give us a URL but it does give us a HTML code but when we drop this into airtable it partially works, some images and words do not show up. Would you know anything about WiseStamp signatures?
Oct 25, 2023 11:08 AM
I just have a question regarding this code. We created our signature using WiseStamp; when we pull it up, it doesn't seem to give us a URL, but it does give us an HTML code. But when we drop this into airtable it partially works; some images and words do not show up. Does anyone know anything about WiseStamp signatures?
Oct 25, 2023 11:09 AM
Hey @JMANHOMES,
I am not sure is canva link are public but you can give it a trial and share your feedback 😎
Oct 25, 2023 11:10 AM