Web Construcción Video Full Screen Youtube o Mp4
Autor: Graphic Designer XFBuenas tardes a todos como estas,
Necesito un ayuda importante como crear sitios en construcción pero con video el fondo youtube o video propio mp4 y colocando encima el texto y formulario.
Pero ahora estoy decepcionado acabe comprar el programa websitex5 2019 pro ayer hable con soporte chat online me dice que todo se puede pero no encontre ningun como se hacen para meter el fondo de video background que tenga facilidad.
Te voy a enviar lo que hice la web en adobe muse pero quiero pasar a websitex5 pro pero funcionando con video el fondo youtube o video propio mp4.
http://www.makroeventos.com.co/
Asi como se muestra la pagina video el fondo y encima texto y formulario pero veo que websitex5 se puede o no se puede porque acabe comprar el programa y veo que no hay opcion.
Alguien me puede ayudar como se hacen en websitex5 que sea facilidad y puse pagina en construcción pero pongo estilos no veo video fondo con pantalla completa como youtube o video propio m4.
Quedo muy atento.
Saludos
(It > Es) ... ... ese sitio no fue hecho con WebSiteX5 ...
... puedes usar el fondo de la línea:
>> Paso 4 - Páginas > Opciones de la Barra de Herramientas y Rejilla > Ventana Estilo de las Filas
>> Vídeo: como fondo de la Fila se emplea un vídeo.
... o para el fondo puede usar código EXTRA, por ejemplo YT + TUBULAR ...
ciao
.
Autor
No este sitio fue creado Adobe Muse pero como te comente estoy haciendo por websitex pero no veo opcion para agregar el fondo video como youtube o mp4 pero aunque websitex falta mucho para mejorar veo que falta tecnología es un camello este trabajo :-(
... has hecho clic en el enlace anterior ...?...
Hola Javier
La sugerencia de KolAsim es la correcta, puedes insertar un video de fondo a través del Estilo de fila en el Paso 4:
A partir de ahí, debería poder aplicar un video como fondo a una fila.
Tenga en cuenta que la fila deberá tener Objetos en ella, o el fondo no se mostrará ya que la fila está vacía.
Pruébalo y mantenlo informado aquí
Gracias
Stefano
Autor
Pero eso queda en pantalla completa como full screell que ocupe todo la pantalla asi como te envie una muestra en link como se deben ser.
Voy a comprobar a ver si funciona
Quedo muy atento
Saludos
Hola Javier
Veo que tienes v2019.2 disponible para usar.
Para que la fila con el video ocupe todo el alto del navegador, tiene dos opciones:
1) inserte suficiente objeto en una fila para que sea lo suficientemente alta como para llenar toda la pantalla
2) haga uso de la nueva funcionalidad de Full-Height que extiende cada fila de la página para llenar el espacio de la pantalla verticalmente:
Prueba estas dos opciones y hazme saber si te funciona
Gracias
Stefano
Autor
A listo voy a comprobar a ver si me funciona
Pero te comento algo espero que pueda actualizar el futuro que tenga opciones o una casilla de verificación que diga video pantalla completa para el fondo es una buena opcion muchos clientes pide eso.
Quedo muy atento
Saluldos
Autor
Buenas tardes Stefano como estas,
Bueno te cuento es que hay mucho problema con el programa porque eso falta mucho para mejorar...
1. Se ven tan mala calidad el icono o logo para el movil (Por favor agregar la opcion de imagen para el formmato SVG para mayor calidad de movil).
2. El video fondo no esta funcionando youtube full height pero el problema yo puse la opción full height es correcto pero el video youtube no se nota full height como te comente es un problema muy grande para este programa que no veo tan profesionalmente te puse una idea que falta mejorar la herramientas por ejemplo la opción youtube casi no tiene nada falto colocar que diga background video, full widht video, full height video algo asi pero no tiene ninguna opción para poder manejar el video como tamaño completa y otro personalizable con medidas de tamaño PX.
3. Ahora el problema de formulario se ven bien pero el boton donde dice envíar eso es decepción porque necesito las medidas del boton como tamaño PX si le doy algo anchura por ejemplo tamaño 250 px pero cuando uno se ven el movil se nota mal el boton no esta funcionando bien y ahora necesito el color el fondo de boton pero con over cuando uno pasa el mouse over que cambiar el color de boton enviar pero veo que no tiene eso muy mal.
4. Otro problema el video Background Youtube por websitex5 profesional hay un video que se congelan no esta trabajando bien espero que pueda solucionar y agregar buen opción de youtube ejemplo te voy a enviar asi como muestra las herramientas completa en youtube.
5. Ahora mire la opción websitex de youtube que no tiene casi opcion como vamos a manejar que falta mas opción para el fondo, full widht, full height eso super importante.
Te voy a enviar en link que hice puro webistex5 pero hay una falla que no esta trabajando bien.
1. www.javierfrasser.com/makro2019 (Creado por Websitex5)
2. www.makroeventos.com.co (Creado por Adobe Muse)
Mire la direferencia el diseño de la web adobe muse que hice por makro eventos si vio que se nota bien el fondo video que no teine un marco negro y arriba en header que no tiene es transparencia para que pueda lograr bien el fondo de video y poner encima el texto por header sin tapar el fondo y ahora el formulario donde se nota el boton enviar un mensaje se ven igual a la linea donde esta alineado es correcto cuando se adapta se ven igual el boton pero veo que websitex lo hice igual el tamaño pero cuando se nota el movil el boton queda muy anchura y no se adapta bien eso hay un error por la fallas. Otra cosa ahi se nota el boton con mouse over que se cambia el color donde dice ENVIAR UN MENSAJE pero websitex no tiene opcion de boton mouse over.
Autor
Te voy a enviar el video por lo que se muestra el programa webistex5 profesional.
1. Como hago para el header tenga la transparencia que se note el fondo de video adjunto link asi como se muestra http://www.makroeventos.com.co/
2. Falta opción youtube para el fondo pantalla completa y otro mas opción youtube ocultar el logo de la marca youtube, poner opción loop, tipo de tamaño para youtube como full widht, full height, background video full screen.
3. Te envio la prueba de websitex por youtube
https://youtu.be/cKAqblfEeA8
Quedo muy atento.
Saludos
Hola Javier
Intentaré abordar todas las dudas que tengan. Tenga en cuenta que Muse y WebSite X5 son programas muy diferentes. Es muy probable que a ambos les falte algo que el otro software tiene. Sin embargo, siempre existe la posibilidad de mejorar, así que no dude en sugerir nuevas funcionalidades para el software que cree que podrían ser útil.
1_ SVG: en este momento, el software no admite SVG en los objetos de imagen estándar o en las galerías. Sin embargo, todavía es posible incrustarlo en el objeto HTML. Este asunto ya ha sido notificado a los desarrolladores para que esta posibilidad pueda aparecer en el futuro.
2_ El video de YouTube como fondo: me parece que lo hiciste correctamente. Por lo que puedo ver en la captura de pantalla de Muse, no todas las opciones que se muestran allí están actualmente disponibles en WebSite X5. En su sitio web anterior, el video se amplía para mostrarlo en su totalidad, recortándolo por los lados para llenar la pantalla. WebSite X5 no hace eso. Deberá proporcionar un video con la proporción correcta para que llene la pantalla por completo como lo esperaría.
3_ El botón "enviar": no estoy seguro de entender el problema con su tamaño. Tenga en cuenta que no puede cambiar su tamaño según el breakpoint en el que se encuentra actualmente, por lo que debe intentar dimensionarlo para que se vea bien tanto en el escritorio como en el móvil. Puedo confirmar que en este momento, no existe una opción de mouseover para este botón específicamente, aunque sí para muchos otros dentro del software
4 y 5_ Igual que el número 2
6_ Menú transparente: puede establecer su transparencia en la ventana de color, pero esto no le dará el resultado que desea. En su sitio web anterior, el video comienza justo debajo del encabezado y esto no es posible en WebSite X5. Lo que podría hacer es configurar el encabezado para ocultar en la página de inicio en el Paso 3:
Esto solo mostrará el Stickybar, que le dará el resultado que desea. Solo hazlo transparente:
Para todas las funciones que mencionó y que desafortunadamente no están disponibles, sugeriría abrir un nuevo tema de idea. Esta es la mejor manera de que el personal sepa qué le gustaría que se agregue en el software en el futuro y que el personal realice un mejor seguimiento del mismo.
Espero haber sido de ayuda
Stefano
Autor
Hola Stefano,
Listo ya quedo lo que explicaste pero el problema es que el stick bar se queda fijo como desplazamiento pero haga cuenta que tiene scroll que se mueven donde esta header se queda fija pero deben tener el header quedde quieto asi como la demostración de adobe muse ahi falto la opción de websitex que quede header en transparencia y que sea quieto pero no fija. Pero ahi me sirvio pero falta agregar la idea todo esta perfecto pero lo unico que hay error es el video que no muestra la pantalla completa como full screaner brackground video.y como puedo solucionar el video el fondo quede como la pantalla completa sin moverse en scroll que se adapte aoutomatico.
Quedo muy atento
Saludos
Autor
Hola Stefano,
Te voy a enviar la captura directamente el celular android, haga cuenta este imagen donde muestra si viste el stick bar se tapa el logo claro porque el boton y el icono de redes sociales se queda fija por eso asi no sirven por lo que se nota mal lo que se ven el movil y ahora el programa de la calidad del logo y el boton si se dio cuenta que no mejora la calidad en PNG eso deben mejorar mucho y ademas tambien deben manejar bien el color especial para la web RGB que sea muy profesional.
Deben agrear una idea como header para poder manejar la transparencia para poner el contenido pero que no se a el bloque porque si yo pongo transparencia en header se nota el fondo blanco como si fuera el bloque por eso no se ven.
Ademas yo hice un ejemplo otro opcion una prueba yo coloque estructura de la plantilla y puse encabezamiento y con la altura 0 correcto y despues di el click contenido de la plantilla para poner el contenido del boton llama y el redes sociales pero resulta ahi no muestra nada porque esta cerrado la altura para que se quede ahi en header si tener fija no como stick bar si me explico ahi deben mejorar para que el contenido de la plantilla no deben cerrar la altura es el unico que deben mejorar para encabezado importante asi como muestra el ejemplo de adobe muse - http://www.makroeventos.com.co/ comprueba la altura se dara cuenta como se maneja en scroll por lo que estamos haciendo el program websitex de la diferencia. http://www.javierfrasser.com/makro2019/ - Stick Bar
Quedo muy atento
Saludos
Autor
Se me olvido colocar el imagen adjunto
Quedo muy atento
Gracias
Hola Javier.
He analizado el problema con el video que no comienza en el fondo de linea. Es posible que esto se deba a las políticas de Chrome, donde ningún video puede iniciarse automáticamente si contienen audio.
Para su sitio web anterior, el script que incrustaba el video ya se encargaba del audio automáticamente y, por lo tanto, podía permitir que el video comience sin problemas.
En este caso, WebSite X5 utiliza una inserción estándar de YouTube que no hace esto.
Puede intentar solucionar este problema cargando una segunda copia del video sin ningún tipo de audio en YouTube e intente incrustarlo.
Déjame saber si funciona entonces
Mantenme informado sobre esto
Gracias
Stefano
Autor
Hola Stefano eso no tiene nada que ver el video el fondo el problema el video el fondo que no arranca el video es la falla de websitex eso tiene que ver...
Y segundo donde esta el boton naranja llamar se tapa el logo donde esta cuadrado hay una falla error de websitex.
Mire el video background que hice fue Adobe muse todo funciona perfecto hasta el movil sin problemas el video ya te habia dicho no tiene nada que ver el video es error grande de websitex5
http://www.makroeventos.com.co/ Software fue creado """ADOBE MUSE"" por eso carga bien el video inmediato y funciona el video background hasta el movil android.
Quedo muy atento
Saludos
Autor
Pero como te digo como falta la opcion de video youtube websitex como una casilla de verificación dede youtube por ejemplo desactivar loops, desactivar audio, ocultar marca youtube algo asi por ejemplo el programa adobe muse tiene widgets varias opciones que puede desactivar pero en websitex no tiene ninguna opción porque yo no le puedo decir al cliente que quite el audio porque ellos me enviaron en link para poner el fondo video completa con youtube. cuantas veces le dije y no me pones cuidado no se dio cuenta donde dice el boton llamar no se da cuenta que esta mal con el logo el fondo revisar el celular por favor.
Ejemplo imagen ADOBE MUSE - WIDGETS YOUTUBE 2.0
Haga cuenta que hay opciones de verificaciones para desactivar dice MUTE (Sin audio)
AHORA VERSION WEBSITEX - NO VEO LA DESACTIVACIÓN DE AUDIO COMO MUTE
Por favor revisa LA VERSIÓN MOVIL
Quedo muy atento
Saludos
Hola Javier.
Como muestra también en su captura de pantalla, Muse le permitió eliminar el audio del video, lo que probablemente explica por qué el video está funcionando automáticamente en el sitio web anterior. Como mencioné anteriormente, el software actualmente no lo permite, ya que pudiste verificarlo usted mismo dentro del software y actualmente tampoco hay forma de evitarlo. La única posibilidad sería eliminar el audio a través de algún tipo de código personalizado como los otros elementos que desea eliminar del video de YouTube o cargar un video sin audio.
Desafortunadamente, el personal no puede brindar soporte para estos códigos, pero puedo informarles a los desarrolladores sobre esta necesidad particular para que puedan ser considerados para una futura mejora del software.
Acerca de la Sticky Bar, creo que podría solucionar esto de alguna manera manejando la vista responsive.
Vaya a la configuración de la Sticky Bar o al contenido de la Plantilla en el Paso 2 e intente reposicionar estos Objetos para la vista móvil:
Quizás puedas resolver esto organizando los elementos de manera diferente
Espero haber sido de ayuda
Stefano
Autor
Capturo la pantalla no se a que se refieren en stick bar porque aca se ven bien pero cuando previsualiza la pagina se ven mal el movil por lo que tapa porque el stick bar funciona solo imagen fija pero por favor revisa el movil te voy a enviar ejemplos porque hay falta mejorar mucho el websitex pro.
http://www.makroeventos.com.co/ CREADO ADOBE MUSE HEADER - ENCABEZADO FUNCIONA BIEN EL MOVIL SIN FIJA.
http://www.javierfrasser.com/makro2019/ CREADO WEBSITEX PRO 2019.2.5 HEADER CON STICK BAR LE TAPA EL LOGO Y FALTA OPCION BACKGROUND VIDEO FULL SCREEN Y DESACTIVAR AUDIO NO TIENE NINGUNA OPCIÓN.
Como puede solucionar y llevo varios dias nada que sirven.
Saludos
Autor
Envio pantalla captura
Hola Javier
Como mencioné en mis posts anteriores, actualmente no hay nada más que se pueda hacer para el video. La opción de personalizar esos parámetros específicos actualmente no está disponible dentro del software y requeriría que se agregue un código personalizado, para lo cual el personal no puede brindar asistencia. Por el momento, sugiero abrir un nuevo tema de Idea que informe las opciones exactas que Muse permite para que el personal las tenga en cuenta para futuras mejoras en la funcionalidad.
Sobre el encabezado:
Si lo comprendo correctamente y no desea que estos elementos bloqueen la vista del logotipo, es posible que desee apartarlos y cambiar un poco el diseño del menú móvil.
Acerca de la Sticky bar: en caso de que la Sticky bar se muestre en el móvil, puede cambiar su configuración en el Paso 2
Es solo otro tipo de menú que aparece una vez que la página se desplaza hacia abajo. No estoy seguro de que este sea el que aparece en su imagen, pero quizás también pueda ser útil:
Intente volver a visitar el diseño del menú en el dispositivo móvil y ver si se puede resolver el problema
Gracias
Stefano
(It > Es) ... para el video de fondo, no lo ha intentado, pero con un compromiso mínimo de su parte, ya podría haberlo resuelto, de las dos maneras, como se mencionó al principio en la primera publicación: https://helpcenter.websitex5.com/es/post/213531#comment1
...
.
ciao
.