Come Inserire Un Link In Un Banner

Sommario:

Come Inserire Un Link In Un Banner
Come Inserire Un Link In Un Banner

Video: Come Inserire Un Link In Un Banner

Video: Come Inserire Un Link In Un Banner
Video: PERSONALIZZARE YOUTUBE - COME AGGIUNGERE LINK E INFORMAZIONI 2024, Maggio
Anonim

Se hai un banner, ma non c'è un codice html già pronto per inserirlo nella pagina, aggiungere il link di cui hai bisogno non è così difficile. Anche se il banner è realizzato con tecnologia flash. Di seguito sono descritte le possibili opzioni per l'organizzazione di link a banner in formato grafico e flash nel codice sorgente.

Come inserire un link in un banner
Come inserire un link in un banner

Istruzioni

Passo 1

Se il banner è in uno dei formati grafici (gif, jpg, png, bmp), allora sarà sufficiente inserire il tag immagine all'interno del tag link, per prima cosa formare il tag immagine. Nel linguaggio di markup delle pagine web (HTML - HyperText Markup Language - "linguaggio di markup ipertestuale"), la sua versione più semplice si presenta così: Qui l'"indirizzo relativo" dell'immagine è specificato nell'attributo src. In questa versione, il browser presumerà che l'immagine si trovi nella stessa cartella sul tuo server in cui si trova la pagina stessa in cui è inserito il banner. Ma è meglio specificare un "indirizzo assoluto":

Passo 2

Ci sono alcuni altri attributi da aggiungere a questo tag. Due attributi indicheranno le dimensioni del banner (altezza e larghezza). Questi sono attributi facoltativi: l'immagine verrà visualizzata senza di essi se tutto va bene quando la pagina viene caricata dal server al browser. Ma se l'immagine per qualche motivo non viene caricata, la mancanza di dimensioni può portare al fatto che tutti gli altri elementi di design saranno fuori posto. Il tag della taglia sarà simile a questo:

Passaggio 3

Per impostazione predefinita, il browser disegna un bordo blu attorno alle immagini dei collegamenti. Per evitare ciò, aggiungi un attributo border con un valore nullo al tag banner:

Passaggio 4

Aggiungi un altro attributo (titolo), che conterrà il testo per il suggerimento quando muovi il cursore del mouse sul banner:

Passaggio 5

Hai preparato il tag immagine con gli attributi più importanti, ora devi inserirlo all'interno del tag link. Ogni collegamento ipertestuale è formato da due tag - apertura e chiusura: Il tag di apertura contiene l'attributo href, che contiene l'indirizzo per l'invio della richiesta. Tra questi due tag link e inserisci il tag banner: Il codice HTML del banner con il link è pronto, non dimenticare di sostituire: - nell'attributo href: "https://kakprosto.ru" con l'indirizzo del tuo link per il banner; - nell'attributo src: " https://kakprosto.ru/banner

Passaggio 6

Tutto quanto sopra si riferisce a banner immagine, ma ci sono anche banner realizzati con tecnologia flash. Per inserire un link in un filmato flash in modo standard, è necessario disporre non solo del banner stesso, ma anche del suo codice sorgente. Inoltre, puoi modificare il codice sorgente e quindi compilare il filmato Flash solo in un editor specializzato - un normale editor di testo non è adatto a questo. Tuttavia, c'è un modo per aggirare tutte queste difficoltà, limitandosi a modificare solo HTML e CSS (Cascading Style Sheets - "fogli di stile a cascata"). Il linguaggio CSS viene utilizzato per una descrizione più dettagliata (rispetto all'HTML) dell'aspetto degli elementi della pagina. Con il suo aiuto, sulle pagine possono essere costruite strutture multistrato piuttosto complesse. Lo useremo posizionando il banner Flash nel livello inferiore e posizionando il livello con il collegamento sopra di esso. Il codice HTML del banner sarà simile a questo:

Non dimenticare di sostituire gli attributi di larghezza e altezza al suo interno (in due punti), il nome del banner banner.swf (in due punti) e l'indirizzo del collegamento https://kakprosto.ru (in un punto) e il codice SCC corrispondente a questo codice HTML dovrebbe essere così:

div.linkedFlashContainer {posizione: relativa; indice z: 1; bordo: 0px; larghezza: 468 px; altezza: 60 px}

a.flashLink {posizione: assoluta; indice z: 2; larghezza: 468 px; altezza: 60px; sfondo: url (spacer.gif) no-repeat;}

Qui viene utilizzata un'immagine trasparente (di qualsiasi dimensione) chiamata spacer.gif. E anche qui, non dimenticare di modificare le dimensioni della larghezza e dell'altezza (in due punti).

Consigliato: