So erstellen Sie einen Download-Button: 11 Schritte (mit Bildern)

Inhaltsverzeichnis:

So erstellen Sie einen Download-Button: 11 Schritte (mit Bildern)
So erstellen Sie einen Download-Button: 11 Schritte (mit Bildern)

Video: So erstellen Sie einen Download-Button: 11 Schritte (mit Bildern)

Video: So erstellen Sie einen Download-Button: 11 Schritte (mit Bildern)
Video: Outlook: So fügst Du weitere E-Mail-Adressen problemlos Deinem E-Mail-Programm hinzu! 2024, Kann
Anonim

Ein Download-Button kann Ihre Website deutlich professioneller aussehen lassen, als Ihren Download einfach über Links anzubieten. Eine Schaltfläche bietet eine übersichtlichere Benutzeroberfläche, und wenn Sie Lust haben, Ihre eigene zu gestalten, können Ihre Schaltflächen integraler Bestandteil des Designs Ihrer Seite sein. Folgen Sie dieser Anleitung, um HTML-Schaltflächen zu erstellen oder eine Schaltfläche mit Ihrem eigenen Design zu erstellen.

Schritte

Methode 1 von 2: Erstellen eines HTML-Buttons

Erstellen Sie einen Download-Button Schritt 1
Erstellen Sie einen Download-Button Schritt 1

Schritt 1. Erstellen Sie die Schaltfläche in einem Code-Editor

Ein einfacher Texteditor wie Notepad oder TextEdit funktioniert perfekt. Geben Sie den folgenden Code in den Editor ein:

Erstellen Sie einen Download-Button Schritt 2
Erstellen Sie einen Download-Button Schritt 2

Schritt 2. Laden Sie die Datei auf Ihren Server hoch

Wenn Sie eine Datei zum Download anbieten möchten, müssen Sie diese entweder auf Ihrem eigenen Server hosten oder die Schaltfläche auf die Datei an einer anderen Stelle im Web verweisen. Verwenden Sie einen FTP-Client, um die Datei hochzuladen, die Sie dem Server Ihrer Website zur Verfügung stellen möchten.

Erstellen Sie einen Download-Button Schritt 3
Erstellen Sie einen Download-Button Schritt 3

Schritt 3. Stellen Sie sicher, dass Sie die Erlaubnis des Webmasters haben, wenn Sie auf eine Datei verlinken möchten, die Sie nicht selbst hosten

Erstellen Sie einen Download-Button Schritt 4
Erstellen Sie einen Download-Button Schritt 4

Schritt 4. Ersetzen Sie 'Download Location' durch die URL zum Download. Stellen Sie sicher, dass die Adresse in einfachen Anführungszeichen und in doppelten Anführungszeichen um "window.location='Download Location'" eingeschlossen ist. Fügen Sie alle Präfixe wie HTTP:// oder FTP:// hinzu und fügen Sie auch die Dateierweiterung wie z als-j.webp" />

Erstellen Sie einen Download-Button Schritt 5
Erstellen Sie einen Download-Button Schritt 5

Schritt 5. Beschriften Sie die Schaltfläche

Ersetzen Sie „Button Text“durch die Wörter, die auf dem Button erscheinen sollen. Achten Sie darauf, die doppelten Anführungszeichen um den Text herum zu halten. Halten Sie den Schaltflächentext klein, damit die Schaltfläche auf der Seite nicht groß und unhandlich erscheint.

Erstellen Sie einen Download-Button Schritt 6
Erstellen Sie einen Download-Button Schritt 6

Schritt 6. Platzieren Sie den Code auf Ihrer Seite

Sie können den Schaltflächencode an einer beliebigen Stelle in den Textkörper Ihrer Webseite einfügen, und die Schaltfläche wird an dieser Stelle angezeigt. Laden Sie Ihren geänderten Webseitencode hoch und testen Sie Ihre neue Schaltfläche.

Methode 2 von 2: Erstellen einer Bildschaltfläche

