6 Möglichkeiten, HTML-Dateien fehlerfrei in WordPress hochzuladen

Das Hochladen einer HTML-Datei in WordPress ist für die meisten WordPress-Benutzer keine Routineaufgabe. Da Sie mit WordPress Inhalte erstellen können, ohne den Code zu ändern, müssen Sie keine benutzerdefinierten HTML-Dateien hochladen.

Beim Erstellen und Erweitern Ihrer WordPress-Site benötigen Sie jedoch manchmal benutzerdefinierte Inhalte. Hier kommen HTML-Dateien und -Seiten ins Spiel. Wenn Sie sie auf Ihre Website importieren, sparen Sie viel Zeit beim Erstellen benutzerdefinierter Elemente und beim Konfigurieren von Einstellungen von Grund auf neu.

Dieser Artikel wird das Problem und das Hochladen von HTML-Dateien in WordPress im Detail besprechen. Nicht verpassen!

• Was ist eine HTML-Datei?
• Was ist eine HTML-Vorlage?
• Warum sollten Sie HTML-Dateien in WordPress hochladen?
• #1 HTML-Dateien mit dem WordPress Admin Dashboard importieren
• #2 HTML-Dateien mit einem FTP-Client hochladen
• #3 HTML-Dateien über cPanel mit WordPress verbinden
• #4 Wenden Sie ein HTML-zu-WordPress-Konverter-Plugin an
• #5 Verwenden Sie das kostenlose Online-Tool, um HTML in WordPress zu konvertieren
• #6 HTML-Datei zur Google-Verifizierung in WordPress hochladen
• Schützen Sie HTML-Dateien und -Seiten

Was ist eine HTML-Datei?

HTML steht für Hypertext Markup Language, eine Sprache, die zum Erstellen und Strukturieren von E-Dokumenten oder Webseiten verwendet wird. Tatsächlich sind die meisten Webseiten, die Sie heutzutage im Internet durchsuchen, mit HTML-Code geschrieben.

HTML-Dateien sind reine Textdokumente. Sie enthalten den Code, der dafür verantwortlich ist, dass die Inhalte und Bilder Ihrer Website richtig formatiert und angezeigt werden. Mit anderen Worten, HTML hilft Webbrowsern zu verstehen, wie sie Ihre Site-Struktur für Besucher visualisieren können.

HTML schafft die Grundlage für Ihre Webseiten. Sie können HTML-Dateien selbst generieren oder vorhandene Dateien wie Google Docs nehmen und sie in HTML konvertieren. Es ist möglich, ein wenig CSS-Code einzufügen, um der Grundlage einige benutzerdefinierte Designelemente hinzuzufügen. Auf diese Weise erscheint Ihre Website für Website-Besucher perfekt.

Was ist eine HTML-Vorlage?

Eine HTML-Vorlage bezieht sich auf eine vorgefertigte HTML-Datei, die Sie einfach auf Ihre Website hochladen und verwenden können. Es enthält Text, Bilder, Schriftarten und JavaScript.

Für diejenigen, die keine Programmierbasis haben, ist es am besten, eine bereits erstellte HTML-Vorlage in WordPress hochzuladen. Dank HTML-Vorlagen können Sie ansprechende Webseiten entwickeln, ohne sich Sorgen machen zu müssen, die Struktur Ihrer Website zu ruinieren.

Es gibt mehrere Unterschiede zwischen HTML-Vorlagen und WordPress-Themes, die Sie kennen sollten, bevor Sie sie verwenden.

Warum sollten Sie HTML-Dateien in WordPress hochladen?

Wie oben erwähnt, können Sie mit WordPress Webseiten ohne Codierung erstellen. Es gibt jedoch mehrere Gründe, warum Sie manchmal HTML-Dateien verwenden müssen.

Zeitsparende Methode: Sie haben bereits eine großartige HTML-Vorlage für Ihre alte Website geschrieben. Es wird Sie Zeit und Mühe kosten, es für Ihre neue Website von Grund auf neu zu erstellen. Daher wird empfohlen, die vorhandene Vorlage wiederzuverwenden, um Zeit zu sparen und gleichzeitig sicherzustellen, dass alles perfekt aussieht.

Darüber hinaus eliminiert dies auch das Risiko menschlicher Fehler, da Sie den Inhalt insgesamt über HTML-Dateien hochladen können.

