Pubblicato il 20/01/10 - aggiornato il  | 1 commento :

Come inserire delle immagini anche animate con dei collegamenti a post del blog o ad altri siti.

Inserire dei collegamenti a delle immagini nel blog è una delle operazioni più semplici che però non è proprio immediata. Bisogna distinguere tra inserire queste immagini in un articolo oppure in un elemento pagina. Nel primo caso non ci sono difficoltà perché sia se si usa l'editor di Blogger che Windows Live Writer c'è sempre la possibilità di selezionare l'immagine e cliccare sull'icona o sul collegamento inserisci link per creare il collegamento desiderato.

immagini-blogger-1

E' sempre meglio inserire anche il Titolo dell'immagine perché sarà quello che vedrà il lettore quando ci passerà sopra con il mouse e poi la sua presenza è molto apprezzata dai motori di ricerca.

Nel caso invece in cui si voglia creare un elemento pagina con una foto collegata ad una pagina web possiamo usare due metodi. Il primo è il più banale e consiste nello sfruttare l'apposito widget di Blogger. Si va cioè su Aggiungi un gadget > Foto

immagini-blogger-2

Dopo aver selezionato il tIpo di elemento pagina non resta che riempire i campi successivi

immagini-blogger-3

Si seleziona l'immagine dal disco rigido o dal web, si inserisce il titolo, eventualmente una didascalia e il collegamento alla pagina o al sito che vogliamo si apra quando ci si clicca sopra. Si termina cliccando su Salva e posizionando la foto con il mouse nel punto del blog che si preferisce.

Le immagini animate non vengono caricate in Blogger attraverso questo metodo quindi bisogna seguire un'altra via. Occorre caricare l'immagine su un nostro account come per esempio il gratuito Skydrive e acquisirne l'URL cliccandoci sopra fino a che non si vede l'animazione. L'indirizzo si copierà direttamente dalla barra del browser. Quindi si personalizza questo codice

<a href="URL_del_collegamento" target="_blank" ><img title="titolo immagine" alt="nome immagine" src="URL_immagine" /></a>

Le personalizzazioni riguardano

  1. URL_del_collegamento: si sostituisce con il link alla pagina o al sito che si vuole venga aperto quando ci si clicca sopra
  2. target="_blank": si può inserire questo attributo se si vuole che il collegamento si apra in un'altra scheda del browser, altrimenti si può eliminare. E' conveniente inserirlo se il link è esterno per non far uscire dal nostro sito il lettore
  3. Titolo immagine: è quello che viene mostrato al lettore quando punta l'immagine con il mouse
  4. Nome immagine: può essere lo stesso del titolo ed è un altro attributo molto gradito ai motori di ricerca perché è quello che mostra il browser nella malaugurata ipotesi non riesca ad aprire l'immagine
  5. URL_immagine: si inserisce l'URL dell'immagine che abbiamo caricato su Skydrive o su altro hosting

Dopo aver preparato il codice si va su Layout > Elementi pagina > Aggiungi un gadget > HTML/Javascript, si incolla in Sezioni del sito e si clicca su Salva; successivamente si posiziona con il mouse sempre in Layout > Elementi pagina.

Concludo mostrando come esempio questo codice

<a href="http://parsifal32.blogspot.com/2009/01/cuoricini-animati-che-cadono-da-mettere.html" target="_blank"><img title="Cuore e cuoricini" alt="Cuore_animato" src="http://public.blu.livefilestore.com/y1pd9Dm0W4ThIMhXQg5pFSbb-wndjw_EJRh9ZBTIOl8bDe9tKAlICgwC8MJTW-3Da4lMicK4DY14IFmKICKzJGHgw/heartani.gif" /></a>

che porta all'inserimento della seguente immagine animata

Cuore_animato

con collegamento all'effetto cuoricini di San Valentino.



1 commento :

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti.
Info sulla Privacy