Skip to main content

How to Add GIFs to the Widget?

Enhance your widgets by adding GIFs, making them more dynamic and visually appealing. This guide will walk you through the process of integrating GIFs into your widgets using Giphy.

D
Written by Dharmik Valani
Updated over 6 months ago
  1. Open Customize Widget: Navigate to the Template Settings section in your Customize Widget.

  2. Add the GIF Element: In the Add section, select Image.

  3. Search and Insert a GIF:

    • In the Images, find the Library field.

    • Enter a keyword to search for a relevant GIF from Giphy.

    • Browse the results and select the GIF you want to add.

    • Adjust the Width and Height settings to fit your design.

  4. Customize GIF Settings:

    • Fit: Adjust this setting to control how the GIF scales within its container.

    • Position: Align the GIF to a specific position within the widget for better visual balance.

    • Transparency: Adjust the transparency level of the GIF overlay to blend it seamlessly with the widget background.

    • Action: Define what happens when users click on the GIF by selecting an action type:

      • Open Link: Redirect users to a specific URL when they click on the GIF.

      • Form Submit: Trigger a form submission when the GIF is clicked.

      • Go to Step: Navigate users to the next step in a multi-step widget.

      • Close Popup: Close the popup when the GIF is clicked.

      • Call JavaScript Function: Execute a custom JavaScript function for advanced interactions.

    • Border:

      • Roundness: Set the border radius to make corners rounded.

      • Thickness: Define the thickness of the border.

      • Color: Choose a border color to match your widget design.

    • Override CSS: If you need advanced customization, you can apply custom CSS styles to modify the GIF's appearance further.

  5. Save and Apply Changes:

    • Click the X button to close the settings panel.

    • Click the Save and Publish button to apply the changes to your website.

Hurray! Your widget is now enhanced with a GIF! This can help in making your content more engaging and fun.

For any assistance, feel free to reach out to our support team.

Did this answer your question?