Wie man lange WordPress-Beiträge in Seiten aufteilt, ohne SEO zu beeinträchtigen

Als ich mit dem Bloggen begann, befolgte ich keine SEO- oder Optimierungsregeln oder irgendetwas anderes. Ich habe einfach gepostet und das war's. Das führte dazu, dass ich Tausende von nicht optimierten Bildern und Hunderte von langen, sehr langen Artikeln anhäufte.

Dann habe ich weitere lange Artikel veröffentlicht, die ich gerade ausreichend optimiert habe. Bis heute gibt es also etwa 100 Artikel mit mehr als 1500 Wörtern, mehrere Dutzend mit mehr als 3500 Wörtern. Und viele andere mit mehr als 1000 Wörtern.

Viele dieser Texte sind so genannte"Evergreen"- oder zeitlose Artikel. Da sie umfassendere Texte sind als der typische schnelle Beitrag, sind sie in der Regel die Links, die besser ranken und mehr konstanten organischen Verkehr erhalten. Das ist die gute Nachricht, die schlechte ist, dass es sich dabei auch um die Beiträge handelt, die am schlechtesten geladen werden und schlechte Metriken liefern, da Google URLs nach Gruppen verarbeitet.

Und das musste aus vielen Gründen behoben werden.

Warum lange Beiträge aufteilen?

Der Hauptgrund, warum es ratsam ist, lange Beiträge in Seiten aufzuteilen, ist die Entlastung, insbesondere bei Beiträgen, die viele Bilder und/oder Videos und andere Elemente enthalten.

Abgesehen von der notwendigen Verbesserung der Ladegeschwindigkeit erhöht dies die Chancen, eine bessere Positionierung zu erreichen oder zumindest beizubehalten, und erhöht die Verweildauer der Besucher und die Anzahl der pro Sitzung besuchten Seiten, indem es die Absprungrate verringert.

Es gibt jedoch einige Dinge zu beachten. Behalten Sie die ursprüngliche URL bei, um keine neuen URLs zu erstellen, die die Suchmaschinenoptimierung verwässern können, und damit Google und andere Browser den Inhalt weiterhin als einen einzigen Artikel indizieren.

Das Wichtigste ist die Verwendung von rel="next" und rel="prev" in der , um Google zu zeigen, dass es sich um eine Serie handelt.

In einem Beitrag, der in drei Seiten unterteilt ist, müssen Sie beispielsweise beim Besuch der zweiten Seite im Quellcode innerhalb des Tags Folgendes finden

<link rel="canonical" href="https://jrmora.com/post-ejemplo/2/" />
<link rel="prev" href="https://jrmora.com/post-ejemplo/" />
<link rel="next" href="https://jrmora.com/post-ejemplo/3/" />

Einige Überlegungen

Es reicht nicht aus, Artikel einfach aufzuteilen, um mehr Seitenaufrufe zu erhalten. Die Paginierung muss eine bestimmte Logik haben, die auf einer natürlichen Navigation beruht. Dazu müssen Sie sich in die Lage des Besuchers versetzen oder durch Ihre Website navigieren, als wäre es die Website eines anderen Besuchers.

Jede Unterseite sollte als eigenständige Seite funktionieren oder zumindest Informationen darüber enthalten, was Sie auf ihr finden werden, sowie eine logische Einführung in die neue Unterseite. Sie muss genügend Inhalt haben, um als schlecht oder wenig wertvoll zu gelten. Google straft"dünnen Inhalt" ab.

Die Paginierung sollte deutlich zeigen, dass der Artikel in Seiten unterteilt ist. Es ist auch nicht schlecht, zumindest auf der ersten Seite ein Inhaltsverzeichnis einzufügen.

Obwohl es keine "offizielle" Regel gibt, sollten Sie übermäßige Seitenzahlen vermeiden. Im Allgemeinen ist es ratsam, Beiträge von 1500/1800 Wörtern oder mehr auf maximal zwei oder drei Seiten aufzuteilen.

Geteilter Beitrag mit Gutenbergs nativem Seitenumbruch-Block

Es gibt verschiedene Möglichkeiten, dies mit Plugins zu erreichen, aber wie Sie wissen, bevorzuge ich es, so wenige Plugins wie möglich zu verwenden.

Der"Seitenumbruch"-Block von Gutenberg ist die beste Option.

Der Block fügt rel="next" und rel="prev" sowie "canonical"-Tags zu den geteilten Seiten hinzu. Wenn Sie jedoch sicherstellen möchten, dass sie angezeigt werden, können Sie diese Funktion in die Datei functions.php Ihrer Vorlage aufnehmen.

