[Resolved] Poner videos en la cabecera

[Jesús]

No se si se pueden poner videos en la cabecera , en caso de que se puedan poner videos diferentes ¿ Me pueden decir como?

[Fernando]

Hi Jesus,

Here is an article you may refer to with regards to adding background videos to the Page Hero/Header Element: https://docs.generatepress.com/article/page-hero-background-video/

Kindly take note that the URL has to be a direct URL to the file.

If you wish to add a Video Block, this should also be possible as such: https://share.getcloudapp.com/4guKbOkR

Hope this helps! 🙂

[Jesús]

Espero entendaís mi ignoracia respecto a esto pues es la primera v4ez que lo hago
Agregar un video de fondo a nuestro Page Hero es muy fácil. Solo necesitamos agregar algo de HTML en el área de contenido y agregar algo de CSS a nuestro sitio.
lo primero que pone es Lo primero que debemos hacer es estructurar nuestro HTML dentro del contenido de nuestro Elemento. Aquí hay un ejemplo:
Imagino que en el html viene puesto el css en este que pone el ejemplo

<video loop muted autoplay poster=”URL/TO/poster.jpg” class=”background-video”>
<source src=”URL/TO/video.mp4″ type=”video/mp4″>
<source src=”URL/TO/video.webm” type=”video/webm”>
<source src=”URL/TO/video.ogv” type=”video/ogv”>/video>

Your Element content in here.

Como en este caso el video va en la cabecera voy a elementos Utilice nuestro generador de temas de editor de bloques, cree enlaces HTML avanzados y obtenga más control de diseño.Me aseguro que este activado y voy a elementos>añadir nuevo elemento elijo cabecera, donde pone crear haglclik y elijo pagina hero, hay elino unir y en el recuadro blanco pongo ese html, Solamente preguntar si hasta ¿hay voy bien para seguir ?luego LE PONGO TITULO A LA CABECERA Y en caso de ir bien continuo. Gracias. Solo saber si es¿ un video lo que sale pues la cabecera es muy ancha?.Las medidas iran mas daelante puestas

[Jesús]

disculpar el html es
<video loop muted autoplay poster=”URL/TO/poster.jpg” class=”background-video”>
<source src=”URL/TO/video.mp4″ type=”video/mp4″>
<source src=”URL/TO/video.webm” type=”video/webm”>
<source src=”URL/TO/video.ogv” type=”video/ogv”>
</video>

Your Element content in here.

Tambien creo hay que instalar un tema hijo pone si me pueden dar el link del tema hijo una vez descargue uno de internet pero ahora no lo encuentro. Ya me dicen y si voy muy mal pues desago lo hecho y empiezo Gracias y disculpar por mi ignorancia en esto

[Ying]

Hi Jesus,

Seems you are using the first method, if so, the HTML code goes into a header element, not a block element with HTML block.
https://www.screencast.com/t/1BzVXEYzcKIL

For the child theme, here’s the documentation with the file downloading link:
https://docs.generatepress.com/article/using-child-theme/

[Jesús]

no puedo cargar el tema hijo por que tengo cosas puestas en CSS adicional y entonces pueden producirse cambios en mi WEB he leído.
Haber voy a elementos>añadir nuevo elemento en lo que abre Elige tipo de Elemento hay 4 bloque hook diseño y cabecera yo elijo cabecera no viene encabezamiento pero imagino es lo mismo luego le doy a crear Añadir nuevo encabezado creo hasta hay voy bien es un elemento encabezado luego vienen estas 4 Encabezamiento del sitio. Hasta aqui voy bien
del sitio vienen nueve valores
encabezamiento del sitio
Página Hero: que es donde pongo el codigo html el que pongo debajo
<video loop muted autoplay poster=”URL/TO/poster.jpg” class=”background-video”>
<source src=”URL/TO/video.mp4″ type=”video/mp4″>
<source src=”URL/TO/video.webm” type=”video/webm”>
<source src=”URL/TO/video.ogv” type=”video/ogv”>
</video>
REGLAS PARA MOSTRAR posicion pagina principal EXCLUIR todo el sitio USUARIOS todos los usuarias he puesto
notas internas hay sale puesto por defecto el HTML PUESTO
<video loop muted autoplay poster=”URL/TO/poster.jpg” class=”background-video”>
<source src=”URL/TO/video.mp4″ type=”video/mp4″>
<source src=”URL/TO/video.webm” type=”video/webm”>
<source src=”URL/TO/video.ogv” type=”video/ogv”>
</video>

