Easiest tool to add videos on your website.

What Are Video Bubbles and Why Use Them?

With the digital landscape becoming increasingly competitive, capturing and retaining visitor attention is more crucial than ever. Video bubbles are small, looping previews of your videos that appear on your website pages. They act as eye-catching elements that prompt visitors to engage with your full video content, driving higher engagement and conversion rates.

Benefits of Using Video Bubbles:

  • Increase Time Spent on Site: Engaging previews entice visitors to explore more.
  • Boost Conversion Rates: Providing valuable information helps in decision-making.
  • Enhance User Experience: Interactive elements make browsing more enjoyable.

Ready to transform your website experience? Let's get started with GUMCLIP!

Step-by-Step Guide to Adding Video Bubbles Using GUMCLIP

1. Register on GUMCLIP

First things first, you'll need a GUMCLIP account.

Email Verification

  • Check your email for a four-digit verification code.
  • Didn't receive it? Check your spam folder or verify your email address.
  • For assistance, contact our 24/7 support via the chat widget.

Proceed

  • Enter the verification code.
  • Click "Continue to GUMCLIP" to access your dashboard.

2. Add Your Domain

Now, let's integrate GUMCLIP with your website.

  • On the Homepage: Click the "Add Domain" button.
  • Enter Domain: Input your domain name or subdomain.
  • Add Script:
    • A pop-up will display an "Embed on Your Domain" message with a GUMCLIP script.
    • Copy the script.
  • Integrate Script:
    • Paste the script into the <head> section of every page on your website.
    • Use a code inserter or Google Tag Manager.

Test Integration:

  • Click "Test Integration" in the pop-up.
  • Success? You'll see a green success message.
  • Error? Check with your developer or contact support.

3. Upload Your Video

Time to add your video content.

  • Navigate: After domain verification, you'll be on the Videos page.
  • Add Video:
    • Click the "Add Video" button.
    • Upload your video (accepted formats: MP4, MKV, AVI; max 100 MB).
  • Wait: Allow the video to upload and process.

4. Configure Your Video Bubble

Now, let's make that engaging video bubble!

Access Video Settings

  • After uploading, you'll be directed to the Video Settings page.
  • At the top, toggle between Desktop and Mobile to customize both views.

Preview Video Settings

This is where you craft your video bubble—the looping preview.

  • Position:
    • Choose where the bubble appears: Bottom Left, Bottom Right, Top Left, or Top Right.
  • Frame Shape:
    • Circle
    • Square
    • Original (retains aspect ratio)
    • Button (replaces preview with a custom button)
  • Customize Frame:
    • Border Style: Dotted, Dashed, Solid, etc.
    • Border Thickness & Color
    • Border Radius: Adjust roundness.
    • Background: Select animated backgrounds to make it pop.
  • Add a Title:
    • Enable or disable title text beneath the bubble.
    • Customize text color and background.

Preview Button Mode (Optional)

Prefer a button over a video preview?

  • Select: Frame mode as "Button".
  • Customize:
    • Choose a pre-designed button or upload your own.
    • Add hover-over titles.

5. Configure Main Video Settings

This is the full video that plays upon clicking the bubble.

Expanded View

Decide how the main video appears.

  • Expand in Position: Opens where the bubble is.
  • Expand to Center: Pops up in the screen's center.
  • Lightbox: Centers the video with a transparent background overlay.

Additional Settings

  • Loop Video: Enable if you want the main video to replay automatically.
  • Call to Action (CTA) Button:
    • Enable: Add a CTA to your video.
    • Customize: Text, colors, URL, and button style.
    • Delay: Set when the CTA appears during the video.
  • Add a Title: Similar to the preview, customize as needed.

6. Set Display Conditions

Control when and where your video bubble appears.

URL Conditions

  • Include URLs:
    • Exact Match: Show on specific pages.
    • Contains: Show on pages that include certain text in the URL.
  • Exclude URLs: Specify where not to display the bubble.

Day-Based Conditions

  • Select Days: Choose which days of the week the bubble appears.

7. Advanced Settings (Optional)

For those who want more control.

  • Custom CSS: Add your own styles to match your website's design seamlessly.

8. Save and Deploy

Almost there!

  • Preview: Ensure everything looks perfect on both desktop and mobile views.
  • Save Changes: Click "Save" to apply your settings.
  • Test on Your Website: Visit your site to see the video bubble in action.

Tips for Maximizing Engagement with Video Bubbles

  • Keep Preview Short and Sweet: The bubble loops the first 5 seconds—make them count!
  • Eye-Catching Design: Utilize borders and backgrounds that match your brand but stand out.
  • Strong CTA: Encourage viewers to take the next step with compelling calls to action.
  • Monitor Analytics: Use GUMCLIP’s in-depth analytics to track performance and optimize.

Conclusion

Adding video bubbles to your website is a powerful way to enhance user engagement and keep visitors interacting with your content longer. With GUMCLIP, the process is straightforward, and the customization options are robust. By following this guide, you're well on your way to transforming your website experience and driving better results.

Ready to captivate your audience? Sign up for GUMCLIP today and start creating interactive video experiences that resonate with your visitors.


Have questions or need assistance? Our support team is available 24/7 via the chat widget on our website.

Sumit Ghugharwal

Sumit Ghugharwal is Group Director at Antifragile Technologies based in Dubai,UAE. Before starting Antifragile Technologies, Sumit was Digital Director at marketing and branding agency based in dubai and headed a digital marketing agency in New Delhi.

Sumit Ghugharwal is Group Director at Antifragile Technologies based in Dubai,UAE. Before starting Antifragile Technologies, Sumit was Digital Director at marketing and branding agency based in dubai and headed a digital marketing agency in New Delhi.

Our Blog

News, How-to, Use Cases and more.

How to increase engagement using video bubbles on your website?

The step-by-step process of adding video bubbles to your website using GumClip. Easy to add embed video bubbles on your website.

How to Add Video Bubbles to Your Website with GUMCLIP

Video bubbles are small, looping previews of your videos that appear on your website pages. They act as eye-catching elements that prompt visitors to engage with your full video content,...