// Añadir etiquetas rel="next" y rel="prev" para paginación con Bloque Page Break <!--nextpage--> o Salto de Página
function gp_add_pagination_rel_tags() {
    if (is_singular() && !is_front_page()) {
        global $page, $numpages, $post;
        
        // Solo si hay paginación
        if ($numpages > 1) {
            // Etiqueta rel="prev" (página anterior)
            if ($page > 1) {
                echo '<link rel="prev" href="' . get_permalink($post) . ($page - 1) . '/" />' . "\n";
            }
            
            // Etiqueta rel="next" (página siguiente)
            if ($page < $numpages) {
                echo '<link rel="next" href="' . get_permalink($post) . ($page + 1) . '/" />' . "\n";
            }
        }
    }
}
add_action('wp_head', 'gp_add_pagination_rel_tags');

Design ist wichtig

Das Aussehen und die Elemente der Paginierung sind sehr wichtig, da sie es dem Besucher ermöglichen, sofort zu verstehen, dass der Artikel auf den folgenden Seiten fortgesetzt wird und wie viele Seiten er umfasst.

2- Der Block "Seitenumbruch" zeigt ein sehr einfaches Layout. Es sieht wie folgt aus:

Und was wir suchen, ist etwas, das anschaulicher und visuell ansprechender ist.

Das erste Bild wird am unteren Rand der ersten Seite und das zweite auf den folgenden Seiten angezeigt.

Dieses Aussehen wird durch das CSS erreicht, das im Gesamtcode enthalten ist, den Sie in Ihre functions.php einfügen können. Sie können das Layout nach Belieben gestalten und es an die Farbpalette und das Design Ihres Blogs anpassen.

Code

Hier ist der Code, den ich jetzt verwende.

*Es ist an meine Bedürfnisse angepasst, Sie können die CSS trennen und ändern, Sprachen hinzufügen oder entfernen und den Text ändern.

Obwohl der Code dazu gedacht ist, die von Polylang verwendeten Sprachen zu finden, funktioniert er auch, wenn Sie Polylang nicht verwenden. Es werden jedoch nur Sprachen erkannt, wenn die URL folgende Struktur hat: tusitio.com/de/

// 1. Eliminar paginaciones automáticas
function remove_all_auto_pagination() {
    if (function_exists('generate_do_post_pagination')) {
        remove_action('generate_after_entry_content', 'generate_do_post_pagination');
    }
    add_filter('wp_link_pages', '__return_empty_string');
}
add_action('wp', 'remove_all_auto_pagination', 5);

// 2. Función auxiliar para números de página
function generate_pagination_numbers($total_pages, $current_page, $base_url) {
    $numbers_html = '';
    for ($i = 1; $i <= $total_pages; $i++) {
        $page_url = ($i == 1) ? $base_url : $base_url . user_trailingslashit($i);
        
        if ($i == $current_page) {
            $numbers_html .= '<span class="current-page">' . $i . '</span>';
        } else {
            $numbers_html .= '<a href="' . esc_url($page_url) . '" class="pagination-link">' . $i . '</a>';
        }
    }
    return $numbers_html;
}

