Embedding GIF with Blings Dynamic Thumbnail

What this does:

The image (GIF/thumbnail) displays the recipient’s first name, and the click opens your demo video with the same name and UTMs in the URL.

Example HTML snippet:

<table role="presentation" border="0" cellspacing="0" cellpadding="0" width="100%" style="max-width:600px; margin:0 auto; border-collapse:collapse;">
  <tr>
    <td align="center" background="https://t.blings.io/87bc4aea-f668-49c3-b165-5808105446f3/{{ contact.firstname }}"
        style="background-repeat:no-repeat; background-position:center; background-size:cover; padding:0; margin:0;">
        
      <!--[if gte mso 9]>
      <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:600px;">
        <v:fill type="frame" src="https://t.blings.io/87bc4aea-f668-49c3-b165-5808105446f3/{{ contact.firstname }}" />
        <v:textbox inset="0,0,0,0">
      <![endif]-->
      
      <a href="https://blings.mp5.live/blings_integration_demo?name={{ contact.firstname }}&utm_source=crm_email&utm_medium=email&utm_campaign=demo"
         style="display:block; text-decoration:none; color:inherit;">
        <img src="https://ajeyvddhyklnihwjvuyh.supabase.co/storage/v1/object/public/gifs/1755710062888_Blings_Generic_Thumbnail_3.gif"
             alt="Your personalized video demo, {{ contact.firstname }} - click to play"
             width="600"
             style="display:block; width:100%; height:auto; border:0; max-width:600px; margin:0; padding:0;">
      </a>
      
      <!--[if gte mso 9]></v:textbox></v:rect><![endif]-->
      
    </td>
  </tr>
</table>

To Use on your CRM, for the specific project - make sure to update:

1. The video link - <a href="..." with your MP5 link and the relevant parameters like name={{ contact.firstname }}

2. The "dynamic thumbnail" image - https://t.blings.io/:id/{{parameter 1}}

3. The GIF asset - <img src="..." based on the actual design provided by the studio designers.

Result