Adding Videos to Your Site

Videos can make your site more engaging. Here's how to add them using Framekit.

Video Options

Framekit supports two types of videos:

Uploaded Videos

• Videos you upload directly to your site
• Full control over playback settings
• No external branding
• Uses your storage quota

Embedded Videos

• YouTube, Vimeo, and other platforms
• Hosted externally (no storage used)
• May show platform branding
• Easy to add existing content

Adding an Uploaded Video

Step 1: Add Video Block

Click "+" to add content

Go to Basic Blocks tab

Select Video from the Media section

Step 2: Upload Your Video

Click on the video placeholder

Select Upload or drag your video file

Wait for upload to complete

Video appears on your page

Supported Formats

• MP4 (recommended)
• WebM
• MOV

Adding an Embedded Video

Step 1: Add Video Block

Click "+" to add content

Go to Basic Blocks tab

Select Video Embed

Step 2: Paste URL

Click on the embed placeholder

Paste your YouTube or Vimeo URL

The video loads automatically

Supported Platforms

• YouTube
• Vimeo
• Other platforms with embed support

Video Settings

For uploaded videos, click the settings icon to access:

Control Menu

• ON: Shows play/pause, volume, progress bar
• OFF: No controls (good for background videos)

Note: Controls are automatically hidden when autoplay or loop is enabled.

Loop Video

• ON: Video repeats continuously
• OFF: Plays once and stops

Great for: Background videos, animations, ambient content

Auto Play

• ON: Video starts automatically when page loads
• OFF: User must click to play

Important: Autoplay requires the video to be muted (browser restriction).

Muted

• ON: No sound
• OFF: Sound plays (if not autoplaying)

Show on Mobile

• ON: Video displays on mobile devices
• OFF: Video hidden on mobile (saves data)

Alignment

Choose left, center, or right alignment.

Dimensions

Adjust width and height. For Vimeo embeds, aspect ratio is maintained automatically.

Mobile Considerations

Performance Tips

• Consider hiding large videos on mobile
• Use the "Show on mobile" toggle
• Optimize video file size before uploading
• Use embedded videos to save bandwidth

Autoplay on Mobile

• Many mobile browsers block autoplay
• Muted autoplay has better support
• Test on actual devices

Video Best Practices

File Size

• Compress videos before uploading
• Aim for under 50MB when possible
• Use modern codecs (H.264 for MP4)

Aspect Ratio

• 16:9 is standard for most videos
• Vertical (9:16) for mobile-first content
• Square (1:1) for social media style

When to Use Video

• Hero sections for impact
• Product demonstrations
• Testimonials
• Background ambiance
• Tutorials and guides

Troubleshooting

Video Not Playing

Check file format is supported

Verify file isn't corrupted

Try re-uploading

Check browser console for errors

Video Loading Slowly

Compress the video file

Use a lower resolution

Consider embedding instead of uploading

Check your internet connection

Embed Not Working

Verify the URL is correct

Check if the video is public

Try the embed URL format

Some platforms restrict embedding