• User Attivo

    Versione mobile del sito

    Ciao a tutti,

    una domanda forse banale.
    Come faccio a far vedere in automatico la versione mobile su un cellulare senza cliccare su eventuali pulsanti "versione mobile"?

    Sono dietro alla prima realizzazione di questo genere 😊.

    Grazie 1000:smile5:


  • ModSenior

    Ma nessuna domanda è mai banale?

    Però non sono sicuro di avere capito bene cosa intendi, forse ti interessa sapere come redirezionare automaticamente le visite provenienti da dispositivi mobile sulle pagine fatte apposta per loro, magari pubblicate su un dominio di terzo livello senza che l'utente debba cliccare su un link?

    Valerio Notarfrancesco


  • User Attivo

    Grazie 1000! :smile5:

    Esatto, mi sono spiegata malissimo ma tu hai capito perfettamente :smile5:


  • ModSenior

    Il modo migliore per farlo è con un redirect lato server, individuando una caratteristica che ti indentifica il visitatore mobile e lato server redirezionarlo su un altro url.

    Un modo è leggere la stringa user agent che invia il browser, se è un browser mobile allora lo redirezioni su un altro url. Come farlo dipende da che tipo di linguaggio puoi usare sul tuo server, se puoi usare ad esempio il php puoi usare questa libreria che ti fa tutto in automatico: Detect Mobile User Agents & Browsers che trovi qui: detectmobilebrowsers.mobi

    Ovviamente puoi farlo anche a mano senza usare librerie, ti prendi le 3 o 4 stringhe dei browser mobile che vuoi redirezionare ed è fatto. Al limite chiedi pure qua.

    Se invece non hai ancora fatto nulla, cioè non hai preparato le pagine diverse per la versione mobile, valuta la possibilità di usare il media query nel css in modo da avere un'unica pagina con un unico url.

    Valerio Notarfrancesco


  • User Attivo

    Non ho ancora preparato niente, sono dietro a capire cosa devo fare e come... :tongueout:

    L'ultima soluzione, quella del media query.. di cosa si tratta?


  • ModSenior

    Si tratta di interrogare (query) le caratteristiche dello strumento (medium) usato dall'utente per visualizzare il sito e in base a queste caratteristiche caricare un file css piuttosto che un altro.

    E' quindi una specie di controllo, di un if che metti nel file html, un po' come si fa per dare l'istruzione di caricare un css particolare solo per Explorer, solo che i media query te lo permettono in base alle dimensioni dello schermo.

    Ad esempio, scrivendo queste due righe:

    <link href="desktop.css" rel="stylesheet" type="text/css" media='screen and (min-width: 481px)'/>
    <link href="akane_p.css" rel="stylesheet" type="text/css" media='screen and (max-width: 480px)'/>
    Con la prima dai l'istruzione di caricare il css standard per desktop quando lo schermo è più grande di 480px.
    Invece con la seconda riga dai l'istruzione di caricare il file css chiamato akane_p.css solo quando lo schermo è inferiore a 480px.

    Questo ti permette di avere un unico file html e un unico url. Funziona solo con gli smartphone moderni, Iphone, tutti gli Android, Blackberry (solo OS 5 in su).
    Per Windows Phone 7 non funziona ancora perché il loro browser si basa su IE8 ma lo sarà con il prossimo aggiornamento; nel frattempo ti basta aggiungere questa riga al file html.

    <!--[if IEMobile 7]>
    <link rel="stylesheet" type="text/css" href="akane_p.css" media="screen" />
    <![endif]-->

    Valerio Notarfrancesco


  • User Attivo

    Se usi wordpress per il tuo sito ci sono plugin che lo fanno.

    Ciao.


  • User Attivo

    Valerio grazie 1000! I tuoi suggerimenti sono sempre interessanti ed utili.
    Adesso mi documento un po' e provo questa soluzione che mi sembra veramente ottima.

    Grazie ancora :smile5:

    X Tino.. questo sito non è costruito con wordpress comunque grazie dell'informazione, mi sarà comunque utile 🙂