Home Inserire mappa in articolo
 
Inserire una mappa di google maps in un articolo su joomla
Valutazione attuale: / 23
ScarsoOttimo 
Scritto da tonicopi   
Sabato 17 Aprile 2010 17:47
Questo articolo è stato letto: 13418 volte

Ancora non mi capacito della difficoltà che molti utenti incontrano per incorporare una mappa di google dentro un proprio articolo. Si sappia che questa è una cosa semplicissima che tutti possono fare senza l'ausilio di alcun plugin o altra estensione.
Vediamo come.


Andiamo in google maps e scegliamo quale mappa vogliamo inserire nel nostro articolo. Sia chiaro che possiamo zoomarla a piacimento, spostarci al suo interno, cambiare la visualizzazione tra mappa, satellite, ecc.
Una volta trovata la visualizzazione che vogliamo inserire nel nostro articolo clicchiamo su link in alto a destra sull'angolo della mappa. In un menù a discesa ci apparirà il codice per inserire la mappa. Dobbiamo evidenziare e copiare quello sotto la voce Incolla HTML da incorporare nel sito web come potete vedere meglio in questa immagine in cui copio il codice per inserire Piazza S. Pietro (Caput Mundi!)
Adesso che ci siamo procurati il codice apriamo un file di testo e incolliamolo. Salviamo come  mappa_nome_sito.txt
Poi salviamo questo file dentro una cartella che possiamo chiamare risorse_nome_sito. Ovviamente file  e cartella non sono indispensabili e li potete chiamare come vi pare. Io suggerisco il mio metodo di lavoro che vi farà sempre trovare in ordine e da parte tutte le cose che vi servono e che vi verranno buone quando vi capiterà di dover ripristinare qualcosa nel vostro sito.
Adesso abbiamo il codice per la mappa. Apriamo il nostro editor di testo (Io suggerisco di lavorare con JCE) e scriviamo l'articolo dove inseriremo la nostra mappa, come sto facendo io che la sto facendo fin troppo lunga.  Salviamo l'articolo e lo visioniamo dal front end.

Se tutte le parti dell'articolo ci soddisfano adesso non ci resta che incollare il codice della mappa. Dovremo però farlo senza l'editor. In JCE non c'è il pulsante No Editor. Andiamo in Sito ---> Configurazione ---> e nella tab Sito alla quarta voce Editor WYSIWYG predefinito scegliamo No editor.
Adesso riapriamo il nostro articolo, andiamo a prenderci il codice che ci eravamo salvati nel file di testo e lo incolliamo nel punto dove vogliamo che si apra l'iframe che ci mostrerà la mappa di google. Salviamo l'articolo e andiamo a vedere il risultato da front end, che sarà quello che vedete qui sotto.

Potete anche cambiare la dimensione dell'iframe proposto nel codice di google che infatti io ho aumentato da 425 a 625 pixel di larghezza visto che spazio nella pagina ce n'era. Potete anche inserire mappe speciali con diversi segnaposti come questa mappa delle amiche di tonicopi. Adesso, se siete pienamente soddisfatti del risultato, andate a riabilitare l'editor. Sappiate che se riaprite l'articolo che contiene la mappa con l'editor abilitato, anche senza salvarlo, dovrete tornare ad incollare il codice della mappa. Ecco che allora vi tornerà buono il codice salvato nel file di testo.  Usate la stessa procedura qui suggerita anche con l'editor di default, cioè disabilitandolo piuttosto che usando il pulsante no-editor. Non ditemi che questa cosa è difficile!

Inserisco qui sotto la mappa di Piazza S. Pietro in Roma.

 


Visualizzazione ingrandita della mappa
Ultimo aggiornamento Venerdì 28 Dicembre 2012 21:48
 
Mini tutorial sul Suffisso classe CSS modulo CLICCA QUI
Banner


Questo testo è stato formattato col codice html direttamente nel modulo banner

Questo testo invece no e allora prende la formattazione dalla classe del foglio di stile, come per quello sopra il banner...
Buona ispezione con firebug!