How to Add A Video to My Website using Quick Add (Detailed)

How to Add A Video to My Website using Quick Add (Detailed)


This guide shows you how to quickly add videos to your website using the Quick Add feature. It walks you through choosing a video source and customizing how it looks and works. Follow the steps to make your site more engaging and professional with video content.



1. Navigate to https://app.podup.com/home

There are 2 ways to access the Page Builder

2. 1. Click "Page Builder" in the "Favorite Modules" on the Dashboard

3. 2. Click "My Site"

4. Click "Page Builder"

5. Click "Build" on the page you want to edit

6. Click "Add" to add a "Quick Add" element

7. Click "Video" and drag it to the desired location

8. Double click on the video to open the file manager

9. The file manager pop-up will open to allow you to select the video you want to add from PodUp or from your computer

10. Adjust the image by grabbing one of the boxes on the image and dragging it to the desired size

11. Click the customization icon to customize the element

12. See "How to format a design element" for the Design section since this is the same for every element

13. Click "Settings" to view the settings for this specific element

14. State: The different ways an element looks or acts depending on how someone interacts with it

  • Hover: This allows you to define a special set of styles that apply only when a user's mouse cursor is hovering over an element that has this class. It adds interactivity and visual feedback
  • Click: This allows you to define a special set of styles that apply when an element is being actively clicked or pressed down by the user. It provides immediate visual feedback that the user's action is being registered
  • Even/Odd: This allows you to apply different styles to elements based on their position in a sequence (even or odd number) within a common parent. This is incredibly useful for creating visual patterns, like "zebra striping" in lists or tables

15. Classes: A reusable set of styles that you can apply to multiple elements across your website. You can add specific elements that you have already programmed or they will be automatically added when you edit the menu

  • Tip: If this is your first website, leave this blank and let the software fill this in unless you have experience website building

16. Click the dropdown under "Provider" to identify the source of the video

HTML5 Source: lets you upload or link directly to a video file (like .mp4); good for full control and no outside branding; you host the video yourself and features like tracking need to be added manually.

YouTube: embeds a standard YouTube video player; good for easy sharing and built-in features like captions; shows YouTube branding and may track user behavior.

YouTube (No Cookies): embeds a YouTube video using privacy-enhanced mode; good for reducing tracking—cookies aren't set until someone presses play; still uses YouTube branding.

Vimeo: embeds a video hosted on Vimeo; good for a clean look and fewer ads; allows more customization (especially with a paid plan) and is often used by professionals.

17. Add your link in the "Source URL" field and it will be reflected in the image

  • If there is more than just a photo contained in the link, the software will struggle recognizing the photo

18. Click "Poster" to enter the URL of the image that will appear as the cover of the video

19. Click "Autoplay" to automatically have the video play on the website when the website is open

20. Click "Loop" to have the video will automatically start over and play again from the beginning as soon as it finishes—repeating over and over without stopping.

21. Click " Controls" to add the playback buttons that viewers can use to interact with the video like Play/Pause, Volume control, or a progress bar

22. Click "x" to dismiss the menu

23. Clicking this icon tells the element to “move to the next bigger container,” which shifts it from a smaller box (like a text block or section) into the larger layout it's part of—helping you place it more accurately on the page.

24. Move: Reposition the section to where you want. Click and hold this icon while you drag it to the desired location. A green line will indicate where it is being placed

25. Copy: Create a copy of the section

26. Delete: Remove the section entirely

  • Note: If you have a duplicate, it will only delete one of the two