Erstellen Sie einen Download-Button Schritt 7
Erstellen Sie einen Download-Button Schritt 7

Schritt 1. Gestalten Sie Ihren Download-Button

Verwenden Sie Ihren bevorzugten Bildeditor und erstellen Sie eine Schaltfläche, die dem Stil Ihrer Website entspricht. Sie können die Schaltfläche so klein oder groß machen, wie Sie möchten.

Erstellen Sie einen Download-Button Schritt 8
Erstellen Sie einen Download-Button Schritt 8

Schritt 2. Laden Sie die Datei auf Ihren Server und das Schaltflächenbild hoch

Wenn Sie eine Datei zum Download anbieten möchten, müssen Sie diese entweder auf Ihrem eigenen Server hosten oder die Schaltfläche auf die Datei an einer anderen Stelle im Web verweisen. Verwenden Sie einen FTP-Client, um die Datei hochzuladen, die Sie dem Server Ihrer Website zur Verfügung stellen möchten.

Laden Sie das Schaltflächenbild an denselben Speicherort auf dem Server wie die Seite hoch, in die Sie es einfügen

Erstellen Sie einen Download-Button Schritt 9
Erstellen Sie einen Download-Button Schritt 9

Schritt 3. Erstellen Sie Ihren Download-Code

Eine durch ein Bild dargestellte Download-Schaltfläche funktioniert genauso wie alle anderen Links in HTML. Kopieren Sie den folgenden Code in Ihren bevorzugten Editor:

Erstellen Sie einen Download-Button Schritt 10
Erstellen Sie einen Download-Button Schritt 10

Schritt 4. Geben Sie Ihre Datei- und Bildinformationen ein. Ersetzen Sie „Download-Speicherort“durch die vollständige URL zu Ihrem Download, einschließlich aller HTTP://- oder FTP://-Präfixe. Ersetzen Sie „Image File“durch den Dateinamen für das Bild der Download-Schaltfläche. Befindet sich die Datei am selben Speicherort wie die Seite auf Ihrem Server, müssen Sie nicht die gesamte Adresse angeben.

  • Ersetzen Sie „Hover-Text“durch einen beliebigen Text, der angezeigt werden soll, wenn der Benutzer den Cursor über das Bild bewegt.
  • Ersetzen Sie „X“und „Y“durch die Bildbreite bzw. -höhe in Pixeln.
  • Achten Sie darauf, die doppelten Anführungszeichen um jeden Eintrag zu halten.
Erstellen Sie einen Download-Button Schritt 11
Erstellen Sie einen Download-Button Schritt 11

Schritt 5. Geben Sie den Code in Ihre Seite ein

Platzieren Sie den Code dort, wo Ihr Button erscheinen soll. Laden Sie den neuen Code hoch und laden Sie dann die Webseite, um sicherzustellen, dass die Schaltfläche funktioniert. Überprüfen Sie, ob der Hover-Text geladen wird und das Bild die richtige Größe hat.

Video - Durch die Nutzung dieses Dienstes können einige Informationen an YouTube weitergegeben werden

Warnungen

  • Das Hochladen von Dateien auf Ihren eigenen Server ist eine bessere Möglichkeit, Dateien online freizugeben, anstatt sich auf andere Websites zum Hosten der Dateien zu verlassen. Wenn Sie einen Link-Speicherort von einer anderen Website kopieren, funktioniert die von Ihnen erstellte Download-Schaltfläche nur, solange der Link-Speicherort aktiv ist.
  • Laden Sie niemals Dateien hoch, die gegen Urheberrechtsgesetze verstoßen, da dies zu hohen Geld- oder Gefängnisstrafen führen kann.
  • Testen Sie regelmäßig Ihre Download-Schaltfläche oder den Download-Link auf der Website, von der Sie den Link-Speicherort erhalten haben, um sicherzustellen, dass Benutzer die Datei herunterladen können, wenn sie auf die Schaltfläche klicken, anstatt zu einem defekten Link zu gelangen, auf dem die Datei nicht mehr vorhanden ist.

Empfohlen: