De l’impasse à la découverte : transformer votre page WordPress 404 en une page intelligente

En examinant mon site dans le cadre des analyses, j’ai remarqué que de nombreux visiteurs atterrissaient sur mon site. 404 pages. La première action que je prends est de m’assurer que je n’ai pas supprimé une page sans la rediriger. Mais le plus souvent, c’est un autre cas.

C’est une frustration courante : un utilisateur clique sur un lien en attendant une réponse, pour être accueilli par un message froid et générique. 404 introuvable message. Dans le monde de Référencement et UXune page 404 ne doit pas nécessairement être une impasse, elle doit être un chemin vers un engagement pertinent.

En transformant votre page d’erreur en moteur de découverte, vous pouvez conserver le trafic qui autrement reviendrait vers Google.

Pourquoi les utilisateurs atterrissent sur votre page 404

Avant de résoudre le problème, nous devons comprendre comment les utilisateurs se perdent. Cela se produit rarement deux fois de la même manière :

• Liens externes brisés : Un autre site Web renvoie à votre contenu mais fait une erreur de saisie URL.
• Contenu retiré : Vous avez supprimé une ancienne publication ou un ancien produit sans configurer de compte Redirection 301.
• Fautes de frappe : Un utilisateur saisit manuellement votre URL dans le navigateur et crée un gros doigt erreur.
• Modifications de la structure de l’URL : Vous avez modifié vos paramètres de permalien (par exemple, de /blog/post-name à /post-name) et les anciens partages sur les réseaux sociaux sont désormais interrompus.
• Erreurs de copier-coller : Un utilisateur supprime le dernier caractère d’un lien lorsqu’il le partage dans un e-mail ou Mou message.

La stratégie : l’analyse d’URL à la rescousse

Au lieu d’afficher une barre de recherche et de demander à l’utilisateur de faire plus de travail, nous pouvons utiliser le limace (la partie de l’URL après votre domaine) pour deviner ce qu’ils recherchaient.

Si un utilisateur essaie de visiter mysite.com/what-are-404-codes et cette page a disparu, notre code :

1. Analysez l’URL : Divisez la limace en mots individuels.
2. Nettoyer les données : Supprimez les mots vides (quoi, sont, est, le, à, avec) qui n’ajoutent pas de sens.
3. Rechercher automatiquement : Exécutez une recherche WordPress interne en utilisant les mots-clés les plus pertinents (404, codes).
4. Afficher les résultats : Montrez immédiatement à l’utilisateur les articles les plus pertinents.
5. Fournissez une solution de secours : Si aucune correspondance n’est trouvée, affichez vos derniers « Greatest Hits » afin qu’ils restent sur le site.

Voici un exemple sur Martech Zone :

Implémentation du 404.php personnalisé

Pour mettre en œuvre cela, vous devrez modifier (ou créer) un 404.php fichier dans votre Thème WordPress enfant. L’utilisation d’un thème enfant garantit que vos modifications ne seront pas effacées lors de la mise à jour de votre thème principal.

Le code

Copiez et collez ceci dans votre 404.php déposer. Il s’agit d’une version générique et épurée conçue pour fonctionner avec presque tous les thèmes, mais vous souhaiterez probablement revoir votre page.php modèle pour la structure et les classes appropriées.

<?php get_header(); ?>

<main id="primary" class="site-main">
    <section class="error-404 not-found">
        <header class="page-header">
            <h1 class="page-title">Oops! That page can't be found.</h1>
            <p>It looks like nothing was found at this location. Perhaps one of the links below can help?</p>
        </header>

        <div class="page-content">
            <?php
            // 1. Get the requested URL path
            global $wp;
            $request_path = trim($wp->request ?? '', "https://martech.zone/");
            
            // 2. Clean the path and extract keywords
            $stop_words = ['the', 'and', 'for', 'with', 'was', 'this', 'that', 'from', 'how', 'why', 'is', 'at'];
            $keywords = array();
            
            if (!empty($request_path)) {
                // Split by slashes and dashes
                $parts = preg_split('/[-\/]+/', $request_path);
                
                foreach ($parts as $term) {
                    $term = sanitize_text_field($term);
                    // Only keep terms longer than 2 chars and not in our stop list
                    if (strlen($term) > 2 && !in_array(strtolower($term), $stop_words)) {
                        $keywords[] = $term;
                    }
                }
            }

            // 3. Limit to top 4 unique keywords for search accuracy
            $keywords = array_slice(array_unique($keywords), 0, 4);
            $search_string = implode(' ', $keywords);

            // 4. Run the Query
            $args = array(
                'post_type'      => 'post',
                'posts_per_page' => 5,
                'post_status'    => 'publish',
                'ignore_sticky_posts' => true
            );

            // If we have keywords, do a search. Otherwise, just get latest.
            if (!empty($search_string)) {
                $args['s'] = $search_string;
                echo '<h2>Suggested Articles Based on Your Search</h2>';
            } else {
                echo '<h2>Latest From Our Blog</h2>';
            }

            $related_query = new WP_Query($args);

            if ($related_query->have_posts()) :
                echo '<ul class="suggested-results">';
                while ($related_query->have_posts()) : $related_query->the_post(); ?>
                    <li>
                        <a href="https://martech.zone/from-dead-end-to-discovery-turning-your-wordpress-404-page-into-a-smart-page/<?php the_permalink(); ?>"><?php the_title(); ?></a>
                    </li>
                <?php endwhile;
                echo '</ul>';
                wp_reset_postdata();
            else :
                // Secondary Fallback: If search fails, show latest posts anyway
                echo '<p>We couldn\'t find a direct match, but you might like these:</p>';
                $latest_args = array('post_type' => 'post', 'posts_per_page' => 5);
                $latest_query = new WP_Query($latest_args);
                if ($latest_query->have_posts()) :
                    echo '<ul>';
                    while ($latest_query->have_posts()) : $latest_query->the_post(); ?>
                        <li><a href="https://martech.zone/from-dead-end-to-discovery-turning-your-wordpress-404-page-into-a-smart-page/<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
                    <?php endwhile;
                    echo '</ul>';
                    wp_reset_postdata();
                endif;
            endif;
            ?>
        </div>
    </section>
</main>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

Comment intégrer cela dans votre thème

1. Accédez à vos fichiers : Utiliser SFTP ou le gestionnaire de fichiers de votre panneau de configuration d’hébergement.
2. Accédez à votre thème enfant : Aller à /wp-content/themes/your-child-theme/.
3. Créer/Modifier 404.php : Si le fichier n’existe pas, créez-le. Si tel est le cas, sauvegardez d’abord le contenu original.
4. Standardisez les crochets : Notez l’utilisation de get_header(), get_sidebar()et get_footer(). Ceux-ci garantissent que votre page 404 ressemble au reste de votre site.
5. Stylisez-le : Le code utilise des classes WordPress standards comme site-main et page-content. Vous pouvez ajouter du CSS personnalisé à votre style.css fichier pour faire le Articles suggérés la liste ressemble à une grille ou ajoutez des images miniatures.

En mettant cela en œuvre, vous transformez un moment d’échec de l’utilisateur en un moment de découverte utile, en gardant vos visiteurs engagés et vos taux de rebond SEO faibles.