Benutzerdefiniertes Layout: Ein weiterer Vorteil des Hochladens einer HTML-Datei in WordPress ist das hochgradig anpassbare Layout. Es ermöglicht Ihnen, Ihren Inhalt außerhalb der Unterstützung Ihres Themas nach Ihren Wünschen anzupassen. Sie können eine vorgefertigte HTML-Datei verwenden oder sie selbst schreiben und einfach auf Ihre Website hochladen.

Website-Verifizierung: Zu guter Letzt kann Ihnen das Hochladen von HTML-Dateien in WordPress bei der Website-Verifizierung helfen. Beispielsweise müssen Sie eine HTML-Verifizierungsdatei auf Ihre Website hochladen, um das Google Search Console-Tool verwenden zu können. Dies gibt Google die Möglichkeit, auf Ihre Website ordnungsgemäß zuzugreifen und sie zu indizieren.

So laden Sie HTML-Dateien in WordPress hoch

Sie haben alles über HTML-Dateien gelernt. Schauen wir uns nun an, wie man HTML-Dateien in WordPress hochlädt.

Weiter lesen!

#1 HTML-Dateien mit dem WordPress Admin Dashboard importieren

Mit dem integrierten WordPress-Dashboard können Sie HTML-Dateien direkt über Ihre Posts, Seiten oder die Medienbibliothek hochladen. Falls Sie den Gutenberg-Editor verwenden, müssen Sie zuerst einen Dateiblock einfügen. Wählen Sie dann Hochladen aus , um die HTML-Dateien zu WordPress hinzuzufügen.

Alternativ stellt dir der Gutenberg-Editor auch einen Custom-HTML- Block zur Verfügung. Sie können den HTML-Code manuell kopieren und in diesen Block einfügen. Für das Hochladen großer Dateien wäre es jedoch einfacher und effektiver, die Dateioption zu verwenden.

Wenn Sie den klassischen Editor verwenden, klicken Sie in Ihren Beiträgen, Seiten oder der Medienbibliothek auf die Schaltfläche Medien hinzufügen . Klicken Sie danach auf Hochladen , um Ihre HTML-Dateien hochzuladen.

Kleiner Hinweis: Manchmal kann es vorkommen, dass beim Hochladen von HTML-Dateien in WordPress über das Admin-Dashboard ein Fehler auftritt. Das häufigste Problem ist „Entschuldigung, dieser Dateityp ist aus Sicherheitsgründen nicht zulässig“.

Dieses Problem tritt auf, weil Ihre WordPress-Site derzeit den Dateityp .html nicht unterstützt. Um ungefilterte Uploads in WordPress zuzulassen, lesen Sie unsere Anleitung für weitere Details.

#2 HTML-Dateien mit einem FTP-Client hochladen

Die Verwendung eines FTP-Clients zum Hochladen von HTML-Dateien ist hilfreich, wenn Sie lokal an einer Testsite arbeiten möchten. Es hilft Ihnen, alle Änderungen zu testen, die Sie vornehmen, bevor Ihre Website live geht. Außerdem verhindert dies unnötige Ausfallzeiten, wenn etwas verrutscht.

In diesem Abschnitt führen wir Sie durch das Hochladen von HTML-Dateien in WordPress mit FileZilla. Befolgen Sie zunächst die nachstehenden Anweisungen:

1. Sichern Sie Ihre Website.
2. Öffnen Sie FileZilla und wählen Sie Quickconnect, nachdem Sie Ihre Anmeldeinformationen eingegeben haben.

3. Navigieren Sie zum Stammordner Ihrer Website.

4. Suchen Sie die HTML-Datei, die Sie von Ihrem Computer hochladen möchten, und klicken Sie mit der rechten Maustaste darauf. Klicken Sie dann auf Hochladen , um es zu Ihrer Website hinzuzufügen.

Nachdem Sie die Datei erfolgreich hochgeladen haben, prüfen Sie, ob sie richtig auf Ihrer Website angezeigt wird. Geben Sie dazu die URL Ihrer Website mit dem Namen der HTML-Datei am Ende in Ihren Browser ein. Zum Beispiel www.pdagold.com/html-file . Wenn es funktioniert, werden Sie auf die neue Webseite umgeleitet, die Sie mit der HTML-Datei erstellt haben.

#3 HTML-Dateien über cPanel mit WordPress verbinden

Die letzte Methode, die wir mit Ihnen teilen werden, ist die Verwendung des cPanel. Melden Sie sich zunächst im cPanel Ihres Hosting-Kontos an und wählen Sie das Datei-Manager- Tool.

Jetzt haben Sie 2 Möglichkeiten:

• Laden Sie die HTML-Datei direkt in Ihren Stammordner hoch.

