So Fügen Sie Einen Link In Ein Banner Ein

Inhaltsverzeichnis:

So Fügen Sie Einen Link In Ein Banner Ein
So Fügen Sie Einen Link In Ein Banner Ein

Video: So Fügen Sie Einen Link In Ein Banner Ein

Video: So Fügen Sie Einen Link In Ein Banner Ein
Video: Links im Kanalbanner einfügen: So einfach geht es | #WiegehtYouTube 2024, Kann
Anonim

Wenn Sie ein Banner haben, aber keinen vorgefertigten HTML-Code zum Einfügen in die Seite haben, dann ist das Hinzufügen des benötigten Links nicht so schwierig. Auch wenn das Banner mit Flash-Technologie erstellt wird. Im Folgenden werden die Möglichkeiten beschrieben, Links zu Bannern in Grafik- und Flash-Formaten im Quellcode zu organisieren.

So fügen Sie einen Link in ein Banner ein
So fügen Sie einen Link in ein Banner ein

Anleitung

Schritt 1

Wenn das Banner in einem der Grafikformate (gif, jpg, png, bmp) vorliegt, reicht es aus, das Image-Tag in das Link-Tag einzufügen. Bilden Sie zunächst das Image-Tag. In der Auszeichnungssprache von Webseiten (HTML - HyperText Markup Language - "Hypertext Markup Language") sieht ihre einfachste Version so aus: Hier wird die "relative Adresse" des Bildes im src-Attribut angegeben. In dieser Version geht der Browser davon aus, dass sich das Bild in demselben Ordner auf Ihrem Server befindet, in dem sich die Seite selbst befindet, in der das Banner eingefügt wird. Es ist jedoch besser, eine "absolute Adresse" anzugeben:

Schritt 2

Diesem Tag müssen noch einige weitere Attribute hinzugefügt werden. Zwei Attribute geben die Bannerabmessungen (Höhe und Breite) an. Dies sind optionale Attribute - das Bild wird ohne sie angezeigt, wenn alles gut geht, wenn die Seite vom Server in den Browser geladen wird. Wenn das Bild jedoch aus irgendeinem Grund nicht geladen wird, kann das Fehlen von Abmessungen dazu führen, dass alle anderen Designelemente fehl am Platz sind. Das Größenetikett sieht wie folgt aus:

Schritt 3

Standardmäßig zeichnet der Browser einen blauen Rahmen um Linkbilder. Um dies zu vermeiden, fügen Sie dem Banner-Tag ein border-Attribut mit einem Nullwert hinzu:

Schritt 4

Fügen Sie ein weiteres Attribut (Titel) hinzu, das den Text für den Tooltip enthält, wenn Sie den Mauszeiger über das Banner bewegen:

Schritt 5

Sie haben das Image-Tag mit den wichtigsten Attributen vorbereitet, nun müssen Sie es innerhalb des Link-Tags platzieren. Jeder Hyperlink besteht aus zwei Tags - öffnend und schließend: Der öffnende Tag enthält das href-Attribut, das die Adresse zum Senden der Anfrage enthält. Zwischen diesen beiden Link-Tags und fügen Sie das Banner-Tag ein: Der HTML-Code des Banners mit dem Link ist fertig, vergessen Sie nicht, zu ersetzen: - im href-Attribut: "https://kakprosto.ru" durch die Adresse Ihres Links für das Banner; - im src-Attribut: " https://kakprosto.ru/banner

Schritt 6

Alle oben genannten Banner beziehen sich auf Bildbanner, aber es gibt auch Banner, die mit Flash-Technologie erstellt wurden. Um einen Link standardmäßig in einen Flash-Film einzufügen, benötigen Sie nicht nur das Banner selbst, sondern auch seinen Quellcode. Außerdem können Sie den Quellcode bearbeiten und dann den Flash-Film nur in einem spezialisierten Editor kompilieren – ein normaler Texteditor ist dafür nicht geeignet. Es gibt jedoch eine Möglichkeit, all diese Schwierigkeiten zu umgehen, indem Sie sich darauf beschränken, nur HTML und CSS (Cascading Style Sheets - "Cascading Style Sheets") zu bearbeiten. Die CSS-Sprache wird für eine detailliertere (im Vergleich zu HTML) Beschreibung des Aussehens von Seitenelementen verwendet. Mit seiner Hilfe lassen sich auf den Seiten recht komplexe Multilayer-Strukturen aufbauen. Wir verwenden dies, indem wir das Flash-Banner in der unteren Ebene platzieren und die Ebene mit dem Link darüber platzieren. Der HTML-Code des Banners sieht so aus:

Vergessen Sie nicht, die Breiten- und Höhenattribute darin (an zwei Stellen), den Bannernamen banner.swf (an zwei Stellen) und die Linkadresse https://kakprosto.ru (an einer Stelle) zu ersetzen. Und den SCC-Code entsprechend diesem HTML-Code sollte so aussehen:

div.linkedFlashContainer {position: relativ; z-Index: 1; Rahmen: 0px; Breite: 468px; Höhe: 60px}

a.flashLink {Position: absolut; z-Index: 2; Breite: 468px; Höhe: 60px; Hintergrund: URL (spacer.gif) keine Wiederholung;}

Hier wird ein transparentes Bild (beliebiger Größe) namens spacer

Empfohlen: