Autore Topic: [RISOLTO] Posizioni colonne template su mobile  (Letto 268 volte)

Offline Antonio Tripodi

  • Nuovo arrivato
  • *
  • Post: 31
    • Mostra profilo
[RISOLTO] Posizioni colonne template su mobile
« il: 16 Mag 2017, 10:44:31 »
Salve a tutti, utilizzo at_grafic come template e ho creato vari stili in base alle esigenze del sito. Il template comprende Helix 3 che mi consente di personalizzare il template a mio piacimento. Gli stili creati vanno bene per la visualizzazione da desktop ma nei mobile vorrei che l'ordine di visualizzazione delle colonne fosse diverso. Su desktop le colonne sono in questo ordine 1.left 2.component 3.right, su mobile voglio che la prima colonna che si veda sia la component dove è presente l'articolo. sapete indicarmi come ordinare le colonne su mobile? In allegato lo screen-shot del settaggio della colonna che helix mi da.
Grazie
« Ultima modifica: 20 Mag 2017, 09:49:32 da Antonio Tripodi »

Offline Antonio Tripodi

  • Nuovo arrivato
  • *
  • Post: 31
    • Mostra profilo
Re:Posizioni colonne template su mobile
« Risposta #1 il: 18 Mag 2017, 09:47:36 »
Nessuno mi può aiutare?

Online marine

  • Moderator
  • Instancabile
  • *****
  • Post: 2338
  • Sesso: Maschio
    • Mostra profilo
Re:Posizioni colonne template su mobile
« Risposta #2 il: 18 Mag 2017, 12:18:26 »
Duplichi i moduli e li fai visualizzare nella posizione che ti interessa solo nei media desiderati.

Offline Limma

  • Appassionato
  • ***
  • Post: 380
  • Sesso: Maschio
    • Mostra profilo
Re:Posizioni colonne template su mobile
« Risposta #3 il: 18 Mag 2017, 12:29:48 »
Duplichi i moduli e li fai visualizzare nella posizione che ti interessa solo nei media desiderati.


Geniale!  ;)

Offline Antonio Tripodi

  • Nuovo arrivato
  • *
  • Post: 31
    • Mostra profilo
Re:Posizioni colonne template su mobile
« Risposta #4 il: 18 Mag 2017, 18:54:32 »
Se ho capito bene devo duplicare i moduli ed inserirli in colonne che vengono visualizzati solo su mobile.
Ad esempio nel mio caso ho 1.left (devo spuntare l'opzione nascondi mobile) 2. component, 3 right e poi aggiungere un'altra riga con una nuova posizione ad esempio posizione1  visibile solo su mobile sulla quale inserisco il modulo duplicato. In questo modo in mobile ho prima component poi right ed infine posizione1.
é una possibile soluzione, non quello che speravo ma comunque da considerare.
Grazie mille
« Ultima modifica: 18 Mag 2017, 18:56:34 da Antonio Tripodi »

Offline tomtomeight

  • Global Moderator
  • Fuori controllo
  • ********
  • Post: 27605
  • Sesso: Maschio
  • Chi si specializza muore. Chi divaga troppo affoga
    • Mostra profilo
    • Xataface Italia
Re:Posizioni colonne template su mobile
« Risposta #5 il: 18 Mag 2017, 19:36:34 »
Devi duplicare solo i moduli e non anche le pisizioni che restano le stesse. Poi in ogni modulo decidi se  pubblicarlo in base al device. Se il template non prevede assegnazione in base al device puoi sempre agire da suffisso classe ed agire da css.
NEWS DataGrill Xataface Installer (Ver. 1.0.0) per Joomla 3.6 ed un Esempio Applicazione Bblioteca

Online marine

  • Moderator
  • Instancabile
  • *****
  • Post: 2338
  • Sesso: Maschio
    • Mostra profilo
Re:Posizioni colonne template su mobile
« Risposta #6 il: 18 Mag 2017, 20:45:01 »
Se il template non prevede assegnazione in base al device puoi sempre agire da suffisso classe ed agire da css.

Helix 3 lo permette

Offline tomtomeight

  • Global Moderator
  • Fuori controllo
  • ********
  • Post: 27605
  • Sesso: Maschio
  • Chi si specializza muore. Chi divaga troppo affoga
    • Mostra profilo
    • Xataface Italia
Re:Posizioni colonne template su mobile
« Risposta #7 il: 18 Mag 2017, 21:27:59 »
Si ma il consiglio può essere applicato in generale a prescindere dal template, perciò ho specificato.  :)
NEWS DataGrill Xataface Installer (Ver. 1.0.0) per Joomla 3.6 ed un Esempio Applicazione Bblioteca

