Ciao a tutti, sapete dirmi se c'è un modo per inserire più colonne all'interno dell area gestita con moduli e widget. in pratica vorrei che nella parte alta del forum ci fossero 3 colonne che rimandano a diverse parti invece di una lunga

 

ciao e grazie

Ti consiglio di configurare quello che vuoi tramite css, perchè almeno non hai poi problemi legati al responsive e a configurare il database sql.

quindi vai nel tema e modifica il file css custom.css

@media screen and (min-width: 980px) {
	/* c = $c = 3, 3 colonne */
	[data-widgetArea='header'] > ul > li{
		float: left;
		display: inline-block !important;
		padding: 0 !important;
		margin: 0 1% 2% !important; /* m = 1 */
		width: 32%; /*(100-(c*2-2)*m)/c => (100-(3*2-2)*1)/3 = 32 */
		vertical-align: top;
		height: 400px;
		overflow-y: auto !important;
		overflow-x: hidden !important;
	}
	/* http://lea.verou.me/2011/01/styling-children-based-on-their-number-with-css3/ */
	[data-widgetArea='header'] > ul > li:nth-of-type(3n+1):nth-last-child(1) {
		width:100%; margin-bottom: 0 !important; margin-right: 0 !important;
	}
	/* 3n+1 sta per prima della terza riga, 2 sta per penultimo dei li */
	[data-widgetArea='header'] > ul > li:nth-of-type(3n+1):nth-last-child(2),
	[data-widgetArea='header'] > ul > li:nth-of-type(3n+1):nth-last-child(2) ~ li {
		width:49%; margin-bottom: 0 !important;
	}
	[data-widgetArea='header'] > ul > li:nth-of-type(3n+2):nth-last-child(1) {
		margin-right:0 !important;
	}
	[data-widgetArea="header"] > ul > li:nth-of-type(3n+1):nth-last-child(3),
	[data-widgetArea="header"] > ul > li:nth-of-type(3n+1):nth-last-child(3) ~ li {
		margin-bottom: 0 !important;
	}
	/* LAST WIDGET {$c}n*/
	[data-widgetArea='header'] > ul > li:nth-of-type(3n){
		float: none;
		clear: both;
		margin-right: 0 !important;
	}
	/* FIRST WIDGET {$c}n+1*/
	[data-widgetArea='header'] > ul > li:nth-of-type(3n+1){
		margin-left: 0 !important;
	}
	[data-widgetArea="header"]::after {
		visibility: hidden;
		display: block;
		font-size: 0;
		content: " ";
		clear: both;
		height: 0;
	}
}

in questo modo hai 3 colonne senza dover fare particolari modifiche.

ci sono diverse opzioni che potresti seguire ovvero di restituire 2 colonne per tablet e 1 per cellulari... oppure evitare spazi vuoti cambiando "height" in "max-height" ma poi occorre fare ulteriori modifiche.

grazie milllissime ... ora testo... anche se devo prima risolvere qualcosa, perché ho finito la migrazione da Bulletin ma non vedo ancora nulla sul frontend..

Ciao, funziona bene, solo vedo che gestisce male la lunghezza dei titoli, secondo te c'è modo di metterlo a posto? forse il display?

grazie

gianluca

Modificato 25 Luglio 20178 anni da Gianluca73

devo guardare se si riesce a usare un table-cell cosi da avere altezze dinamiche e non fisse

11 ore fa, BomAle ha scritto:

devo guardare se si riesce a usare un table-cell cosi da avere altezze dinamiche e non fisse

grazie, cmq provo anche io a smanettarci tramite browser

con flexbox e simili sono sicuro ma non sarebbe compatibile con ie9 per esempio.