- This topic has 13 replies, 5 voices, and was last updated 5 months, 3 weeks ago by David.
November 1, 2019 at 4:44 pm #1050928Steig
I believe I’ve followed your instructions on setting up the background video, but I’d like to move the text from the bottom of the video to the center or even right of center. Your instructions seem to indicate to use the padding adjustments to accomplish this, but those controls only become exposed if a static background image is uploaded.
How can I successfully control the text overlay? A great example is https://www.trekbikes.com/us/en_US/November 1, 2019 at 6:37 pm #1050962LeoStaffNovember 1, 2019 at 7:33 pm #1050983Steig
I saw those and thought they were impacting the size of the video. I.e. make the video more narrow. In fact I have the first one set to 30% and it seemed to work. How do I move the text around and control the viewing height of the video independently of each other?November 1, 2019 at 9:11 pm #1051016Steig
Also, the video doesn’t loop forever. It times out after a while, but I do have loop set. Any idea what I can do to make it loop forever?November 1, 2019 at 9:18 pm #1051017Steig
I’ve been playing with the padding with some interesting results. Using left/right padding, I can move the text to the left & right. But the top bottom padding seems to make the viewing size of the background video change. And as it changes, I believe the text stays put. So if I make the video height larger, then the text appears to be horizontally centered.November 2, 2019 at 7:29 am #1051250DavidStaff
The Header Element container height is controlled by a. the top / bottom padding and the height of the content ( not the video ). The video is absolutely positioned to fill the header element.
If you put equal top and bottom padding then the content will be centred vertically.
Left and right padding can be used to move the content position to either side or restrict the width of the content.
Where exactly do you want the content positioned?November 2, 2019 at 8:33 am #1051399Steig
Our video is in post processing. The video you are seeing is simply filler so I can move the website along. I’ll play around with the settings per your direction.
Since the video fills the header element, can I control the size of the header element? In the customizer, I see more header padding controls under header layout, but those don’t seem to be impacting the video.November 2, 2019 at 8:38 am #1051410DavidStaffNovember 2, 2019 at 9:22 am #1051449Steig
Alright, I’m assuming we are right back into the controls where we started. Elements/Edit Element/Header. We established the Page Hero padding controls the layout of the text overlay. the Site Header doesn’t have any padding controls (I didn’t want to merge the header with content).
I do see a few other controls if I upload an background image, but that would cover up the background video.November 2, 2019 at 7:50 pm #1051667TomLead DeveloperLead DeveloperNovember 2, 2019 at 8:54 pm #1051686Steig
Perhaps I’m not understanding. I’m assuming that two separate controls exist. One for the background video and the other for the text overlay. I guessing at this point its all one set of controls, which clearly I don’t know how to manipulate.
Our video footage is 1080p at a 16:9 aspect ratio. When the video is shown edge to edge on the screen, it’s too tall and eats up too much above the fold screen real estate. So I wanted to make it more narrow. Instead of using pixels, I changed to percentages and set the top padding to 25%. That seemed to make the video background more narrow. But then if I’m to use the same padding controls to move the text around on the screen, I just get lost. If I change top & bottom padding to move the text to the middle, it just causes the background video to use of more pixels.
How can I keep the video footage more narrow and move the text overlay around as needed on top of it?November 3, 2019 at 4:41 am #1051834DavidStaffMarch 30, 2020 at 11:56 am #1219953ELM
I am wanting the test on the far right of the hero page the button included.March 31, 2020 at 3:50 am #1220555
- You must be logged in to reply to this topic.