So verbessern Sie Ihre 404-Seitenvorlage in WordPress (2 Möglichkeiten)

Möchten Sie Ihre 404-Seitenvorlage in WordPress verbessern?

Die Verbesserung der standardmäßigen WordPress 404-Seite kann dazu beitragen, eine bessere Benutzererfahrung zu schaffen, die Absprungrate zu reduzieren und die Seitenaufrufe zu erhöhen.

In diesem Artikel zeigen wir Ihnen Schritt für Schritt, wie Sie Ihre 404-Seitenvorlage in WordPress anpassen.

Warum sollten Sie Ihre 404-Seitenvorlage in WordPress verbessern?

Die meisten Besucher, die auf der standardmäßigen WordPress 404-Seite landen, werden Ihre WordPress-Website schnell verlassen.

Dies erhöht Ihre Absprungrate, führt zu einer schlechten Benutzererfahrung und kann sich sogar negativ auf Ihr Suchmaschinenranking auswirken.

Indem Sie Ihre WordPress 404-Seite verbessern, können Sie Besucher zu beliebten Posts leiten, die Seitenaufrufe erhöhen und die Absprungrate reduzieren und einmalige Besucher in langfristige Leser und Kunden verwandeln.

Wenn ein Besucher länger auf Ihrer Website bleibt, ist es wahrscheinlicher, dass er einen Kauf tätigt, mehr Beiträge liest, Ihrer E-Mail-Liste beitritt und vieles mehr.

Außerdem kann es Ihre WordPress-SEO verbessern, sodass Sie mehr Suchmaschinen-Traffic erhalten.

Hinweis: Es ist wichtig, eine benutzerdefinierte 404-Seite zu erstellen, aber Sie sollten auch verfolgen, welche 404-URLs Besucher verwenden, um Ihre Website zu besuchen, und dann geeignete Weiterleitungen einrichten, um das SEO-Ranking zu verbessern.

Weitere Einzelheiten finden Sie in unserem Leitfaden zum einfachen Nachverfolgen von 404-Seiten und deren Weiterleitung in WordPress.

Lassen Sie uns einen Blick darauf werfen, wie Sie Ihre 404-Seitenvorlage in WordPress verbessern können.

Videoanleitung

Wenn Sie schriftliche Anweisungen bevorzugen, lesen Sie einfach weiter.

Methode 1. Erstellen Sie eine benutzerdefinierte 404-Seite in WordPress ohne Code

Die beste und anfängerfreundlichste Art, Ihr 404-Seiten-Template zu verbessern, ist die Verwendung des SeedProd Page Builder-Plug-ins.

SeedProd ist der beste Zielseitenersteller für WordPress. Damit können Sie Ihre WordPress-Seiten erstellen, bearbeiten und anpassen, ohne Code schreiben zu müssen.

Mit diesem Plugin können Sie mithilfe der enthaltenen 404-Seitenvorlagen ganz einfach eine benutzerdefinierte 404-Seite erstellen.

Als erstes müssen Sie das SeedProd-Plugin installieren. Weitere Einzelheiten finden Sie in unserer Schritt-für-Schritt-Anleitung zur Installation eines WordPress-Plugins.

Hinweis: Es ist eine kostenlose Version von SeedProd verfügbar, aber wir verwenden die Pro-Version, da sie die von uns benötigten 404-Seitenvorlagen enthält.

Nach der Aktivierung müssen Sie zu SeedProd » Einstellungen navigieren und Ihren Lizenzschlüssel eingeben. Sie finden diese Informationen auf Ihrer Kontoseite auf der SeedProd-Website.

Gehen Sie danach zu SeedProd » Seiten und klicken Sie im Metafeld „404-Seite“ auf die Schaltfläche „404-Seite einrichten“.

Dadurch gelangen Sie zu einer Seite, auf der Sie Ihre 404-Seitenvorlage auswählen können.

Es gibt Dutzende von professionell gestalteten 404-Seitenvorlagen, die Sie auswählen können, um Ihnen den schnellen Einstieg zu erleichtern.

Um eine Vorlage auszuwählen, bewegen Sie den Mauszeiger darüber und klicken Sie auf das Symbol „Häkchen“. Für dieses Tutorial verwenden wir die Vorlage „Oh No 404 Page“, aber Sie können jede beliebige Vorlage verwenden.

Nachdem Sie eine Vorlage ausgewählt haben, werden Sie zum Drag-and-Drop-Builder weitergeleitet, wo Sie mit der Anpassung Ihrer 404-Seite beginnen können.

