How to embed a .gif file inside a message

Pau Sanchez Updated by Pau Sanchez

Adding GIFs can be a fun way to engage users! We will show 2 ways to do it. 

  1. The easy one is to use the Media block and search with our GIPHY integration

  1. The other option is to embed it:

As an example we are going to use the Embed option from Giphy, however bear in mind that the gif will display the Giphy branding like this when the cursor hovers the gif:

  • Go to the Gif you are interested in and select Embed:

  • On the GIF’s page, click the Embed option. This will open up different embed options for the GIF:

  • In the Embed settings, switch Responsive to “On.” This will make sure the GIF resizes properly on different devices:
  • Copy the code from the GIF Embed Code field. This is the code you’ll paste into Landbot:

  • Open your Landbot flow and add a Send A Message block. Paste the embed code from Giphy into this block:

  • Edit the code so the code looks like this:

<iframe src="https://giphy.com/embed/dl2l3By1qopSlsxlAD" width="100%" height="100%" ></iframe>

And that’s it! 🎉 You’re ready to go—your GIF will now display in Landbot, complete with Giphy’s branding that appears when users hover over the GIF. Enjoy! 😎

These scripts and how to's are not native functionalities. Landbot won't be able to support, help or guarantee these scripts and how to's. These Workarounds and How to's are for developers, as a learning and example material on how to extend or modify some of the platform limitations.  Due to platform updates, some scripts might stop working in the future.Please, note that in case of Scripts and Workaround the Custom Success Team can deliver limited support.

How did we do?

How to display images with a variable URL source

Different ways to embed Videos in Landbot

Contact