Online marine

  • Moderator
  • Instancabile
  • *****
  • Post: 2338
  • Sesso: Maschio
    • Mostra profilo
Re:Posizioni colonne template su mobile
« Risposta #8 il: 18 Mag 2017, 21:40:37 »
Si ma il consiglio può essere applicato in generale a prescindere dal template, perciò ho specificato.  :)

Ottima osservazione

Offline Antonio Tripodi

  • Nuovo arrivato
  • *
  • Post: 31
    • Mostra profilo
Re:Posizioni colonne template su mobile
« Risposta #9 il: 19 Mag 2017, 12:30:07 »
Adesso mi è più chiaro, posso scegliere se far vedere o nascondere un modulo a secondo dei media. Per poter nascondere il modulo, ad esempio sul desktop, inserisco hidden-desktop come Suffisso classe CSS modulo, il problema è che con il template protostar me lo accetta, ma con il template at_grafic no, non riesco a capire il motivo. Vi allego il link con un esempio http://www.calabriaprova.joomlafree.it/province/vibo-valentia.html qui il modulo con la foto vibo valentia è impostato come nascosto su desktop ma continua a comparire. Forse deve essere modificato il file index
Grazie comunque dei consigli
« Ultima modifica: 19 Mag 2017, 17:03:26 da Antonio Tripodi »

Offline Antonio Tripodi

  • Nuovo arrivato
  • *
  • Post: 31
    • Mostra profilo
Re:Posizioni colonne template su mobile
« Risposta #10 il: 19 Mag 2017, 18:45:02 »
http://www.calabriaprova.joomlafree.it/province/vibo-valentia.html
Ho corretto il link, avevo sbagliato, grazie ancora a abbia voglia di aiutarmi

Offline Limma

  • Appassionato
  • ***
  • Post: 380
  • Sesso: Maschio
    • Mostra profilo
Re:Posizioni colonne template su mobile
« Risposta #11 il: 19 Mag 2017, 22:54:43 »
Adesso mi è più chiaro, posso scegliere se far vedere o nascondere un modulo a secondo dei media. Per poter nascondere il modulo, ad esempio sul desktop, inserisco hidden-desktop come Suffisso classe CSS modulo, il problema è che con il template protostar me lo accetta, ma con il template at_grafic no, non riesco a capire il motivo.

Il tuo template, che come dici è realizzato su Helix 3, dovrebbe quindi utilizzare le classi Bootstrap 3, grazie alle quali puoi realizzare molto facilmente quello che stai cercando di fare.
Ho fatto una piccola prova e puoi vedere il risultato qui: da desktop vedrai un modulo a sx e uno a dx del content, da smartphone vedrai incolonnati prima il content (come vuoi tu) e sotto un modulo "replica" di quello che nella visualizzazione desktop stava a sx, seguito da un altro modulo.

Procedura:
- al modulo che vuoi visualizzare da desktop (e solo da desktop) a sx del content (nel mio template messo in "posizione left) applichi la classe visible-lg
- al modulo "copia" che invece vuoi far visualizzare da mobile sotto al content applichi la classe visible-xs (e che nel mio template ho messo quindi in "posizione right")

Questo è tutto. E il tutto è racchiuso in una "tabellina" che puoi consultare al paragrafo "Responsive utilities" in questa pagina di documentazione di Bootstrap 3.
« Ultima modifica: 19 Mag 2017, 22:57:19 da Limma »

Offline Antonio Tripodi

  • Nuovo arrivato
  • *
  • Post: 31
    • Mostra profilo
Re:Posizioni colonne template su mobile
« Risposta #12 il: 20 Mag 2017, 09:48:38 »
Grazie mille Limma, adesso ho risolto sei stato chiarissimo, io avevo capito la procedura ma non riuscivo ad ottenere il risultato poichè inserivo il suffisso hidden-desktop e non visible-lg. In nessuna guida online avevo trovato tale suffisso e quelli che inserivo evidentemente non erano adatti al mio template. Grazie ancora a tutti, questo forum è davvero utilissimo  ;D

 

Torna su