Auf der linken Seite des Bildschirms finden Sie Blöcke und Abschnitte, die Sie zu Ihrer 404-Seite hinzufügen können. Die rechte Seite der Seite ist die Live-Vorschau. Jedes Element auf der Seite kann bearbeitet und angepasst werden.

Als erstes werden wir Text hinzufügen und den Benutzern mitteilen, was sie als Nächstes tun sollen. Anstatt einfach auf einer 404-Seite zu landen und diese zu verlassen, können Sie Ihre Besucher zu wertvollen Inhalten und den nächsten zu ergreifenden Maßnahmen leiten.

Ziehen Sie dazu den Block „Text“ auf Ihre Seite und klicken Sie darauf, um den Text zu ändern.

Als Nächstes ändern wir den Link der Startseiten-Schaltfläche und verlinken stattdessen auf einen der wertvollsten Inhalte.

Dies kann ein Beitrag in Ihrem WordPress-Blog sein, der am beliebtesten ist, oder einer, der Ihnen die meisten Einnahmen bringt.

Ziehen Sie zuerst über den Block „Überschrift“ und fügen Sie Ihre neue Überschrift hinzu.

Ziehen Sie dann über einen anderen „Text“-Block und geben Sie einen Text ein, der Ihren Artikel beschreibt.

Klicken Sie danach auf die Schaltfläche, um den Schaltflächen-Editor-Bildschirm aufzurufen.

Hier können Sie Text, Farbe, Größe und mehr anpassen.

Fügen Sie Ihre beliebtesten Beiträge zu Ihrer WordPress 404-Seite hinzu

Als nächstes können Sie Ihre beliebtesten Artikel hinzufügen. Da diese Artikel nachweislich beliebt sind, besteht eine gute Chance, dass Ihre Besucher etwas finden, das ihnen gefällt.

Der einfachste Weg, dies zu tun, ist die Verwendung des MonsterInsights-Plugins. Es ist die beste Analyselösung für WordPress, die von über 3 Millionen Websites verwendet wird.

Mit diesem Plugin können Sie einfach beliebte Beiträge überall auf Ihrer WordPress-Website hinzufügen.

Weitere Einzelheiten finden Sie in unserem Leitfaden zum Anzeigen beliebter Beiträge nach Aufrufen in WordPress.

Sobald das Plugin aktiviert und eingerichtet ist, müssen Sie Ihrer Seite nur noch einen einzigen Shortcode hinzufügen.

Ziehen Sie dazu einfach den „Shortcode“-Block auf Ihre Seite.

Geben Sie dann den folgenden Shortcode ein, um Ihre beliebtesten Beiträge anzuzeigen.

Der Abschnitt theme=“beta” bezieht sich darauf, wie Ihre beliebten Posts angezeigt werden. Wenn Sie sehen möchten, wie die verschiedenen Themen aussehen, gehen Sie zu Insights » Popular Posts und klicken Sie auf „Popular Posts Widget“.

Im Abschnitt „Design auswählen“ können Sie jedes der Themen und ihre Namen anzeigen.

Sie können auch eine Überschrift über Ihren beliebten Beiträgen hinzufügen, indem Sie die gleichen Schritte wie oben befolgen.

Fügen Sie Ihrer WordPress 404-Seite ein Kontaktformular hinzu

Danach können Sie Ihrer 404-Seite direkt ein Kontaktformular hinzufügen. Auf diese Weise können Ihre Besucher Sie kontaktieren, wenn sie in den obigen Links nicht finden konnten, wonach sie gesucht haben.

Der beste Weg, ein Kontaktformular zu Ihrer Website hinzuzufügen, ist die Verwendung des WPForms-Plugins. Es ist das beste Kontaktformular-Plugin für WordPress, das von über 4 Millionen Websites verwendet wird.

Weitere Informationen finden Sie in unserer Schritt-für-Schritt-Anleitung zum Erstellen eines Kontaktformulars in WordPress.

Sobald das Plugin aktiviert und eingerichtet ist, können Sie den Block „Kontaktformular“ einfach auf Ihre Seite ziehen.

Dann müssen Sie nur noch Ihr Kontaktformular aus der Dropdown-Liste auswählen.

Sie müssen zuerst Ihr Kontaktformular erstellen, bevor Sie es zu Ihrer 404-Seite hinzufügen können.

Sie können auch einen „Überschrift“- oder „Text“-Block über Ihrem Kontaktformular hinzufügen.

Befolgen Sie die gleichen Schritte wie oben, um diese Blöcke hinzuzufügen.

Wenn Sie mit den Änderungen fertig sind, stellen Sie sicher, dass Sie in der oberen rechten Ecke der Seite auf „Speichern“ klicken.

