Cum să împărțiți postările WordPress lungi în pagini fără a afecta SEO

Când am început să scriu pe blog, nu am urmat nicio regulă SEO sau de optimizare sau orice altceva. Doar am postat și asta a fost tot. Acest lucru m-a făcut să acumulez mii de imagini neoptimizate și sute de articole lungi, foarte lungi.

Apoi am continuat să public alte articole lungi pe care le-am optimizat cât de cât. Astfel, până în prezent, există aproximativ 100 de articole cu mai mult de 1500 de cuvinte, câteva zeci cu mai mult de 3500 de cuvinte. Și multe altele de peste 1000 de cuvinte.

Destul de multe dintre aceste texte sunt ceea ce se numește articole"evergreen" sau atemporale. Deoarece sunt texte mai complete decât o postare rapidă tipică, acestea sunt de obicei linkurile care se clasează mai bine și primesc un trafic organic mai constant. Aceasta este vestea bună, vestea proastă este că acestea au fost, de asemenea, postările care s-au încărcat cel mai prost și care au dat metrici proaste, deoarece Google procesează URL-urile pe grupuri.

Și acest lucru trebuia rezolvat, din mai multe motive.

De ce să divizați postările lungi?

Principalul motiv pentru care este recomandabil să împărțiți postările lungi în pagini este pentru a ușura încărcarea, în special cele care au multe imagini și/sau videoclipuri și alte elemente.

Dincolo de îmbunătățirea necesară a vitezei de încărcare, aceasta va crește șansele de a obține o poziționare mai bună, sau cel puțin de a o menține, și va crește timpul petrecut de vizitatori și numărul de pagini vizitate pe sesiune prin reducerea ratei de respingere.

Cu toate acestea, există câteva lucruri de care trebuie să țineți cont. Păstrați URL-ul original pentru a nu crea noi URL-uri care pot dilua SEO-ul și pentru ca Google, precum și alte browsere, să continue să indexeze conținutul ca un singur articol.

Cel mai important lucru este să utilizați rel="next" și rel="prev" în pentru a indica Google că este vorba despre o serie.

De exemplu, într-o postare împărțită în trei pagini, atunci când vizitați a doua pagină, va trebui să găsiți acest lucru în codul sursă în interiorul etichetei

<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/" />

Câteva considerații

Nu este suficient să împărțiți pur și simplu articolele sau doar să obțineți mai multe pagini vizualizate. Paginarea trebuie să aibă o anumită logică bazată pe navigarea naturală. Pentru aceasta trebuie să vă puneți în locul vizitatorului sau să navigați pe site-ul dvs. ca și cum ar fi site-ul altcuiva.

Fiecare subpagină trebuie să poată funcționa ca o pagină de sine stătătoare sau cel puțin să fie precedată de informații despre ceea ce veți găsi pe ea și de o introducere logică la noua subpagină. Aceasta trebuie să aibă suficient conținut pentru a nu fi considerată săracă sau de mică valoare. Google penalizează"conținutul subțire".

Paginarea trebuie să indice clar că articolul este împărțit în pagini. De asemenea, nu este un lucru rău să adăugați, cel puțin pe prima pagină, un cuprins.

Deși nu există o regulă "oficială", evitați paginarea excesivă. În general, este recomandabil să împărțiți postările de 1500/1800 de cuvinte sau mai mult în maximum două sau trei pagini.

Postare divizată cu blocul nativ de întrerupere a paginii din Gutenberg

Există diferite modalități de a face acest lucru cu ajutorul plugin-urilor, dar, după cum știți, eu prefer să folosesc cât mai puține plugin-uri posibil.

Blocul"Page Break" din Gutenberg este cea mai bună opțiune.

Blocul adaugă etichetele rel="next" și rel="prev" și "canonical" la paginile divizate, dar dacă doriți să vă asigurați că acestea sunt afișate, puteți include această funcție în fișierul functions.php al șablonului dvs.

// 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');

Designul contează

Aspectul și elementele paginării sunt foarte importante, deoarece vor permite vizitatorului să înțeleagă imediat că articolul continuă pe următoarele pagini și să știe din câte pagini este format.

2- Blocul "Page Break" prezintă un aspect foarte simplu. Acesta arată astfel:

Iar ceea ce căutăm este ceva mai descriptiv și mai atractiv din punct de vedere vizual.

Prima imagine este cea care va fi afișată în partea de jos a primei pagini, iar a doua în paginile următoare.

Acest aspect este obținut cu ajutorul CSS-ului inclus în codul total pe care îl puteți adăuga la fișierul functions.php. Îl puteți aranja cum doriți și se potrivește paletei de culori și designului blogului dvs.

Cod

Iată codul pe care îl folosesc acum.

* Este adaptat la nevoile mele, puteți separa CSS-ul și îl puteți modifica, puteți adăuga sau elimina limbi și puteți schimba textul.

Deși codul este destinat să găsească limbile utilizate de Polylang, acesta va funcționa și dacă nu utilizați Polylang. Cu toate acestea, va detecta limbile numai dacă URL-ul are această structură: tusitio.com/en/

// 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>';
});