[RISOLTO] Categoria blog: numero colonne diverso tra desktop e mobile

[begins]

Ciao a tutti!
Sto realizzando un sito in Joomla 3.4.1 ed utilizzo il template standard di base (protostar).

Vorrei visualizzare in homepage gli articoli (categoria blog) su 2 colonne per i pc, e in 1 colonna per il mobile.

È possibile fare questa differenziazione?

Grazie mille!

[lucantropo]

Protostar è un template responsive, quindi ottimizzato per il mobile (da verificare fino a che punto).
Quindi dopo che avrai impostato la visualizzazione degli articoli su 2 colonne dal menu sulla voce Home Page,  dovrebbe in automatico farlo vedere sugli smartphone su una colonna.
dico dovrebbe perché non lo ho mai usato o studiato. Verifica e nel caso non dovesse farlo puoi modificare il css del template.

[begins]

Ciao lucantropo!
Grazie per l'attenzione..
Purtroppo il template da solo non si imposta in 1 colonna nella versione mobile.
Sai gentilmente indicarmi dove intervenire nel css?

[lucantropo]

Purtroppo ora sono sullo smartphone, se usi Firefox e installi firebug puoi trovare da solo quello che cerchi, ti indicherà anche la riga del file css da modificare.
anche chrome ha un sistema simile ma non ricordo il nome, in ogni caso è già installato e lo trovi nelle opzioni cliccando il tasto destro in prossimità della zona del sito che vuoi controllare.

[begins]

Buongiorno!
Ho provato a guardare con "ispeziona elemento" di Google Chrome, ma non capisco dove si imposta il numero di colonne.
Tra l'altro per visualizzare gli articoli uso la famosa estensione K2.


Lascio il link del sito (in un dominio di prova visto che lo sto ancora creando), sperando di non fare una cosa non consentita, e sperando qualcuno ispezionando il codice mi sappia indicare esattamente dove intervenire con le modifiche.


http://m.basketballeverywhere.com/


Grazie mille!

[lucantropo]

Ciao, con k2 il metodo è identico ma devi scrivere nel css di k2.
Ancora meglio sarebbe inserire una copia del css di k2 direttamente nel template e disattivare quello principale.
L'operazione non è difficilissima ma devi sapere un minimo di html per farlo, dovresti scompattare lo zip di k2 e recuparare il file css che si chiama k2.css e inserirlo nella cartella css del template, nella index.php del template protostar dovrai inserire un codice di questo tipo

Codice: [Seleziona]

<link rel="stylesheet" type="text/css" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/css/k2.css" media="all"/>

Dall'amministrazione di joomla in k2>parametri k2>Impaginazione alla voce Css predefinito di K2 devi selezionare disabilita.
ora sul tuo file k2.css devi inserire in fondo un codice di qusto tipo

Codice: [Seleziona]

@media (max-width: 641px) {
    div.itemContainer { min-width:98%!important; margin:1% auto; width:98%;}
}

In questa maniera sui dispositivi tipo cellulari la colonna si vedrà a pieno schermo.

[begins]

Che dire!
Hai spiegato tutto talmente bene che in 5 minuti ho fatto e funziona perfettamente!!!


Grazie infinite!!


Spero possa tornare utile anche per altri!!


Sei stato gentilissimo!