caseyscalf

Thanks! I noticed that dropping the resolution helped significantly as well! Did a few A vs B vs C tests and both options helped. Thank you!

Site URL: https://www.sensebellum.com/ I am getting some great results integrating video on my site by using an embed code. I am wondering how to optimize for quick loading though. If I were to do any of the following would it help speed up load times? A) Render the video at 1280 x 720 vs 1920 x 1080. B) Shorten the time of the video such as 10 seconds vs 60 seconds.

BOOM! Nailed it. This is how you do it. Make the Width & Height 100%. <div style="padding:56.25% 0 0 0;position:relative;"> <a href="https://www.sensebellum.com/new-page" style="position:absolute; top:0; left:0; display:inline-block; width:100%; height:100%; z-index:5;"></a> <iframe src="https://player.vimeo.com/video/440169206?background=1?autoplay=1&loop=1&title=0&byline=0&portrait=0" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="autoplay; fullscreen" allowfullscreen> </iframe> </div>

Progress! I am able to make a transparent rectangle that takes the user to the new page! Woo! I learned about it here. So the only problem is that the size of the rectangle does not change responsively like the video does. How can we easily code for this? <div style="padding:56.25% 0 0 0;position:relative;"> <a href="https://www.sensebellum.com/new-page" style="position:absolute; top:0; left:0; display:inline-block; width:1000px; height:500px; z-index:5;"></a> <iframe src="https://player.vimeo.com/video/440169206?background=1?autoplay=1&loop=1&title=0&byline=0&portrait=0" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="autoplay; fullscreen" allowfullscreen> </iframe> </div>

Progress! I am able to make a transparent rectangle that takes the user to the new page! Woo! I learned about it here. So the only problem is that the size of the rectangle does not change responsively like the video does. How can we easily code for this? <div style="padding:56.25% 0 0 0;position:relative;"> <a href="https://www.sensebellum.com/new-page" style="position:absolute; top:0; left:0; display:inline-block; width:1000px; height:500px; z-index:5;"></a> <iframe src="https://player.vimeo.com/video/440169206?background=1?autoplay=1&loop=1&title=0&byline=0&portrait=0" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="autoplay; fullscreen" allowfullscreen> </iframe> </div>

I'm not sure I'm being completely clear here. There is going to be a video on my website. Someone's going to click it. It's going to take them to another page on my website. Super simple. A video as a button. How do you modify the code above to do this? As you can tell I am really close. The single line of pixels above the video is clickable and it takes you to the URL. I'm just not getting the syntax right or something and it's not turning the entire video into a button. How do I using the code block posted above make this so the entire video is clickable? Conversely can I make a transparent rectangle as a button that lays over the top? then when they try and click the video, really a transparent rectangle that has a hyperlink in it, it will act as if they click the video and it was a button. Boom. It takes them to a new page on my website. Super simple. We are going to do this and I would love if you had any insight.

Hello. I need the user to click on the video and be taken to a new page. How can we do this? The code I posted is very close to working. Do you know how to tweak it to achieve this effect? Or, do you know of another way to present a video on the website and turn it into a click-through link? Thanks!

Okay this is where I ended up. The first row of pixels is the link but not the video. <div style="padding:56.25% 0 0 0;position:relative;"> <a style="display:contents" href="https://www.sensebellum.com/the-sandbox-of-life"> <iframe src="https://player.vimeo.com/video/440169206?background=1?autoplay=1&loop=1&title=0&byline=0&portrait=0" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="autoplay; fullscreen" allowfullscreen> </iframe> </a> </div>

It's the first line of pixels!

For some reason it works on mobile sometimes.... Maybe the area to click is really small? It's not obvious why it only works some places. Nothing on desktop yet.

Well then I just ended up making a brand new code block on the page and starting with this. I feel I am realllllly close. Trying to somehow wrap the iframe or div as a clickable thing as per this article. I feel like it is possible I am just not that well versed at the exact syntax yet. Is that something that can be done? Thanks! <div style="padding:56.25% 0 0 0;position:relative;"> <a href="https://www.sensebellum.com/the-sandbox-of-life"> <iframe src="https://player.vimeo.com/video/440169206?background=1?autoplay=1&loop=1&title=0&byline=0&portrait=0" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="autoplay; fullscreen" allowfullscreen> </iframe> </a> </div>

This is as far as I got tonight. It works on desktop but not on mobile. Probably due to screen size. Maybe there are some ways I can improve this? Would love to actually just click the video instead of putting some HTML text over the top. Thanks! <div style="position: fixed; text-align: center; z-index: 1000; width: 100%; position: absolute; top: 1000px; height: 100%"> <h2> <a href="https://www.sensebellum.com/the-sandbox-of-life">The Sandbox of Life</a> </h2> </div>

Getting really close to dialing in the auto-play videos now and I'm curious if there is one possibility. Can you add some sort of click through link on a video? I'm doing an autoplay video from Vimeo. I read somewhere on how to hide the UI. Looks super clean. I can figure out how to say bake a bit of text that looks like the button into the video itself. But I need to make it go somewhere. I'm really trying not to make it take the user to a new page. You know, a click-through link just like the pictures do? What can be done here? I am open to getting crafty. Thanks!

I know the purpose of the Cover Page is to be a "single-page website". I like that part for sure. It's easy to have a really killer landing page for another part of my site away from the homepage. It is so nice to have the full screen autoplay video with photo fallback, the super straightforward interface, and the ease of designing. There's just one problem. It would be really great to add to this. It would nice to continue being able to edit like a normal page would. I'd like to add some more pictures below so you can scroll down and away from the "Cover page" itself. Is this even possible? how hacky is it? Is there another way to achieve that full screen video away from the home page? Maybe I can kind of create my own blend? What path would you recommend checking out based on the desire above? Thanks!

I accidentally entered the Mailing List the wrong way. Needed to delete and try again. When I tried to delete as the doc suggests I instead I received this message: What is going on? Do I need to wait? I have not setup any Newsletter Blocks OR Promotional Pop-ups. I looked. Could look again. Thanks for any tips!