Poner una segunda y tercera linea de Widgets en la Home  

Hola

Entiendo que lo que se muestra en utility son widgets que has ido agregando con separadores desde Apariencia > Widgets , lo que podrías evaluar es copiar todo ese código HTML que se genera en el front-end y agregarlo en un solo widget de texto o html y luego agregar otro widget (sin separador) y copiar y modificar el código

En conclusión tendrías que hacerlo con código HTML usando los widgets de texto.

Saludos.

He realizado lo indicado colocando solo dos Wigest en "Utility" con toda la información en cada uno y ha roto la linea de 4 horizontales y ha puesto la información en vertical. Adjunto captura.
Gracias

Hola

Debes usar el código HTML generado en el front-end del sitio que ya tiene las columnas definidas, puedes usar el inspector de código de tu navegador para ubicar el código html

Prueba usar el siguiente ´codigo CSS, como verás hay un contenedor rt-container y cada apartado esta dentro de un rt-grid-3

	

		

		
Toda la libreria
		
Aquí textos, bandas sonoras y derechos de representación.
		
	

	

		

		
Bandas sonoras
		
Aquí  las bandas sonorras de algunos espectáculos musicales o teatrales.
	

	

		

		
Derechos de representación
		
Para realizar mas funciones adquiera los derechos pertinentes.
	

	

		

		
Solo textos musicales
		
En esta pagina encontrará solos textos que son obras de teatro musical.
	

Saludos.

Estimado Jhon podrías darme una pista más o camino a seguir porque estoy algo perdido y no he logrado hacerlo. que no he logrado hacerlo. También he leído que en lugar de hacerlo con los Widgets tambien podría modificar la plantilla para incluir esas tres lineas de cuatro fotos cada una.
Muchas gracias.

Hola

Primero deja la posición transition sin ningún widget, luego crea un widget de texto o html ( en modo codigo) agrega todo el código HTML que te envié anteriormente.

Es decir estas maquetando las columnas directamente con el HTML y no usando divisores
Luego para probar puedes agregar otro widget de texto y poner el mismo código, debería aparecer debajo nuevamente 3 columnas.

Saludos.

Buenas tardes Jhon todo a funcionado bien, he colocado dos lineas de fotos y he cambiado los enlaces al texto en lugar de a las fotos.
Pero las fotografias están pegadas una a lado de las otras, es posible realizar una pequeña separación entre ellas?
Adjunto imagen.
Gracias por tu ayuda.

Hola

Podrías añadir código CSS, sin embargo para que este código no entre en conflicto con otras partes de tu sitio, al contenedor principal añade alguna clase, es decir ahora tienes

class="rt-container"

Dejalo por ejemplo con

class="rt-container linea"

Luego podemos usar linea como clase para codificar CSS

Saludos.

Perdón mi torpeza creo este archivo class="rt-container linea" en la carpeta CSS?
Me puedes aclarar la ruta
Gracias

Hola

No se trata de crear archivos, simplemente cambia el código, en el inicio del código tienes

La idea es dejarlo con una clase adicional para identificarlo únicamente y poder hacer cambios

Saludos

Ya he realizado la modificación, pero no veo ningún cambio.

Hola

Cierto, aún no se ve ningún cambio porque "linea" no tiene ningún código CSS, ahora agrega lo siguiente al final de tu archivo CSS:

@media (min-width:768px){
  .rt-container.linea .rt-grid-3{
    width:24%;
    margin-right:1%;
  }  
}

Puedes colocar este código al final de este archivo:
/wordpress/wp-content/themes/helena_wp/style.css

PD: Refresca tu navegador para ver los cambios

Saludos.

Gracias Jhon todo solucionado, funciona perfectamente.
Un saludo