Wenn Sie Ihre Seite live veröffentlichen möchten, wählen Sie den Dropdown-Pfeil neben „Speichern“ und klicken Sie auf „Veröffentlichen“.

Sie können auch das Logo und das Navigationsmenü ändern, indem Sie darauf klicken und Änderungen mit dem Bedienfeld auf der linken Seite vornehmen und dann den gleichen Bearbeitungsprozess wie oben ausführen.

Fühlen Sie sich frei, Ihre Seite weiter anzupassen, neue Blöcke hinzuzufügen und verschiedene Layouts zu testen, um zu sehen, was Ihre Besucher bevorzugen.

Wenn Sie Inhaber eines WooCommerce-Shops sind, können Sie Ihre 404-Seite anpassen, indem Sie beliebte Produkte anzeigen, um mehr Umsatz zu erzielen.

Um Ihre neue 404-Seite zu aktivieren, navigieren Sie zurück zu SeedProd » Seiten und schalten Sie dann den Schalter „404-Seite“ auf „Aktiv“.

Jetzt sehen Ihre Besucher Ihre hochkonvertierende 404-Seite anstelle der Standardoption.

Profi-Tipp: Sie können die Leistung Ihrer WordPress 404-Seite verfolgen, um zu sehen, wie sie konvertiert und welche Änderungen am nützlichsten sind. Weitere Einzelheiten finden Sie in unserem Anfängerleitfaden zur Installation von Google Analytics in WordPress.

Methode 2. Erstellen Sie eine benutzerdefinierte 404-Seite in WordPress, indem Sie Code hinzufügen

Diese Methode ist nicht so anfängerfreundlich, da Sie Code hinzufügen und WordPress-Designdateien ändern müssen.

Wenn Sie dies noch nicht getan haben, lesen Sie bitte unseren Anfängerleitfaden zum Einfügen von Snippets aus dem Web in WordPress.

Zuerst müssen Sie eine neue Datei in Ihrem WordPress-Designordner erstellen und sie 404.php . Wenn Ihr Design bereits eine 404.php -Datei enthält, müssen Sie stattdessen diese Datei bearbeiten.

Um diese Datei zu bearbeiten, müssen Sie sich mit einem FTP-Client oder ihrem Dateimanager-Tool mit Ihrem WordPress-Hosting-Konto verbinden.

Nachdem Sie mit Ihrer Website verbunden sind, können Sie Ihre 404.php -Datei im Ordner Ihres WordPress-Themes sehen.

Hinweis: Bevor Sie Ihr WordPress-Design anpassen, empfehlen wir, Ihre WordPress-Site zu sichern. Weitere Informationen finden Sie in unserem Leitfaden zum Sichern und Wiederherstellen Ihrer WordPress-Site.

Zeigen Sie die beliebtesten Beiträge auf der 404-Seite an

Als erstes müssen Sie das kostenlose WordPress Popular Posts Plugin installieren und aktivieren. Es ist eines der beliebtesten Post-Plugins für WordPress.

Weitere Einzelheiten finden Sie in unserer Schritt-für-Schritt-Anleitung zur Installation eines WordPress-Plugins.

Bei der Aktivierung müssen Sie dieses Vorlagen-Tag in Ihre 404.php -Datei einfügen, in der Sie die beliebten Beiträge anzeigen möchten.

<?php wpp_get_mostpopular(); ?>

Anzeige der am häufigsten kommentierten Beiträge auf der 404-Seite

Um die am häufigsten kommentierten Beiträge zu Ihrer WordPress 404-Seite hinzuzufügen, verwenden wir dasselbe Plugin, das Sie oben aktiviert haben.

Fügen Sie einfach das folgende Vorlagen-Tag dort hinzu, wo Sie Ihre am häufigsten kommentierten Beiträge anzeigen möchten.

<?php wpp_get_mostpopular("range=all&order_by=comments"); ?>

Sie können sich auch unsere Anleitung ansehen, wie Sie die meisten kommentierten Beiträge in WordPress anzeigen können.

Neueste Beiträge auf der 404-Seite anzeigen

Es gibt mehrere Möglichkeiten, aktuelle Beiträge in WordPress anzuzeigen.

Am einfachsten ist es, dieses Vorlagen-Tag in Ihre 404-Vorlage einzufügen, um Ihre letzten Posts anzuzeigen.

<?php wp_get_archives( array( 'type' => 'postbypost', 'limit' => 10, 'format' => 'custom', 'before' => '', 'after' => '<br />' ) ); ?>

Zeigen Sie zufällige Beiträge auf der 404-Seite an