• Erstellen Sie einen neuen Ordner und laden Sie die HTML-Datei dorthin hoch.

Bei der ersten Technik müssen Sie die HTML-Datei dort entpacken, wo Sie sie gespeichert haben. Ändern Sie dann den Ordner index.html in etwas Neues. Zum Schluss rekomprimieren Sie die Datei, um mit dem Hochladen in WordPress fortzufahren. Die HTML-Vorlage überschreibt die Homepage Ihrer Website, wenn Sie diese Schritte nicht genau befolgen.

Wir empfehlen dringend die zweite Technik, um sicherzustellen, dass Sie Ihre Website nicht ruinieren:

1. Gehen Sie zum public_html- Ordner Ihrer Website.

2. Wählen Sie Neuer Ordner .

3. Geben Sie Ihrem neuen Ordner einen Namen und klicken Sie auf Neuen Ordner erstellen .

4. Doppelklicken Sie auf den Ordner, den Sie gerade erstellt haben, und wählen Sie Hochladen aus , um Ihre HTML-Datei auszuwählen.

5. Ihre gezippte HTML-Datei erscheint im Ordner. Entpacken Sie einfach die HTML-Datei, indem Sie mit der rechten Maustaste klicken und Extrahieren wählen.

6. Wählen Sie Dateien extrahieren , um das Entpacken der Datei abzuschließen.

7. Überprüfen Sie, ob die Datei wie in Methode 2 beschrieben erfolgreich hochgeladen wurde.

Wenn Sie auf einen 404-Fehler stoßen, unterstützt Ihr Server die Weiterleitung von index.php möglicherweise nicht. Gehen Sie in diesem Fall zurück zum Dateimanager und greifen Sie auf Ihre .htaccess- Datei zu. Fügen Sie dann den folgenden Code ein und speichern Sie Ihre Änderungen:

 RewriteRule ^(.*)index\.(php|html?)$ /$1 [R=301,NC,L]

Dieser Code hilft, Ihre index.php- Datei umzuleiten und in den Browser zu laden. Als Ergebnis verschwindet der 404-Fehler.

#4 Wenden Sie ein HTML-zu-WordPress-Konverter-Plugin an

Diese Methode ist für Anfänger geeignet, da keine Programmierkenntnisse erforderlich sind. Ihre Aufgabe ist es, das ausgewählte Plugin zu aktivieren, und es erledigt den Rest für Sie.

Zahlreiche verfügbare Plugins ermöglichen es Ihnen, HTML in WordPress-Inhalte hochzuladen und zu konvertieren, ohne ein Stück Code zu berühren. Machen Sie sich keine Gedanken mehr über die Codierung. Der Einfachheit halber haben wir die Liste auf die 7 besten Plugins eingegrenzt.

Werfen wir einen Blick auf sie!

Plugin-Empfehlungen

HTML-Snippet einfügen: Wandeln Sie HTML-, CSS- und JavaScript-Codes in Shortcodes um und integrieren Sie Ihre Snippets in WordPress-Seiten und -Widgets.

Einfache Sitemap: Erstellen Sie eine responsive HTML-Sitemap und zeigen Sie sie ohne komplizierte Shortcodes direkt im Editor an.

Rohes HTML: Aktivieren Sie rohes HTML oder jeden anderen Code in Ihren Beiträgen und deaktivieren Sie intelligente Anführungszeichen und automatische Formatierung.

WP-Code: Fügen Sie PHP-Code-Snippets, Header- und Footer-Skripte und Ad-Pixel-Codes mit bedingter Logik in WordPress ein.

WP Coder: Fügen Sie Ihren Webseiten benutzerdefiniertes CSS, HTML und JavaScript hinzu.

HTML in Kategoriebeschreibungen zulassen: Ermöglichen Sie es Ihnen, ungefiltertes HTML in Ihren Kategoriebeschreibungen anzuwenden, indem Sie ausgewählte WordPress-Filter deaktivieren.

Code-Einbettung: Bieten Sie eine einfache und effiziente Möglichkeit, Code wie JavaScript und HTML in Ihre Posts und Seiten einzubetten.

Plugin-Anweisungen

In diesem Tutorial zeigen wir Ihnen, wie Sie benutzerdefinierte HTML-Codes und Dateien mit dem WP Coder-Plugin einfügen.

So funktioniert das:

1. Installieren und aktivieren Sie das Plugin.
2. Navigieren Sie in Ihrem WordPress-Admin-Dashboard zu Wow-Plugins → WP Coder .
3. Um einen neuen HTML-Code hinzuzufügen, kopieren Sie ihn und fügen Sie ihn in den Abschnitt HTML-Code auf der Registerkarte Neu hinzufügen ein.

