Inserire un'immagine con link

Seconda MiniGuida tutta per voi…Dopo esserci occupati dell’inserimento di un contatore sul blog (spero vi sia stato utile), mi accingo a spiegarvi un altro semplice gruppo di istruzioni in HTML che vi permetterà d’inserire un’immagine con link.

Ad esempio, potrete inserire un immagine che vi permette, cliccandoci sopra, di inviare una e-mail lanciando automaticamente il software da voi usato, oppure semplicemente riportarvi ad un altro sito o blog (per capirci è un po’ quello che fanno i banner)...

Ma bando alle ciance e passiamo alla pratica…

Innanzi tutto scegliamo l’immagine che vogliamo usare:

io ho scelto l’immagine del logo del sito di cui tra poco vi parlerò…

Scelta l’immagine, dobbiamo caricarla su un sito che la ospiti e che ci restituisca un URL a lei associato. In questa operazione, più semplice a farsi che a dirsi, ci dà una mano il sito di cui ho scelto l’immagine, ImageShack.

Nella pagina principale di ImageShack in upload selezioniamo “image”, poi clicchiamo su sfoglia e selezioniamo la nostra immagine (se vogliamo il sito permette anche di ridimensionare la nostra immagine a seconda della nostra necessità). Fatto questo non ci resta ora che cliccare su “host it!”

Nella nuova pagina troveremo un po’ di codici HTML con accanto la loro funzione, a noi interessa soltanto l’ultimo di tutti, quello con accanto scritto “Direct link to image” che si presenta in questo modo:

http://img152.imageshack.us/img152/2023/headerwhitenj2.jpg

Questo non è altro che l’URL che ci rimanda alla nostra immagine (nel nostro esempio all’immagine del logo del sito).

Adesso che abbiamo l’URL, per inserire la nostra immagine con link nel blog, non ci resta che cliccare su “Personalizza” (in alto a destra nella vostra pagina principale del blog) e in "Elementi pagina" su "Aggiungi un elemento pagina". Vi si aprirà una pagina con tante aggiunzioni che potete fare al vostro blog, scegliete "HTML/JavaScript", date se volete un titolo (potete anche lasciarlo vuoto), e nello spazio sottostante "Sezioni del sito" incollate il codice HTML seguente:

<a href="URL_X"><img src="URL_IMG" alt="URL_X" /></a>

Dove dovrete sostituire URL_X con l’url del sito a cui volete andare cliccando sull’immagine e URL_IMG con l’url fornitovi da ImageShack.

Nel nostro esempio avremo quindi:

URL_X: http://imageshack.us/ (URL del sito fornitore del servizio);

URL_IMG: http://img152.imageshack.us/img152/2023/headerwhitenj2.jpg (URL dell’immagine)

Codice risultante:

<a href="http://imageshack.us/"><img src="http://img152.imageshack.us/img152/2023/headerwhitenj2.jpg" alt=" http://imageshack.us/" /></a>

A questo punto non vi resta che cliccare su SALVA MODIFICHE, posizionare il vostro nuovo elemento nella pagina come meglio credete e in fine salvare tutto con l'apposito tasto SALVA.

Ciò che otterrete sarà qualcosa di simile:





ATTENZIONE: Se volessimo che la nostra immagine avvii in automatico il software per inviare e-mail, nell’URL_X dovremmo andare a sostituire “mailto:proprio_indirizzo_email”.

Un’altra piccola precisazione và fatta nel caso in cui si volesse inserire un’immagine con link, ma il codice HTML fosse disattivato e attivato il codice BB, questo capita spesso nei Forum. In tal caso le istruzioni da inserire sono:

[URL=URL_X][IMG]URL_IMG[/IMG][/URL]

Che ne nostro esempio diventerebbero:

