Möchten Sie eine Schaltfläche zum Laden weiterer Beiträge in WordPress hinzufügen? Viele beliebte Plattformen ermöglichen es Benutzern, mehr Beiträge zu laden, wenn sie das Ende der Seite erreichen. In diesem Artikel zeigen wir Ihnen, wie Sie ganz einfach eine Schaltfläche zum Laden weiterer Beiträge in WordPress hinzufügen.
Wann und warum Add More Posts Button in WordPress hinzufügen
Wenn Sie Ihre Benutzer mit den Inhalten beschäftigen, können Sie mehr Aufrufe und letztendlich mehr Abonnenten erzielen.
Viele Blogs verwenden den einfachen Navigationslink „Ältere Beiträge“ am Ende ihrer Startseite, Blog- und Archivseiten. Einige Websites verwenden eine numerische Seitennavigation, die mehr Kontext hinzufügt.
Es gibt jedoch bestimmte Arten von Websites, die immens von der Schaltfläche zum unendlichen Scrollen oder zum Laden weiterer Beiträge profitieren können. Einige Beispiele sind: Fotografie-Websites, Listicles und virale Content-Websites.
Anstatt eine ganz neue Seite zu laden, funktioniert die Schaltfläche „Weitere Beiträge laden“ wie unendliches Scrollen. Es verwendet JavaScript, um schnell den nächsten Inhaltssatz abzurufen. Dies verbessert die Benutzererfahrung und gibt ihnen die Möglichkeit, mehr von Ihren Inhalten anzuzeigen.
Lassen Sie uns jedoch einen Blick darauf werfen, wie Sie die Schaltfläche zum Laden weiterer Beiträge auf Ihrer WordPress-Site einfach hinzufügen können.
Hinzufügen der Schaltfläche „Mehr Beiträge laden“ in WordPress
Als erstes müssen Sie die installieren und aktivieren Mehr laden Plugin. Weitere Informationen finden Sie in unserer Schritt-für-Schritt-Anleitung zur Installation eines WordPress-Plugins.
Nach der Aktivierung fügt das Plugin Ihrem WordPress-Admin-Menü einen neuen Menüpunkt mit der Bezeichnung „Ajax Load More“ hinzu. Sie müssen darauf klicken und zur Einstellungsseite des Plugins gehen.
Auf der Einstellungsseite können Sie die Farbe Ihrer Schaltfläche auswählen. Sie können die Schaltfläche auch durch unendliches Scrollen ersetzen, wodurch der nächste Stapel von Posts automatisch geladen wird, ohne dass Benutzer auf die Schaltfläche klicken.
Als nächstes müssen Sie besuchen Ajax Mehr laden » Repeater-Vorlage Seite, um Ihre Vorlage zum Anzeigen von Beiträgen hinzuzufügen.
Das Plugin wird mit einer grundlegenden Vorlage geliefert, die die WordPress-Schleife enthält, um Beiträge anzuzeigen. Es passt jedoch nicht zu Ihrem Thema und kann auf Ihrer Website fehl am Platz aussehen.
Um dies zu beheben, müssen Sie den Code kopieren, den Ihr Theme verwendet, um Beiträge auf Index-, Archiv- und Blog-Seiten anzuzeigen.
Normalerweise befindet sich dieser Code im Ordner template-parts Ihres Themes. In diesem Ordner sehen Sie Vorlagen, um verschiedene Inhalte anzuzeigen. Zum Beispiel content-page.php, content-search.php und mehr.
Sie suchen nach der generischen Vorlage content.php. Hier ist ein Beispiel aus der content.php-Datei unseres Demo-Themes:
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <?php // Post thumbnail. twentyfifteen_post_thumbnail(); ?> <header class="entry-header"> <?php if ( is_single() ) : the_title( '<h1 class="entry-title">', '</h1>' ); else : the_title( sprintf( '<h2 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h2>' ); endif; ?> </header><!-- .entry-header --> <div class="entry-content"> <?php /* translators: %s: Name of current post */ the_content( sprintf( __( 'Continue reading %s', 'twentyfifteen' ), the_title( '<span class="screen-reader-text">', '</span>', false ) ) ); wp_link_pages( array( 'before' => '<div class="page-links"><span class="page-links-title">' . __( 'Pages:', 'twentyfifteen' ) . '</span>', 'after' => '</div>', 'link_before' => '<span>', 'link_after' => '</span>', 'pagelink' => '<span class="screen-reader-text">' . __( 'Page', 'twentyfifteen' ) . ' </span>%', 'separator' => '<span class="screen-reader-text">, </span>', ) ); ?> </div><!-- .entry-content --> <?php // Author bio. if ( is_single() && get_the_author_meta( 'description' ) ) : get_template_part( 'author-bio' ); endif; ?> <footer class="entry-footer"> <?php twentyfifteen_entry_meta(); ?> <?php edit_post_link( __( 'Edit', 'twentyfifteen' ), '<span class="edit-link">', '</span>' ); ?> </footer><!-- .entry-footer --> </article><!-- #post-## -->
Sobald Sie diesen Code gefunden haben, müssen Sie ihn in das Feld Repeater Templates in den Plugin-Einstellungen einfügen.
Vergessen Sie nicht, auf die Schaltfläche „Vorlage speichern“ zu klicken, um Ihre Einstellungen zu speichern.
Als nächstes müssen Sie besuchen Ajax Mehr laden » Shortcode Builder Seite, um den Shortcode zu generieren.
Diese Seite enthält viele verschiedene Optionen, die Sie anpassen können. Zuerst müssen Sie den Containertyp auswählen. Wenn Sie sich nicht sicher sind, schauen Sie sich einfach die Vorlage an, die Sie zuvor kopiert haben. Die meisten modernen Themes verwenden die <div>
; Element.
Scrollen Sie anschließend nach unten zum Abschnitt mit den Schaltflächenbeschriftungen. Hier können Sie den Text ändern, der auf der Schaltfläche angezeigt wird. Standardmäßig verwendet das Plugin „Ältere Beiträge“, und Sie können dies in „Weitere Beiträge laden“ oder alles andere ändern, was Sie möchten.
Schließlich müssen Sie auswählen, ob Beiträge automatisch geladen werden sollen, oder warten, bis Benutzer auf die Schaltfläche Weitere Beiträge laden klicken.
Ihr Shortcode ist jetzt einsatzbereit. In der rechten Spalte sehen Sie die Shortcode-Ausgabe. Fahren Sie fort und kopieren Sie den Shortcode und fügen Sie ihn in einen Texteditor ein, da Sie ihn im nächsten Schritt benötigen.
Hinzufügen von Load More Posts in Ihrem WordPress-Theme
In diesem Teil des Tutorials müssen Sie Ihren WordPress-Themedateien Code hinzufügen. Wenn Sie dies noch nicht getan haben, werfen Sie einen Blick auf unsere Anleitung zum Kopieren und Einfügen von Code in WordPress.
Vergessen Sie nicht, Ihr WordPress-Theme zu sichern, bevor Sie Änderungen vornehmen.
Sie müssen die Vorlagendateien finden, in denen Sie die Schaltfläche Weitere Beiträge laden in Ihrem Design hinzufügen möchten. Je nachdem, wie Ihr Theme organisiert ist, sind diese Dateien normalerweise index.php, archives.php, Categories.php usw.
Sie müssen den Shortcode, den Sie zuvor kopiert haben, direkt nach dem in Ihr Thema einfügen endwhile;
Schild.
Da wir den Shortcode in einer Designdatei hinzufügen, müssen wir ihn wie folgt in die Funktion do_shortcode einfügen:
echo do_shortcode('[ajax_load_more container_type="div" post_type="post"]');
Sie können jetzt Ihre Änderungen speichern und Ihre Website besuchen, um die Schaltfläche „Weitere Beiträge laden“ in Aktion zu sehen.
Wir hoffen, dass dieser Artikel Ihnen geholfen hat, zu lernen, wie Sie die Schaltfläche „Weitere Beiträge laden“ in WordPress hinzufügen. Vielleicht möchten Sie auch unsere Mega-Liste der nützlichsten WordPress-Tipps, -Tricks und -Hacks für Anfänger sehen.