Video Button

Estimated reading: 2 minutes 12 views

📽️ Video Button Widget – ThemePul Pack

The Video Button widget allows you to display engaging play buttons that trigger embedded videos (like YouTube or Vimeo). This is perfect for portfolio intros, product tours, service demos, or any visual storytelling section. With hover animations and stylish effects, your content becomes more dynamic and interactive.

đź”§ How to Enable & Use This Widget (Global Instructions)

To use the Video Button widget:

  1. Enable the Widget from the Dashboard
    • Navigate to Themepul Pack → Widgets.
    • Locate the Video Button widget from the list.
    • Toggle the switch to “On” to activate it.
  1. Drag & Drop into Elementor
    • Open your page with Elementor.
    • Search for “Video Button” in the widget panel.
    • Drag the widget into your desired section on the page layout.

🛠️ How to Configure the Video Button Widget

➤ Step 1: Add the Widget to Your Layout

Drag the “Video Button” widget into the desired container or section where you want to showcase the video.

➤ Step 2: Configure Video Content

  • Choose Style: Select from two layout styles (classic play icon or image preview with text).
  • Link: Paste your video URL (e.g., YouTube or Vimeo).
  • Image: Upload a background or preview image.
  • Button Text: Customize the call-to-action text (e.g., “Watch the Video”).

➤ Step 3: Style Settings

Go to the Style tab to personalize appearance:

  • Content Width: Adjust the space the button occupies.
  • Typography: Set custom font, size, and weight for the button text.
  • Colors:
    • Color: Primary color of the button.
    • After Color: Hover color or secondary effect.
    • Border Before/After Color: Animating border effects before and after hover.
  • Border Width: Set how thick the border animation should appear.

➤ Step 4: Responsive Settings

Ensure your video button looks great on all devices:

  • Customize padding/margins.
  • Adjust alignment and size per device breakpoint.

Leave A Comment

All fields marked with an asterisk (*) are required