Rendere il tuo WordPress ottimizzato per dispositivi mobili con WPtouch Pro

A seconda del pubblico del tuo sito, potrebbe essere importante avere un sito web ottimizzato per dispositivi mobili. Puoi farlo utilizzando un tema WordPress reattivo che si adatta a diverse dimensioni dello schermo / dispositivi, oppure puoi creare una versione specifica per dispositivi mobili del tuo sito se non vuoi cambiare il design del tuo sito. In questo articolo, ti mostreremo come creare un sito WordPress ottimizzato per dispositivi mobili con WPTouch Pro.

WPtouch Pro è un plugin WordPress commerciale che può trasformare il tuo sito WordPress in un'esperienza mobile nativa per i browser degli smartphone moderni. È veloce, ha il supporto completo per l'internazionalizzazione, integrazione con la schermata iniziale iOS e molti altri modi per migliorare l'esperienza utente mobile.

Una volta acquistato WPtouch Pro, riceverai una chiave di licenza e il file di download per il plugin. Devi installarlo sul tuo blog (segui la nostra semplice guida all'installazione dei plugin), e poi attivarlo dalla tua dashboard.

Al momento dell'attivazione, il plugin visualizzerà una notifica che ti ricorderà di inserire la tua chiave di licenza. Devi inserire la chiave di licenza per ricevere aggiornamenti del plugin, scaricare temi e componenti aggiuntivi. Fai clic sul link ‘attiva la tua Licenza’ per inserire la tua chiave di licenza.

Nella schermata successiva, inserisci semplicemente l'indirizzo email del tuo account (quello che hai usato per acquistare il plugin) e la tua chiave di licenza del prodotto, quindi fai clic sul pulsante di attivazione. WPTouch verificherà ora la tua chiave di licenza e visualizzerà un messaggio di successo.

Dopo l'attivazione, il plugin aggiunge una voce di menu WPTouch Pro nella barra di amministrazione di WordPress. Per configurare il plugin, devi andare su WP Touch Pro » Impostazioni principali.

Nella schermata delle impostazioni principali, puoi configurare varie opzioni per la versione mobile del tuo sito. La prima opzione in questa schermata è cambiare il titolo del sito e la sottotitolo. Questo è particolarmente utile se il tuo sito ha un titolo e una sottotitolo lunghi che non si adattano bene agli schermi mobili.

L'opzione successiva in questa schermata è Regionalizzazione. WP Touch Pro rileva automaticamente la lingua del tuo sito dalla tua installazione di WordPress, tuttavia puoi anche selezionare manualmente la lingua utilizzando questa opzione.

L'opzione Visualizza nella schermata delle impostazioni principali ti consente di disabilitare manualmente il tema mobile senza disattivare il plugin. L'impostazione predefinita è Normale, che abilita la visualizzazione del tema mobile per tutti i visitatori che accedono al sito tramite un dispositivo mobile. Puoi cambiarla in Anteprima, in modo che il tema mobile venga visualizzato solo agli amministratori del sito quando sono collegati. Puoi anche scegliere Disabilitato per disattivare completamente la visualizzazione del tema mobile.

Ci sono alcune opzioni avanzate disponibili nella pagina delle impostazioni principali. Ad esempio, puoi scegliere una pagina di destinazione personalizzata per la versione mobile del tuo sito. Puoi aggiungere codice personalizzato che apparirà nell'area del footer del tema. Puoi anche eseguire il backup di tutte le impostazioni di WP Touch Pro e quindi importarle su un altro sito WordPress con WP Touch Pro. Questa è una buona opzione se hai un sito di staging o un installazione locale.

Una volta che hai esaminato la pagina delle impostazioni principali, puoi visualizzare in anteprima il tuo sito mobile direttamente sul tuo desktop facendo clic sul pulsante Anteprima tema in fondo a questa pagina. Una volta che sei soddisfatto dell'aspetto del tuo tema, puoi fare clic sul pulsante Salva modifiche per salvare le tue impostazioni.

Modifica del tema mobile in WPTouch Pro 3

Per impostazione predefinita, WPTouch Pro 3 viene fornito con un tema mobile preinstallato. Puoi scaricare e installare temi aggiuntivi da WPTouch Pro » Temi ed estensioni. Bauhaus, CMS, Classic Redux e Simple sono i temi disponibili con tutti i piani di licenza. Per installare un tema, fai semplicemente clic sul pulsante Installa sotto il tema. WPTouch Pro scaricherà il tema dal cloud e lo installerà. Una volta installato un tema, puoi fare clic sul pulsante attiva per utilizzare quel tema.

Personalizzazione del tuo tema mobile in WPTouch Pro3

Una volta selezionato il tema per il tuo sito mobile, potresti volerlo personalizzare per soddisfare le tue esigenze. Per farlo, devi andare su WPTouch Pro » Impostazioni tema. I temi mobili di WPTouch Pro sono altamente personalizzabili. Puoi ottimizzare ogni aspetto del tuo sito mobile dalla schermata delle impostazioni del tema. Ti guideremo attraverso le diverse sezioni delle Impostazioni tema.

Nella scheda del menu in alto, puoi vedere le diverse aree del tuo tema che puoi personalizzare. Inizierai dalla scheda Generale che contiene opzioni per alcune impostazioni di base come il numero di post da mostrare nella pagina principale, abilita lo slider delle categorie, abilita lo slider dei post in evidenza, ecc. Le impostazioni predefinite dovrebbero funzionare per la maggior parte dei siti, ma puoi apportare modifiche secondo necessità. Noterai anche un'icona informativa accanto ad alcune opzioni; passando il mouse sopra l'icona ti verranno mostrati aiuti contestuali per quell'opzione.

Una volta apportate le modifiche al tuo tema, puoi visualizzarle in anteprima facendo clic sul pulsante Anteprima tema in fondo alla pagina. Quando sei soddisfatto delle modifiche apportate, devi fare clic sul pulsante Salva modifiche per salvare le impostazioni del tuo tema. C'è anche un pulsante di ripristino nel caso in cui desideri tornare alle impostazioni predefinite.

Dopo aver configurato le impostazioni generali per il tuo tema mobile, passa alla scheda Branding. Qui puoi caricare il tuo logo, lo sfondo, i font personalizzati, le icone dei social media, ecc. Puoi anche cambiare i colori del tema per adattarli al tuo logo e ai colori del tuo brand.

Trasformare il tuo sito in una Web App Mobile

WPTouch Pro ti consente di sfruttare appieno le funzionalità dei dispositivi mobili trasformando il tuo sito in una web app. Per prima cosa, devi fare clic sulla scheda Icone segnalibro nella schermata Impostazioni tema. Dovrai caricare due icone, una per i dispositivi Android e l'altra per i dispositivi iOS (iPhone, iPod e iPad).

Successivamente, fai clic sulla scheda Modalità Web-App nelle impostazioni del tema. Basta selezionare la casella per abilitare la modalità web-app per iOS, e questo visualizzerà le impostazioni avanzate per la modalità web-app. Puoi utilizzare le impostazioni predefinite o caricare le tue schermate di avvio personalizzate.

Monetizza il tuo sito mobile con WPTouch Pro

I temi WPTouch Pro rendono anche estremamente facile visualizzare annunci pubblicitari sul tuo sito mobile. Devi andare alla scheda Pubblicità sotto le impostazioni del tema e scegliere tra Google Adsense o un servizio pubblicitario personalizzato.

Per Google Adsense, dovrai inserire il tuo ID editore Google Adsense e l'ID slot che puoi ottenere dal tuo account Google Adsense. Dopodiché dovrai scegliere la posizione in cui desideri che vengano visualizzati gli annunci. Salva le modifiche e il tuo sito mobile inizierà a mostrare annunci.

Personalizzazione dei menu di navigazione per siti mobile in WPTouch Pro

WPTouch Pro utilizza la funzionalità predefinita del menu di WordPress, ma ti consente di modificare o scegliere come desideri visualizzare il menu sul tuo sito mobile. Per configurare i menu, devi andare su WPTouch Pro » Menus. Per prima cosa devi scegliere un menu. Puoi scegliere di visualizzare le pagine di WordPress nel menu o scegliere un menu esistente.

Nella scheda Menu Setup, puoi personalizzare ulteriormente il tuo menu di WordPress. Puoi associare icone a ciascuna voce di menu semplicemente trascinando un'icona su una voce di menu.

Per impostazione predefinita, WPTouch Pro viene fornito con il set di icone Elegant progettato da Elegant Themes. Puoi installare altri set di icone facendo clic sul pulsante Installa accanto ad essi o caricare i tuoi set di icone personalizzati.

WPTouch è un ottimo plugin per convertire qualsiasi sito web basato su WordPress in un'applicazione web mobile completa. Con temi bellissimi e potenti opzioni di personalizzazione, puoi creare siti mobili dall'aspetto fantastico in pochi minuti senza scrivere una singola riga di codice. Speriamo che questo articolo ti abbia aiutato a creare un sito mobile-friendly con WP Touch Pro. Per feedback e domande, puoi lasciarci un commento qui sotto o seguirci su Twitter.