Personnaliser sa page d'erreur 404

Publié le par nessa

La semaine dernière je me suis fait une frayeur en découvrant mes messages d'erreurs via le site d'aide pour webmasters de google https://www.google.com/webmasters/tools/

Le support me prévient en effet que depuis le mois d'août dernier mes erreurs 404 sont en augmentation. Qu'est-ce qu'une erreur 404? c'est un lien brisé qui mène bien vers votre blog mais vers un article sans contenu, juste ces mots: " Aucun article".

Etant en mode premium (je paie mon hébergement de blog et mon nom de domaine sur overblog) J'ai droit en cas de problème à l'assistance du staff overblog. Je reprécise les supports où les blogueurs d'ob peuvent trouver de l'aide:

pour blogs premiums et gratuits

- le forum d'aide http://fr.forum.over-blog-kiwi.com/ (merci aux gentils bénévoles et aidants)

- le groupe privé facebook https://www.facebook.com/groups/

pour blogs premiums

- le support d'aide sur twitter @OverblogSupport

- la page de contact https://my.over-blog.com/api/support/form

Après des recherches sur le web, Je pensais que mes erreurs 404 étaient lièes à des problèmes de permaliens suite à la migration de mon blog vers la nouvelle plateforme kiwi d'overblog.Le staff overblog s'est penché sur le problème (merci Cyrielle et l'équipe Ob) et a vérifié les permaliens de mon blog qui sont nickels.

D'où venaient alors mes 500 et quelques liens brisés (ce qui n'est pas rien).En faisant des recoupements et des recherches, je suis arrivée à la conclusion que pas mal de liens  brisés dans les messages du support google venaient en fait du site Hellocoton.

Exemples d'url brisées HC :
http://www.hellocoton.fr/l-effet-duck-en-insufflant-l-helium-des-ballons-et-ses-dangers-1134231
http://www.hellocoton.fr/histoire-de-la-chaussette-dans-le-lave-linge-saupoudree-de-calgon-ou-pas-2147547
http://www.hellocoton.fr/course-london-to-paris-pour-medecins-du-monde-1310216

En attendant que le problème soit réglé, je me suis dit que cela serait pas mal que tous les visiteurs qui viennent se perdre sur mon blog soient accueillis avec un joli message d'erreur autre que " aucun article".

Le but étant que le visiteur ne reparte pas aussi vite qu'il est venu, ne trouvant pas ce qu'il était venu lire (entraînant une méchante hausse du taux de rebond).

On en vient au code à changer dans le css; Il faut mettre les mains dans le cambouis pour cela...

Pour le thème kiwi il faut chercher la ligne 2092 (ou bien cherchez "error" avec le fonction Ctrl +F) vous allez voir ce code:

<p class="error"> {% if isSearch %} {{ Lang.Get('No result for this expression') }}. {% else %} {{ Lang.Get('No post') }}. {% endif %} </p

Vous voyez 'No post' en rouge ? vous allez virer ce code et le remplacer par le votre, je vous conseille de faire des essais sur un brouillon d'article puis de copier-coller votre code entre les guillemets (faites aussi une sauvegarde du css entier avant toute modification en cas de fausse manip).

Moi j'ai mis ce code ( réédit: attention après plusieurs test j'ai constaté que les points, les virgules étaient acceptés dans le code mais pas le ' que l'on trouve dans "s'est" ).

<p><a href="http://www.greenmaman.com/"><img src="http://img.over-blog-kiwi.com/1/07/15/28/20141115/ob_61ec7e_error-404.png" /></a></p>Bonjour vous êtes peut-être arrivé sur mon blog via un lien brisé Vous pouvez utiliser la fonction recherche pour trouver ce que vous cherchiez ici

Ce qui donne (il se peut que je change mon message entre temps):

Bonjour vous êtes peut-être arrivé sur mon blog via un lien brisé Vous pouvez utiliser la fonction recherche pour trouver ce que vous cherchiez ici

 

Voici un exemple de page d'erreur chez moi

http://www.greenmaman.com/article-je-ne-sais-pas-pour-la-questionJ'ai trouvé l'image d'erreur 404 Mario sur le web qui a du être fabriquée grâce au générateur Mario http://wigflip.com/thankyoumario/Vous pouvez créer votre propre message d'erreur 404 fixe ou animé comme ci-dessous

Vous pouvez aussi crée vos propres images :)

J'espère que ce petit tuto en aidera quelques uns et vous souhaite un bon week-end ^^

Réédit (voir les commentaires): Sur le thème Elegant press, il n'est pas possible pour l'instant (à ma connaissance) de modifier la page d'erreur 404.

Rendez-vous sur Hellocoton !

Partager cet article

Commenter cet article

wolfe 16/11/2014 17:17

Bonjour
C'est toujours une grande frayeur quand on les remarque!
Ton article est très instructif!
Bisous

Bernieshoot 16/11/2014 06:47

Ton article est hyper intéressant. Le support d’OB est de plus en plus efficace. J’ai pas saisi comment tu en arrives à la conclusion hellocoton mais c’est tres ennuyeux.
La personalisation est super mais je ne sais pas si je vais me plonger dans le css.

nessa 16/11/2014 08:59

Coucou je viens de rajouter quelques exemples de liens brisés HC
Pour ton css j'ai vérifié: le code que j'ai retouché dans mon css (thème kiwi) n'existe pas dans ton css (Elegant press) même en le rajoutant dans ton css, ça ne donne rien donc pour l'instant, impossible de modifier ta page d'erreur 404

samar 15/11/2014 22:32

coucou Nessa
tres bel article effectivement je me souviens qd j'etais chez ob rolala le nombre d'erreur 404 plus de 500 et s'etait des posts qui se créaient en plus et des categories sans meme que je ne les cree berf maintenant j'ai tout redirige et pas de lien brises sauf parfois des sites de recherche qui essaient de prendre mes ulr et donc ils ont des liens casses mais bon pas tres important pour moi !
parcontre je ne me suis jamais penche sur le fait de personnaliser ma page erro 404 ca serait sympas effectivement !
grosse bise

nessa 17/11/2014 22:02

Re samar quand tu dis tout rediriger les visiteurs sont redirigés vers la bonne page celle qu'ils cherchaient au début ? tu as utilisé un plugin pour ça où tu as fait comme sur cette page ? http://sdz.tdct.org/sdz/simuler-l-url-rewriting-avec-l-erreur-404.html

nessa 15/11/2014 22:43

hello samar :) non là le probleme ne vient pas de overblog mais de hellocoton enfin je crois (mais toi tu n'as pas l'air d'avoir des problèmes de ce côté si tu surveilles tes messages d'erreur ce que moi je ne faisais pas ) oui une page d'erreur personnalisée c'est sympa bizzz