// 3. Paginación multilingüe completa
add_filter('the_content', function($content) {
    global $numpages, $post;
    
    if (!is_singular() || $numpages <= 1) return $content;
    
    $wp_query = $GLOBALS['wp_query'];
    $current_page = $wp_query->get('page') ?: 1;
    $base_url = trailingslashit(get_permalink());
    
    // Sistema de detección de idioma
    $language = 'en';
    $available_langs = ['en','fr','de','es','pt','ru','it','sv','da','fi','nb','el','ar','tr','zh','id','ja','ko','uk','pl','cs','sk','lt','et','ro','hu','nl','bg'];
    
    if (function_exists('pll_current_language')) {
        $detected_lang = pll_current_language();
        $language = in_array($detected_lang, $available_langs) ? $detected_lang : 'en';
    } else {
        $current_uri = esc_url_raw($_SERVER['REQUEST_URI']);
        foreach ($available_langs as $lang) {
            if (strpos($current_uri, '/'.$lang.'/') !== false) {
                $language = $lang;
                break;
            }
        }
    }
    
    // Textos completos para 28 idiomas (solo cambios en finlandés y ruso)
    $localized_texts = [
        'en' => ['Continue reading this post →', 'Pages of this post →'],
        'fr' => ['Continuer à lire cet article →', 'Pages de ce billet →'],
        'de' => ['Diesen Beitrag weiter lesen →', 'Seiten dieses Beitrags →'],
        'es' => ['Seguir leyendo este post →', 'Páginas de este post →'],
        'pt' => ['Continuar a ler esta publicación →', 'Páginas deste post →'],
        'ru' => ['Продолжить чтение →', 'Страницы этого поста →'],
        'it' => ['Continua a leggere questo post →', 'Pagine di questo post →'],
        'sv' => ['Fortsätt läsa detta inlägg →', 'Sidor i detta inlägg →'],
        'da' => ['Læs videre på dette indlæg →', 'Sider i dette indlæg →'],
        'fi' => ['Jatka lukemista →', 'Artikkelin sivut →'],
        'nb' => ['Fortsett å lese denne artikkelen →', 'Artikkelens sider →'],
        'el' => ['Συνεχίστε την ανάγνωση →', 'Σελίδες άρθρου →'],
        'ar' => ['تابع القراءة ←', 'صفحات المقال ←'],
        'tr' => ['Okumaya devam edin →', 'Yazı sayfaları →'],
        'zh' => ['继续阅读 →', '文章分页 →'],
        'id' => ['Lanjutkan membaca →', 'Halaman artikel →'],
        'ja' => ['続きを読む →', 'ページ移動 →'],
        'ko' => ['더 보기 →', 'ページ →'],
        'uk' => ['Читати далі →', 'Сторінки статті →'],
        'pl' => ['Czytaj dalej →', 'Strony artykułu →'],
        'cs' => ['Pokračovat ve čtení →', 'Stránky článku →'],
        'sk' => ['Pokračovať v čítaní →', 'Stránky článku →'],
        'lt' => ['Skaityti toliau →', 'Straipsnio puslapiai →'],
        'et' => ['Jätka lugemist →', 'Artikli leheküljed →'],
        'ro' => ['Continuă lectura →', 'Paginile articolului →'],
        'hu' => ['Tovább olvasom →', 'Cikk oldalai →'],
        'nl' => ['Lees verder →', 'Artikelpagina\'s →'],
        'bg' => ['Прочети още →', 'Страници на статията →']
    ];
    
    $text_index = ($current_page == 1) ? 0 : 1;
    $pagination_text = $localized_texts[$language][$text_index] ?? $localized_texts['en'][$text_index];
    
    // Construcción de la paginación
    $pagination_html = '<div class="custom-pagination-container">';
    $pagination_html .= '<div class="pagination-content">';
    $pagination_html .= '<span class="pagination-text">' . esc_html($pagination_text) . '</span>';
    $pagination_html .= '<div class="pagination-numbers">';
    $pagination_html .= generate_pagination_numbers($numpages, $current_page, $base_url);
    $pagination_html .= '</div></div></div>';
    
    return ($current_page > 1) ? $pagination_html . $content . $pagination_html : $content . $pagination_html;
}, 15);

// 4. CSS optimizado (sin referencias a fuentes)
add_action('wp_head', function() {
    echo '<style>
    /* Estilos base */
    .custom-pagination-container {
        margin: 25px 0;
        padding: 15px 10px;
        background: #f9f9f9;
        border-top: 1px solid #eee;
        border-bottom: 1px solid #eee;
        box-sizing: border-box;
        width: 100%;
    }

    .pagination-content {
        display: flex;
        align-items: center;
        justify-content: center;
        max-width: 800px;
        margin: 0 auto;
    }

    .pagination-text {
        font-weight: 700;
        color: #333;
        margin-right: 10px;
        white-space: nowrap;
    }

    .pagination-numbers {
        display: inline-block;
    }

    .pagination-link,
    .current-page {
        display: inline-block;
        padding: 8px 12px;
        margin: 0 3px;
        border-radius: 4px;
        font-weight: 400;
        font-size: 15px;
        line-height: 1;
        box-sizing: border-box;
        transition: all 0.2s ease;
    }

    .current-page {
        background: #b40006;
        color: white;
        font-weight: 700;
    }

    .pagination-link {
        background: #f5f5f5;
        color: #333;
        text-decoration: none;
    }

    .pagination-link:hover {
        background-color: #e0e0e0;
        transform: translateY(-2px);
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }

    /* Estilos móvil */
    @media (max-width: 600px) {
        .pagination-content {
            flex-direction: row;
            flex-wrap: nowrap;
            overflow-x: auto;
            justify-content: flex-start;
            padding-bottom: 5px;
            -webkit-overflow-scrolling: touch;
        }
        
        .pagination-text {
            font-size: 14px;
            white-space: nowrap;
            flex-shrink: 0;
        }
        
        .pagination-numbers {
            display: flex;
            flex-wrap: nowrap;
            gap: 4px;
        }
        
        .pagination-link,
        .current-page {
            padding: 6px 10px;
            min-width: 32px;
            font-size: 14px;
            margin: 0;
            flex-shrink: 0;
        }
    }
    </style>';
});