How do I embed an mp4 video into my muse website.

[HarleySoftailer]

I have already experimented with the Video Background tool from MuseAgain and it works great for setting a motion video as the background on the entire page.  However I want to be able to place MP4 videos in specific areas of my site and I want to be able to control the width and height of the viewing window and I want to be able to place different videos in different spots on the page. 

I'd prefer to do this without having to go through YouTube.  Any ideas, help and thoughts on this subject are greatly appreciated.

Thanks.

Andy.

[caitlinp3193492]

I have tried that code but it won't play

[Inge_Raemaekers]

Hi Vivek,

Thanks for your help so far... I got my home made MP4 working... partially!

Does this HTML-code also work with video on a smart phone?

I got it to work on a browser on MAC (still have to check PC), but when I try the same code for the phone-part, it doesn't start playing when I push the arrow in my browser on iphone. Do I ad another (part of a) code to make it start on a smart phone?

Will it be the same for iPad-browsers?

greetings, Inge

[Sonam Monga]

Hi Inge,

Please use the below snippet for phone/tablet layouts:

<video width="320" height="240" controls>

  <source src="../assets/filename.mp4" type="video/mp4">

</video>

Adding ../ before the assets will point to the assets in the Parent directory.

Regards

Sonam

[ryanw65321607]

I have followed these steps repeatedly with no luck, is there another way?

[jasont75041003]

I used the <iframe> instead of video and it works in the preview, but when i load the actual sight and click the link it just downloads the video file instead of playing it on the page.

[mariad3276532]

Hello!

My video only works in Chrome, when I open in Safari I just see the commands.

Can you help me?

Thanks

[Nancy OShea]

Show us your embedded code please.  Or post a URL to your online page.

Keep in mind that autoplay  is not supported by all browsers & devices.

[caitlinp3193492]

Hi Viv,

I have done that process and it worked, but my mp4 file won't play on my website.

This is what it looks like.

[caitlinp3193492]

I have inserted the correct html, but it won't play on Adobe Muse.

[Nancy OShea]

1. Adobe Muse is not a browser. 
2. Safari and iOS Safari ignore Autoplay by default.  Try a different browser.
   https://caniuse.com/#feat=video

[caitlinp3193492]

Hi Nancy,

I have tried it in Firefox and Chrome, but it still won't play.

from Caitlin

[Nancy OShea]

Owing to the recent spike in autoplay and ad blockers, this is the only reliable code that works in all browsers I've tested.

<div class="video-wrapper">

<!--CHANGE MP4 AND POSTER IMAGE TO YOUR OWN-->

<video poster="https://s3-us-west-2.amazonaws.com/s.cdpn.io/3174/poster.png" controls>

<source src="https://clips.vorwaerts-gmbh.de/VfE_html5.mp4" type="video/mp4">

</video>

</div>

Now if your video won't play online, maybe something is wrong with your video.  Or perhaps  the server you're hosting it on doesn't support  MP4 MIME type.

[caitlinp76077354]

http://<iframe width="560" height="315" src="https://www.youtube.com/embed/E-CgxKHkywU" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

This is my html, but it says on Muse that it couldn't generate thumbnail. What can I do to fix this?

[Nancy OShea]

Your code is malformed.  Try this revised version.

Replubish your site to server and test it online.

<iframe width="560" height="315" src="https://www.youtube.com/embed/E-CgxKHkywU" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

BTW your video contains no sound or actors.  From a practical standpoint, it's not much of a video. 

[ScratchMaster]

Merci pour votre réponse, mais...

J'ai inséré:

<video width="320" height="240" controls>

   <source src="assets/Montrealenlumiere2015Version2FormatInternet.mp4" type="video/mp4">

</video>

Il m'affiche "abandonné" et "Source non valide" lors de l'aperçu.

"Montrealenlumiere2015Version2FormatInternet" est le nom de mon fichier.

Ce fichier a bien été importer dans l'onglet "Ressources". Il y a marqué "Télécharger". Dois-je faire une manipulation particulière ?

Pouvez-vous encore m'aider ?

[VivekP]

Hello,

Please try to preview it from File > Preview page in Browser and see if the video plays.

Also try to make sure you use a small file name to avoid any spelling mistake.

If the issue still persist Please share some screenshots for better understanding.

Regards

Vivek

[wayneswhirld]

Hi Vivek -

I did the two steps above:

1. imported a file named: Happy_Holidays_from_Rufus_&_Family-SD.mp4 (this is a 2.5 MB file)

2. inserted HTML code:

<video width="320" height="240" controls>

   <source src="assets/Happy_Holidays_from_Rufus_&_Family-SD.mp4" type="video/mp4">

</video>

and this is what I get - the video doesn't load:

[VivekP]

Please check 2 thinks for me.

1. Try to preview the page in Browser from File > Preview page in Browser.

2. Copy the URL and check it in other browsers as well.

Let me know  the outcome.

Regards,

Vivek

[Don Unwin]

Vivek,

It worked!  Thanks.

I tried to find the Correct Answer so that I could click on it, but I couldn't find it.

Don

[wayneswhirld]

Thank you Vivek.

Here it is in Chrome:

and Safari:

I have been able to successfully upload videos on my Muse sites using youtube embed codes. This video was emailed to me; it is not on youtube.

[VivekP]

Hi Wayneswhirld,

Can you please share the .muse file with me. I have sent you my email in a private message.

Regards,

Vivek

[Don Unwin]

The muse file is: ChrisUnwin.net

[wayneswhirld]

Vivek - Thank you so much for working with my situation! It works!!

Let me know how to give you a "Correct Answer" to my issue.

[VivekP]

You are welcome. I am glad that I was able to help.

This post is already marked as correct. this is the reason you do not have the option to correct it.

Regards,

Vivek

[Marsseats]

Hello, i've got also a problem and followed the steps from above..

in chrome it works....in safari not??

strange? of must i do something special for safari?