Highlighted

Background Videos Not Loading on Live Site

Community Beginner ,
Oct 23, 2017

Copy link to clipboard

Copied

I made a new website for my stand up comedy and acting.

When I uploaded the site to the Adobe Catalyst for preview, everything was fine:

http://nieker03.businesscatalyst.com

But now I exported the files to HTML and then manually upload them via FileZilla to my actual hosting site and the videos will not load:

http://www.theinternetiswastingmytime.com

can someone help me get the vids to load on the published site? THANK YOU

I didn't use the background widget. Instead I created a master page for each page and used used this code in the header:

<style>

.vid {

position: relative;

width: 100%;

height: 100vh;

}

.vid video {

position: absolute;

left: 0%;

top: 0%;

transform: translate (-50%, -50%);

-webkit-transform: translate (-50%, -50%);

-ms-transform: translate (-50%, -50%);

min-height: 100%;

min-width:100%;

}

</style>

and placed  html like this on each master page (pointing to a different file each time)

<div class="vid">

<video autoplay muted loop>

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

Sorry Your Browser Doesn't Support Video.

</video>

</div>

Views

141

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Background Videos Not Loading on Live Site

Community Beginner ,
Oct 23, 2017

Copy link to clipboard

Copied

I made a new website for my stand up comedy and acting.

When I uploaded the site to the Adobe Catalyst for preview, everything was fine:

http://nieker03.businesscatalyst.com

But now I exported the files to HTML and then manually upload them via FileZilla to my actual hosting site and the videos will not load:

http://www.theinternetiswastingmytime.com

can someone help me get the vids to load on the published site? THANK YOU

I didn't use the background widget. Instead I created a master page for each page and used used this code in the header:

<style>

.vid {

position: relative;

width: 100%;

height: 100vh;

}

.vid video {

position: absolute;

left: 0%;

top: 0%;

transform: translate (-50%, -50%);

-webkit-transform: translate (-50%, -50%);

-ms-transform: translate (-50%, -50%);

min-height: 100%;

min-width:100%;

}

</style>

and placed  html like this on each master page (pointing to a different file each time)

<div class="vid">

<video autoplay muted loop>

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

Sorry Your Browser Doesn't Support Video.

</video>

</div>

Views

142

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Oct 23, 2017 0
Oct 23, 2017

Copy link to clipboard

Copied

Hey popcopy,

After checking the codes of your site it looks like the issue is with a file name.

It is always a good practice to keep the filename all in lower caps for and no spaces for the web.

Please try to keep the file name all in lower case and re-upload, I hope it should work.

Let me know how it goes.

Regards,

Ankush

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Oct 23, 2017 1
Community Beginner ,
Oct 23, 2017

Copy link to clipboard

Copied

Hi Ankush,

Yes it turned out to be the file names. Interestingly I named the files mixed-case and put mixed case in the HTML on the page(s) but when Muse exported to HTML it exported the file names all lowercase. I simply changed the file names back to mixed case on the hosting server, and then the files were recognized and it works. I guess the better solution is to change the file names and html to all lowercase and reupload, as you suggest. I will do that now. Thank you!

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Oct 23, 2017 1
Adobe Community Professional ,
Oct 23, 2017

Copy link to clipboard

Copied

You should really better follow Ankushs advice and the kind of rule for html which normally prefers lower case instead of uppercase.

Lower and upper case mixed needs some coding, watching W3school-tutorials, for example.

Have no idea why you don`t change your file names to lower case and re upload. What`s the reason for this?

Best Regards,
Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Oct 23, 2017 1
Community Beginner ,
Oct 23, 2017

Copy link to clipboard

Copied

I said I would and I did. Thanks

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Oct 23, 2017 0
Oct 23, 2017

Copy link to clipboard

Copied

Glad it helped.

Cheers,

Ankush

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Oct 23, 2017 0
HMAM LATEST
Enthusiast ,
Oct 24, 2017

Copy link to clipboard

Copied

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Oct 24, 2017 2