Oder Sie können zum Menü Dateien einschließen gehen. Kopieren Sie die URL der HTML-Datei, die Sie in die Medienbibliothek hochgeladen haben, und fügen Sie sie in das Feld URL zur Datei ein . Klicken Sie dann zum Abschluss auf Neu hinzufügen .

4. Klicken Sie auf die Schaltfläche Speichern und kopieren Sie den im Abschnitt Veröffentlichen generierten Shortcode.

5. Fügen Sie den Shortcode an beliebiger Stelle auf Ihrer Seite ein und genießen Sie die Ergebnisse.

#5 Verwenden Sie das kostenlose Online-Tool, um HTML in WordPress zu konvertieren

So konvertieren Sie Ihr HTML mit einem Online-Tool in WordPress:

1. Rufen Sie die htmltowordpress-Website auf.
2. Laden Sie die HTML-ZIP-Datei Ihrer Website in das Feld hoch.

3. Sie können eine Vorschau Ihrer WordPress-Website anzeigen. Klicken Sie oben auf der Seite auf die Schaltfläche Anpassen .

4. Ändern Sie die Website nach Ihren Wünschen.

5. Klicken Sie zum Abschluss auf Speichern und veröffentlichen .

#6 HTML-Datei zur Google-Verifizierung in WordPress hochladen

Wir zeigen Ihnen, wie Sie eine HTML-Verifizierungsdatei in WordPress hochladen. Hier ist die Strecke:

1. Gehen Sie zur Google Search Console und klicken Sie auf Jetzt starten .
2. Geben Sie den Benutzernamen und das Passwort für Ihr Gmail-Konto ein.
3. Verifizieren Sie Ihre Website mit ihrem Domainnamen oder URL-Präfix . Die Domain- Option unterstützt nur die DNS-Überprüfung. Für das Hochladen von HTML-Dateien wählen Sie bitte das URL-Präfix . Geben Sie die URL Ihrer Website ein und klicken Sie auf Weiter .

4. Wählen Sie im Abschnitt HTML-Datei die Schaltfläche aus, die Sie auffordert , die Datei herunterzuladen .

5. Nachdem Sie die HTML-Datei auf Ihren lokalen Computer heruntergeladen haben, laden Sie die Datei auf Ihre WordPress-Website hoch.

Schützen Sie HTML-Dateien und -Seiten

Es kommt eine Zeit, in der der Schutz Ihrer HTML-Dateien unerlässlich ist. Zum Beispiel, wenn Sie möchten, dass nur Administratoren oder bestimmte Benutzerrollen auf die Dateien zugreifen können. In einer solchen Situation wird PDA Gold Ihre Bedürfnisse befriedigen.

Das Plugin ermöglicht es Ihnen, die HTML-Dateien zu schützen, die in einen Ordner unter Ihrem WordPress-Stammverzeichnis hochgeladen wurden. Einmal geschützt, werden unbefugte Besucher beim Versuch, auf die Dateien zuzugreifen, auf eine Fehlerseite umgeleitet.

Das Coolste ist, dass Sie die geschützten HTML-Dateien mithilfe des iFrame-Tags in Inhalte einfügen können. Auf diese Weise können Ihre Besucher das HTML über iFrame sehen, aber gleichzeitig nicht direkt auf die Dateien zugreifen.

Detaillierte Schritte finden Sie in unserem Leitfaden zum Schutz von WordPress-HTML-Dateien, die in iFrame angezeigt werden.

Machen Sie jetzt vollen Gebrauch von Ihren HTML-Dateien!

Das ist alles, was Sie über das Hochladen von HTML-Dateien in WordPress wissen sollten. Zusammenfassend sind HTML-Dateien praktisch, wenn Sie ein benutzerdefiniertes Seitenlayout benötigen. Es ist auch eine großartige Option, wenn Sie Ihre alte Website auf die neue migrieren möchten.

Das Beste daran ist, dass das Hochladen und Verwenden von HTML-Dateien in WordPress keine schwierigen Aufgaben sind. Mit nur wenigen einfachen Schritten können Sie schöne Webseiten erstellen. Also, warte nicht. Beginnen Sie jetzt mit Ihren HTML-Dateien!

Weitere Informationen zur HTML-Bearbeitung in WordPress finden Sie in unserem Artikel.

Vergessen Sie nicht, unsere Website zu abonnieren, um weitere nützliche Anweisungen zu erhalten!