[URL= http://imageshack.us/][IMG] http://img152.imageshack.us/img152/2023/headerwhitenj2.jpg [/IMG][/URL]

Siamo quindi giunti alla fine di questa seconda MiniGuida, a voi l’ardua sentenza se sia chiara o meno, comunque spero utile…Salutandovi alla prossima vi lascio con un piccolo Dizionario dei Tag HTML usati in questa guida per una maggiore comprensione…Alla prox!!


DIZIONARIO DEI TAG HTML USATI:


<a>…</a>

Descrizione

Questo tag, può essere utilizzato per definire un link o un’ancora (detta anche “segnalibro”), oppure per definire contemporaneamente entrambi.

Attributi

href

Indica l’url al quale punta il collegamento ipertestuale. Per esempio:

<a href="http://ilblogdisnoopy.blogspot.com/"> Il Blog di Snoopy</a>

Crea un collegamento ipertestuale all’url del mio blog.

*** *** ***

<img>

Descrizione

Questo tag è utilizzato per inserire un’immagine all’interno di un documento ipertestuale.

Attributi

src

src significa source, cioè origine e accetta un URL. Serve per specificare quale immagine dovrà essere caricata.

alt

Il valore che si assegna a questo attributo rappresenta il testo che viene fornito in alternativa all’immagine per i browser testuali o per quelli in cui si sia optato per una disabilitazione delle immagini. In alternativa, alcuni browser, visualizzano il testo inserito come valore per l’attributo alt al passaggio del mouse sull’immagine per fornire un’ulteriore informazione all’utente.

*** *** ***

NOTA:

Un Uniform Resource Locator o URL è una sequenza di caratteri che identifica univocamente l'indirizzo di una risorsa in Internet, come un documento o un'immagine.

Ad esempio, l'URL di questa pagina è http://ilblogdisnoopy.blogspot.com/

Inserire il contatore visite nel blog

Eccoci qui, dopo il post di presentazione, eccoci al primo vero post...ma lo si può chiamare vero così?!?
In realtà mi sono convinto ad apprestarmi a scrivere questo post, più che altro per un inconveniente tecnico sortomi durante la creazione del mio blog; e cioè...come s'inserisce il contatore delle visite???


Eccoci quindi al primo, spero di tanti, post su piccoli aiuti informatici, molti me ne vorranno a male, sopratutto chi si conserva per se queste chicche o chi le dà per scontate con frasi della serie..."perchè non lo sai fare?!"...a cui è naturale rispondere..."NO!! Altrimenti non te lo chiedevo!!!"...

Una cosa che io stesso sconoscevo è che i contatori in realtà sono forniti da terzi, cioè siti, che sotto una registrazione, gratuita nella maggior parte dei casi, forniscono dati statistici sul sito o blog personale, come il contatore dei visitatori totale o parziale, le pagine visitate, le persone presenti sul sito/blog in un dato momento, ma anche i browser usati, le risoluzioni, il paese di provenienza dei vostri visitatori e tante altre cose...Insomma un bel po' di informazioni statistiche e no che si possono rendere visibili tramite il contatore o tenere riservate per se stessi.
Come dicevo, esistono molti siti che forniscono questo servizio, di seguito riporterò il link di "HiStats.com" uno di questi (quello su cui io stesso ho preso il mio contatore):

http://www.histats.com/it/

1. Recatevi alla pagina http://www.histats.com/it/ e registratevi. Il servizio di registrazione è gratuito. Fatto questo inserite i dati riguardanti il vostro sito, scegliete l'aspetto del contatore e vi verrà fornito il codice HTML da inserire nel vostro blog.
2. Una volta che vi verrà fornito il codice HTML copiatelo con un semplice copia, poi tornate sul vostro blog e cliccate su "Personalizza" (in alto a destra nella vostra pagina principale).
3. Vi ritroverete così nella scheda "Elementi pagina" sulla quale dovete cliccare in "Aggiungi un elemento pagina".
4. Vi si aprirà una pagina con tante aggiunzioni che potete fare al vostro blog, scegliete "HTML/JavaScript" (cliccando sull' AGGIUNGI AL BLOG sottostante).
5. Nell'ulteriore pagina che si apre date un titolo, ad esempio Visitatori o Contatore (potete anche lasciarlo vuoto se volete), e nello spazio sottostante "Sezioni del sito" incollate il codice HTML che vi è stato fornito.
6. A questo punto non vi resta che cliccare su SALVA MODIFICHE, posizionare il vostro contatore nella pagina come meglio credete (sempre in Elementi pagina) e in fine salvare tutto con l'apposito tasto SALVA.

Adesso visualizzando il vostro blog vedrete anche quanti vi hanno visitato!!!

Spero che questa MiniGuida possa essere chiara e d'aiuto...fatemelo sapere se vi và...e se avete qualche dubbio informatico, fatelo presente, col tempo si potrebbero aggiungere altre MiniGuide...Alla prox!!!