Despues pone
Ahora que nuestro HTML está configurado, podemos agregar el CSS: el css de abajo donde lo coloco tengo dos plugin simple css y simple
custon css por si pueden valer alguno de estos dos plugin
.background-video {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
opacity: 0.5;
}

.page-hero {
position: relative;
overflow: hidden;
}

.background-video-content {
position: relative;
z-index: 1;
}

video[poster] {
object-fit: cover;
width: 100%;
height: 100%;
}

[Ying]

I tried Google translate, but I’m still not sure I fully understand your reply.

In order to make the video to show up properly, you’ll need to add some top/bottom paddings in your header element:
https://www.screencast.com/t/PJaFntx70V

For users options, what was your settings? If you want to show all users, you just need to leave that field blank.

And location, do you choose front page? If so, it should work on your homepage.

Let me know 🙂

[Jesús]

Gracias ya nos queda poco. Ahora necesito el video de la cabecera sea menos ancho o lo que es lo mismo menos alto o mas estrecho es por el idioma lo pongo de diferentes formas.
Esta es mi url: https://www.coachdrogas.eu/

[Ying]

If you want the video to be shorter, try reduce the padding top/bottom.

If you want the video to be narrower, try set the container width to containedinstead of full width.

https://www.screencast.com/t/p1tZRBceBJah

[Jesús]

Gracias, eso ya lo tengo pero hasta no terminar van surgiendo cosas, no tengo barras laterales tengo dos menús con la navegación debajo la cabecera, del primario y del secundario ¿ Cómo puedo ponerlos otra vez debajo de la cabecera antes del contenedor los dos , tengo uno encima y otro debajo con estos cambios se han quedado en medio de la cabecera y hay quedan muy poco estéticos. De la manera personalizar<Diseño<Navegacion principal>encima de la cabecera o debajo. Se quedan los dos menús en el medio de la cabecera

[Ying]

Do you want the video show below all of your navigations?

[Jesús]

No todo lo contrario los dos menús de navegación que tengo debajo del video el video arriba https://www.coachdrogas.eu/

[Ying]

So you want the video to show above your navigations?

Then try this CSS, feel free to adjust the top values.

@media (min-width: 769px) {
.home .header-wrap {
    top: 275px;
}
}
@media (max-width: 768px) {
.home .header-wrap {
    top: 148px;
}
}

[Jesús]

Dame los valores exactos por favor por que si bajo uno se sube el otro si subo uno baja el otro y así todo el rato, ya me da igual si quedan los dos menus de navegacion arriba del todo o abajo de el video pero en un sitio o en el otro yo no puedo hacerlo, si te es más facil damelos arriba del todo del video . yo si lo hago no me sale llevo toda la tarde poniendo valores y nada de nada, voy a romper todo el trabajo que llevaba hecho , mira a ver si puedes porfavor

[Jesús]

Al final del todo poniendo el video mas largo he podido hacer algo, ahora me queda acercar el menú principal al secundario sin poner nada de css por que no quedaba bien lo mismo para subirlo si, los menus quedan arriba de la cabecera a sido imposible ponerlos debajo, solo dime como subir el menú principal secundario . Mi Web es https://www.coachdrogas.eu/ por si necesitas echarle un vistazo

[Author]

Posts