Wenn Sie eine zufällige Liste von Beiträgen in WordPress anzeigen möchten, können Sie diesen Code einfach in Ihre 404-Vorlage einfügen, wo Sie eine zufällige Liste von Beiträgen von Ihrer Website anzeigen möchten.

<ul>
<?php 
$posts = get_posts('orderby=rand&numberposts=5'); 
   foreach($posts as $post)  ?>
        <li><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a>
        </li>
   <?php  ?>
</ul>

Fügen Sie Monatsarchive mit Kompaktarchiven hinzu

Wenn Sie viele Inhalte auf Ihrer Website haben, können Sie dies gut organisieren, indem Sie Ihre monatlichen Archive anzeigen.

Hier bei WPBeginner zeigen wir unsere monatlichen Archive auf unserer 404-Seite mit dem Compact Archives-Plugin an. Dieses Plugin wird von unserem Team entwickelt und gepflegt.

Weitere Einzelheiten finden Sie in unserem Leitfaden zum Erstellen kompakter Archive in WordPress.

Sobald das Plugin aktiviert und eingerichtet ist, fügen Sie einfach den folgenden Code zu Ihrer 404.php -Datei hinzu.

<p><strong>By Date</strong></p>
<ul>
<?php compact_archive($); ?>
</ul>

Wenn ein Benutzer auf Ihrer 404-Seite landet, sieht er Ihre kompakten Post-Archive.

So wird es auf unserer 404-Seite angezeigt.

Eine Beispiel-404-Vorlage für WordPress

Hier ist eine 404.php -Beispieldatei, die auf der 404-Seitenvorlage des Standard-WordPress-Themes Twenty Twenty-One basiert.

<?php
/**
 * The template for displaying 404 pages (not found)
 *
 * @link https://codex.wordpress.org/Creating_an_Error_404_Page
 *
 * @package WordPress
 * @subpackage Twenty_Twenty_One
 * @since Twenty Twenty-One 1.0
 */

get_header();
?>

	<header class="page-header alignwide">
		<h1 class="page-title"><?php esc_html_e( 'Nothing here', 'twentytwentyone' ); ?></h1>
	</header><!-- .page-header -->

	<div class="error-404 not-found default-max-width">
		<div class="page-content">
			<p><?php esc_html_e( 'It looks like nothing was found at this location. Maybe try a search?', 'twentytwentyone' ); ?></p>
			<?php get_search_form(); ?>
			
			<h4>While you're here, check out some of our popular content:</h4>
 
<div class="col1">
<div class="col-header">          
<strong>Popular</strong>
</div>
<?php wpp_get_mostpopular(); ?>
</div>
 
<div class="col2">
<div class="col-header">          
<strong>Comments</strong>
</div>
 <?php wpp_get_mostpopular("range=all&order_by=comments"); ?>
</div>
 
<div class="col3">
<div class="col-header">          
<strong>Recent</strong>
</div>
 <?php wp_get_archives( array( 'type' => 'postbypost', 'limit' => 5, 'format' => 'custom', 'before' => '', 'after' => '<br />' ) ); ?>
</div>
			
		</div><!-- .page-content -->
	</div><!-- .error-404 -->

<?php
get_footer();

Vergleichen Sie diese 404-Vorlage mit der Standardvorlage in Twenty Twenty-One.

Sie werden feststellen, dass wir direkt nach dem Suchformular unseren benutzerdefinierten Code hinzugefügt haben, um beliebte, am häufigsten kommentierte und aktuelle Beiträge anzuzeigen.

Danach haben wir dem WordPress-Theme-Stylesheet benutzerdefiniertes CSS hinzugefügt, um es in Spalten zu unterteilen.

Weitere Informationen finden Sie in unserem Leitfaden zum einfachen Hinzufügen von benutzerdefiniertem CSS zu Ihrer WordPress-Site.

.col1, .col2, .col3  
width:30%;
float:left;
padding:0px 10px 10px 10px;
margin:0px;

.col3:after
clear:both;

.col-header  
background:#28303D;
color:#D1E3DD;
margin:0px;
padding:1px;
text-align:center;

Dies ist das Endergebnis nach dem Hinzufügen des benutzerdefinierten 404-Seitencodes oben.

Wir hoffen, dass dieser Artikel Ihnen geholfen hat, Ihre 404-Seitenvorlage in WordPress zu verbessern. Vielleicht möchten Sie auch die besten Designbeispiele für WordPress 404-Fehlerseiten und unsere Expertenauswahl der besten Web-Push-Benachrichtigungssoftware sehen, um Ihren Website-Traffic zu steigern.

Wenn Ihnen dieser Artikel gefallen hat, dann abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Video-Tutorials. Sie finden uns auch auf Twitter und Facebook.