Avisos
Vaciar todo
Buenos dias, tengo un video a través de un Iframe en Html insertado en la web, se ve bien y lo puedo modificar y demás.. pero me gustaria que se adaptará de forma responsive a cualquier dispositivo.
Estoy intentando insertar este código que se indica en respuesta a este tema en el blog en otro apartado
<iframe style="width:100%; height: auto" src="ruta al vídeo...
Pero no consigo que funcione y se me ve el video con una linea horizontal pero no se ve bien..
me podeis ayudar??
Gracias!!
URL del sitio: Contenido solo visible a usuarios registrados
Respondido : 14/06/2017 10:32 am
Hola Benigno.
Tienes que realizar alguna modificaciones:
.- Añade el siguiente código a tu archivo css que utilices para las modificaciones que realices
.videoWrapper {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
padding-top: 25px;
height: 0;
}
.videoWrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
Una vez tengas esto para incrustar un video por ejemplo de youtube tienes que envolverlo dentro de un div con el estilo que le indicamos anteriormente, sería algo parecido a esto:
Como vera se envuelve el iframe con un div y la clase que creamos anteriormente '
'
Uun saludo
Respondido : 14/06/2017 10:58 am
Gracias por la ayuda Pepe,
La inserción del codigo con el Iframe la hago a través de un módulo de Hmtl del PRestashop en el que insertamos esde módulo en la zona de la web y ponemos el iframe.. Me podrías guiar un poco más con los cambios en las hojas de estilo que me indicas???
Gracias
Respondido : 14/06/2017 11:11 am
Hola Benigno.
Accede a la carpeta themes/tuplantilla/css y dentro de esa carpeta tendrás un archivo global.css, edita el archivo y añade los códigos del primer bloque que te pase para el archivo css.
Con eso ya tendrás creado el estilo para que el video pueda ser responsive. Ahora toca añadir el video indicando la clase que creamos anteriormente
y el código del iframe que tengas, esto dentro del módulo html que tienes en tu prestashop.
Un saludo
Respondido : 14/06/2017 11:28 am
Hola Pepe,
tengo el mismo problema descrito por Benigno.
He intentado aplicar tu solución pero utilizo prestashop 1.7 - tema classic - y este no tiene archivo global.css, por lo tanto no tengo idea que archivo modificar y donde buscarlo.
Agradecería si pudieses ayudarme.
saludos
Respondido : 06/08/2018 10:05 pm
Hola
Para PS 1.7 dentro de la carpeta de tu theme classic busca la carpeta assets allí deberías ver una carpeta css en la cual deberían estar el archivo o archivo .css a usar, usulamente sería theme.css puedes probar agregando código al final
Documenta esto porque perderás los cambios en una actualización.
Si tienes dudas adicionales mejor consulta en un nuevo hilo
Saludos
Respondido : 06/08/2018 11:16 pm
