Hai bisogno di sapere come integrare Google Calendar nel tuo sito Web WordPress? Quindi diamo un'occhiata insieme a questo tutorial.
Alcuni dei tuoi siti web trarrebbero vantaggio dall'avere un calendario. Ciò è particolarmente vero se coordini l'attività di una squadra o di una comunità o se tu gestire un sito web dell'evento.
Così i tuoi visitatori o utenti possono vedere cosa c'è di nuovo o da fare, forse da chi ma soprattutto quando.
In questo articolo ti mostrerò come integrare un Google Calendar reattivo nel tuo sito Web WordPress.
Ma prima, se non hai mai installato WordPress, scopri Come installare un blog Wordpress passi 7 et Come trovare, installare e attivare un tema WordPress sul tuo blog
Quindi torniamo al perché siamo qui.
Vai a un calendario di Google
Se disponi già di calendari Google, rendili pubblici e salta questo passaggio. Altrimenti, nel tuo browser, visita Google Calendar e autenticarsi se necessario. Se tutto va bene dovresti avere l'interfaccia del calendario di Google.
Per farti un esempio, utilizzeremo i calendari pubblici disponibili in Google Calendar. Per fare ciò, fare clic sulla maniglia davanti a altri calendari che si trova a sinistra dello schermo. Nel menu che appare, scegli Sfoglia calendari interessanti.
Nell'elenco di calendari, scegliere quello che più vi si addice cliccando sul link Registrati che si trova di fronte. Per questo articolo ho scelto Vacanze in Francia. Si dovrebbe vedere quello che avete selezionato qui sotto altri calendari.
Incorpora Google Calendar in una pagina o un elemento
Fai clic sulla maniglia di fronte Vacanze in Francia (O il vostro calendario pubblico) e scegliere Impostazioni del calendario. Nella sezione Integrare questo calendario, copia il codice HTML contenuto nella casella di testo e incollalo nell'editor WYSIWYG, che avrai precedentemente inserito in modalità testo.
Scopri a proposito la nostra selezione di editor di codice 10 per gli sviluppatori di WordPress
Salva il tuo articolo e visualizzalo in anteprima. La visualizzazione dell'agenda sul tuo sito web dipenderà fortemente dal tuo tema WordPress. Se è completamente reattivo, non dovrebbe avere problemi di visualizzazione.
Prova a ridurre la larghezza della finestra del browser per vedere come appare il calendario su schermi più piccoli. Se in qualsiasi momento la visualizzazione del calendario si interrompe, significa che dovrai aggiungere una piccola riga di CSS al tuo tema WordPress.
Vai oltre scoprendo Come aggiungere un CSS personalizzato per il vostro blog WordPress
Non allarmarti, non è niente di complicato.
Aggiungere CSS per rendere il calendario reattivo
Per cambiare il tuo tema WordPress, soprattutto se non sei l'autore, l'aggiornamento dovrebbe essere effettuato in a tema bambino o WordPress Plugin che ti consente di aggiungere CSS personalizzati.
In ogni caso, qualunque opzione tu scelga, aggiungi questo piccolo pezzo di CSS al tuo tema WordPress:
iframe { max-width: 100%; }Salva le modifiche, ricarica la pagina del tuo articolo e verifica che questa volta l'agenda sia visualizzata normalmente sui piccoli schermi.
Incorporare più calendari in un post o una pagina
Per iniziare, iscriviti ad altri calendari pubblici come abbiamo fatto sopra (Altri calendari> Sfoglia calendari interessanti) o crea i tuoi calendari e rendili pubblici.
Quando hai tutti i calendari di cui hai bisogno, scegline uno, uno qualsiasi, fai clic sulla sua maniglia e scegli Impostazioni del calendario. Questa volta, nella sezione integrare questa agenda, fai clic sul collegamento Personalizza colore, dimensioni e altre opzioni. Ti verrà quindi presentata una finestra di personalizzazione.
Andare oltre con il Nozioni di base sulla personalizzazione di un sito Web WordPress
Qui puoi modificare alcuni aspetti visivi della tua agenda. Una cosa importante da fare è dare un titolo alla raccolta del calendario, altrimenti avrà il titolo del calendario corrente.
Nella parte superiore di questa finestra c'è una casella di testo con un pulsante Aggiorna codice HTML. Usalo per vedere in anteprima il tuo calendario.
Ti consigliamo inoltre di controllare il nostro 10 plugin di WordPress premium perfetto per integrare un calendario nel tuo sito web
L'utilizzo di questo pulsante ha anche l'effetto di aggiornare il codice HTML nella casella di testo. Quando sarai soddisfatto delle tue modifiche, copierai questo codice nel tuo articolo. Salva e ricarica la pagina.
Scopri anche Come mettere il tuo sito Web WordPress in modalità Manutenzione
Avendo già inserito il codice CSS in precedenza, il diario si comporterà perfettamente su tutte le schermate.
Come puoi vedere, aggiungere un calendario Google al tuo sito web non è molto complicato. Si tratta più di copiare il codice dall'applicazione Google Calendar e incollarlo in una pagina o in un articolo, ovviamente con l'editor in modalità testo.
Ma non riuscendo a occupare un'intera pagina con i tuoi calendari potresti anche aggiungere Google widget calendario calendario.
Scopri anche alcuni plugin WordPress premium
Puoi usare altro plugin di WordPress per dare un aspetto moderno e per ottimizzare la gestione del tuo blog o sito web.
Ti offriamo qui alcuni plugin WordPress premium che ti aiuteranno a farlo.
1. Pagine per ruolo utente
Pagine per ruolo utente è a WordPress Plugin che ti consente di aggiungere il controllo dell'accesso su determinati elementi del tuo sito Web (post, pagine, tipi di post personalizzati, ecc.)
Questo plugin può consentirti di eliminare una pagina, un articolo, un tipo di post personalizzato e altri. nei risultati di ricerca e nella directory del blog. Ciò ti consentirà di nascondere la pagina, le categorie e altre voci di menu quando gli utenti non sono connessi.
Puoi anche definire a reindirizzamento URL specifico per gli utenti che non hanno il ruolo utente richiesto.
Download | Demo | Web hosting
2. Ultimate Affiliate Pro
Cominciamo con il WordPress Plugin Ultimate Affiliate Pro che è facilmente uno dei plugin di WordPress programma di affiliazione più robusto poiché si integra con WooCommerce, Easy Digital Downloads, PayPal e plug-in Stripe.
Lì troverai tutti i tipi di funzionalità utili come: bonus di performance e gestione dei banner, supporto per un numero illimitato di affiliati e offerte speciali, classifiche e livelli di commissione, referral e condivisioni su social network, supporto per più gateway di pagamento PayPal, Stripe e molti altri.
Se tutto ciò non fosse abbastanza impressionante, dovresti sapere che ha anche alcuni modelli per la pagina di accesso, la registrazione, l'account gratuito e si connette con i migliori fornitori di email marketing come MailChimp, Constant Contatto e molti altri.
È uno dei migliori plugin di affiliazione WooCommerce che troverai su Envato Market.
Download | Demo | Web hosting
3. Materiale
Material Admin è uno dei plugin WordPress più avanzati ed eleganti sul mercato per personalizzare la dashboard di WordPress.
Questo plugin per WordPress include temi eleganti per 100 e ti dà la possibilità di creare il tuo tema. Sarai in grado di controllare l'aspetto completo del menu della dashboard, la barra superiore, i pulsanti, la tipografia, i moduli, i colori del testo e dello sfondo, il logo, ecc.
Material Admin ha anche più di 20 widget de cruscotto personalizzato per il tuo sito Web e visualizza statistiche per i visitatori.
Download | Demo | Web hosting
Risorse raccomandate
Scopri altre risorse consigliate per aiutarti a costruire e gestire il tuo sito web.
- Come riordinare i post di WordPress
- Come trovare il link alla pagina di login di WordPress
- Come trovare i file per modificare un tema WordPress
- Come presentare e condividere PDF su WordPress?
- Come creare una gerarchia con pagine di WordPress e modelli
Conclusione
Ecco! Questo è tutto per questo tutorial dedicato all'integrazione di un calendario di Google nel tuo sito Web WordPress. Non esitare a condividi con i tuoi amici sui tuoi social network preferiti.
Tuttavia, sarai anche in grado di consultare il nostro risorse, se hai bisogno di più elementi per realizzare i tuoi progetti di creazione di siti Internet, consultando la nostra guida su Creazione di blog WordPress.
Se hai suggerimenti o commenti, lasciali nella nostra sezione commentaires.
...
