Last edited on Aug 29, 2023

How to add a video with auto-play or play / pause buttons

In this guide, we'll go over 2 different ways to add your video: auto-played and looped, or with player controls like pause and play buttons. Pick one to start:

How do you want to add your video?

How to add an auto-played, looped video.

Use this guide if you're looking to add an autoplayed, looped video with no YouTube/Vimeo watermark. Example:

Go to the Typedream editor
Type /embed and go to the 'Upload' section
Upload your video (If your video file exceeds 4.5MB, then you'll need to upgrade your plan to 'Grow' so that you may upload video file up to 20MB)
Copy and paste the code below into the 'Code' section in your embed (only paste the code and don't click the insert button)

<video playsinline="" loop="" autoplay="" muted="" style="width: 100%; height: auto; display: block; margin: 0px;">  <source src="Your Video Link" type="video/mp4"></video>

Click 'Replace Embed' on right side bar and go to the 'Upload' section in your embed element
Copy the video link that has been available at the lower part of the 'Upload' section
Click the 'Code' section and replace the "Your Video Link" in the previous code with the link that you have copied in the 'Upload' section

The final code would be like this (example):

<video playsinline="" loop="" autoplay="" muted="" style="width: 100%; height: auto; display: block; margin: 0px;"> <source src="https://typedream-user-assets.sfo3.cdn.digitaloceanspaces.com/toketi_slideshow.mp4" type="video/mp4"></video>

When you've added the complete code like the example above, click on the 'Insert Code' button
Click on the 'Publish' button to save the changes that you've made
Open the page in either preview mode or in custom domain to check and see the autoloop and autoplay video

That's it!

How to add a video with player controls (play/pause button).

Use this guide if you're looking to add a video with player controls (play/pause button) with no YouTube/Vimeo watermark. Example:

Go to the Typedream editor
Type /embed and go to the 'Upload' section
Upload your video (If your video file exceeds 4.5MB, then you'll need to upgrade your plan to 'Grow' so that you may upload video file up to 20MB)
Copy and paste the code below into the 'Code' section in your embed

<video playsinline="" style="width: 100%; height: auto; display: block; margin: 0px;" controls><source src="Your Video Link"></video>

Click 'Replace Embed' on right side bar and go to the 'Upload' section in your embed element
Copy the video link that has been available at the lower part of the 'Upload' section
Click the 'Code' section and replace the "Your Video Link" in the previous code with the link that you have copied in the 'Upload' section
The final code would be like this (example):

<video playsinline="" style="width: 100%; height: auto; display: block; margin: 0px;" controls><source src="https://api.typedream.com/v0/document/public/46d710fd-ec90-498a-901c d6acd853f5fa/2d4m2ZyeHJEwfNTbHfgWxaVEQpi_file_example_MP4_640_3MG_1_.mp4"></video>

When you've added the complete code like the example above, click on the 'Insert Code' button
Click on the 'Publish' button to save the changes that you've made
Open the page in either preview mode or in custom domain to check and see the autoloop and autoplay video

That's it!

We're a remote software company, building online tools for creators, builders, and side hustlers. We quit our 9-5 to pursue our dreams, and we want to help others do the same.