Avisos
Vaciar todo

Alineacion articulos joomla en varias columnas  

 
Daniel
 Daniel
Usuario eminente

Hola.

Tengo un problema de alineación de los artículos en la página de inicio. Utilizo los artículos nativos de joomla 3 y una plantilla responsive. Mi idea es ponerlos en cuatro columnas para pc y según el dispositivo que se ordenen en menos columnas. Todo esto ya funciona utilizando bootstrap.....pero el problema es que si un articulo es mas corto que el que le precede, la fila inferior queda bloqueada por el articulo mas largo y no llega completamente a la izquierda....
Hay algun método para solucionar esto..? O hay algún tipo de componente o modulo que lo solucione sin demasiados quebraderos de cabeza? He probado con k2 y tampoco veo solución fácil....

Saludos

URL del sitio: Contenido solo visible a usuarios registrados

Citar
Respondido : 21/04/2014 7:27 pm
Pablo Velasco
 Pablo Velasco
Illustrious Member

Hola,

Podrías probar a utilizar un módulo para cargar estas noticias. Una buena opción sería el módulo News Show Pro:

https://www.gavick.com/news-show-pro

Admite multitud de parámetro de configuración: número de columnas, número de caracteres a mostrar, etc.

ResponderCitar
Respondido : 21/04/2014 8:15 pm

Gestor de Contraseñas - VPN Conexión Segura - Gestor 2FA (Segundo Factor de Autenticación

Daniel
 Daniel
Usuario eminente

Gracias Pablo.
Excelente modulo. No lo conocía. Lo he estado probando pero no me soluciona lo que quiero hacer.
Mi intención es que se visualicen 4, 3, 2 o 1 columna según dispositivo.
Despues de mirar diferentes disposiciones lo he conseguido asignando la visualizacion de los articulos en una columna i colocandolos posteriormente en columnas con las clases css "col-xs-12 col-sm-6 col-md-4 col-lg-3" utilizando overrides del com_content.
Cada articulo esta dentro de un div con la clase row-x siendo la x el numero de articulo.
Así ya he podido aplicar clear:left segun tamaño dispositivo:
@media (min-width: 768px) and (max-width: 991px) {
.row-0, .row-2, .row-4 , .row-6{clear:left;}
}
@media (min-width: 992px) and (max-width: 1199px) {
.row-0, .row-3, row-6{clear:left;}
}
@media (min-width: 1200px) {
.row-0, .row-4, row-8{clear:left;}
}
Espero que le sirva a alguien....
Gracias y saludos

ResponderCitar
Respondido : 23/04/2014 2:31 pm
Pablo Velasco
 Pablo Velasco
Illustrious Member

Hola,

Gracias por el aporte, Daniel. Puede ser de mucha utilidad para otros usuarios del foro.

ResponderCitar
Respondido : 23/04/2014 5:34 pm

Cursos Gratuitos WordPress