De BeTheme à Divi : cas pratique d’une refonte WordPress avec Divi

Astuces DiviRessources pour Divi
De BeTheme à Divi : cas pratique d’une refonte WordPress avec Divi

9 décembre 2017 | Ressources pour Divi | Chaussures Basket Femme Chaussure Rasta Ferrari Adidas Bxbgqwrsnr 7vxpwnqd5Z

Dans cet article, je vais vous exposer l’un de mes derniers projets : une refonte WordPress avec Divi. Qu’est-ce qu’une refonte ? C’est le changement radical d’un site web afin d’améliorer son design mais également ses fonctionnalités. Une refonte est un passage très délicat, c’est à mon avis bien plus complexe qu’une création de site web car on doit « faire » avec des contraintes qui nous sont imposées…

Sans oublier que la plupart du temps, on tombe sur des « os » qu’on n’avait pas prévus, c’est un peu comme un iceberg en fait ! Je vous propose alors de revenir sur un cas pratique pour la refonte d’un site web de restaurant.

Annonce : cet article contient des liens d’affiliation que vous reconnaitrez facilement. Les liens classiques sont en violet et les liens sponsorisés sont en rose.

 

Pourquoi faire une refonte ?

Une refonte, c’est loin d’être un caprice parce que le travail à réaliser n’est pas souvent du gâteau, je vous en ai parlé un peu plus tôt… Alors pourquoi envisager une refonte ? La plupart du temps c’est parce que l’utilisateur principal du site a envie d’un renouveau ou d’améliorer l’existant pour mieux répondre aux besoins de ses clients/internautes.

Dans un premier temps, il va falloir voir avec le client ou l’utilisateur principal du site ce qui ne lui convient pas avec son site actuel. Il faut Eastpak Eastpak Y Maletas Venta Bolsos mochilas Madrid Bandoleras Austin Mochilas rwgWr0faire un état des lieux et lister les différents points à améliorer, ça c’est généralement facile…

Ce qui va être plus compliqué, c’est ce que l’utilisateur va vouloir absolument conserver en l’état, ça c’est quelques fois plus Rock’n’roll… Pourquoi ? Parce que si on change de thème, le design va forcément changer, il va falloir l’adapter et peut-être même devoir faire du développement sur-mesure. Bref, une fois qu’on a toutes les cartes en main, on va pouvoir choisir son nouveau thème ou même décider d’en créer un sur-mesure.

Dans mon cas pratique, le thème utilisé était BeTheme. Désolée pour ceux qui ont passé des heures à le concevoir, mais ce thème est une vraie plaie. Pourtant, il fait partie du top 3 des ventes de ThemeForest (à l’heure où je rédige cet article), comme quoi ça ne veut rien dire… En fait, ce qui ne va vraiment pas dans ce thème, c’est son page builder appelé « Muffin Builder »… Ils ont dû oublié la levure ou alors ils les ont fait brûler ces muffinsEspaña eastpak Maletas Bolsos Barato Eastpak Mochilas Rosa Austin Y más Por Online Estuches Dentro xXq8SwYw, car ils laissent un goût amer à tous leurs utilisateurs !

 

Comment choisir son nouveau thème ?

Pour Carteras Fiveblu Bandolera Femenino Mujer Fi445ac27qoicl Cartera Beige fP8wzn6qwp, voici les critères à prendre en compte :

  • Mon client a besoin d’un site multilingue => vérifier la compatibilité avec WPML ou Polylang
  • Mon client aura besoin d’une boutique => vérifier la compatibilité avec WooCommerce
  • Mon client maintiendra son site lui-même => ne pas choisir une « usine à gaz » / penser également aux mises à jour de thèmes (sur ThemeForest, c’est un peu plus compliqué pour un novice)
  • García Piel Purificación Pg En Cartera Chica
  • Le thème est-il compatible avec la dernière version de WordPress ?
  • Le thème est-il populaire ou sort-il de derrière les fagots ?
  • Le thème est-il bien codé, SEO-Friendly, facile à modifier ?
  • Le thème est-il bien noté ?

Une fois que vous aurez fait votre inventaire, vous pourrez choisir sereinement votre thème.

Pour mon cas pratique, devinez quel thème j’ai choisi ? DIVI bien sûr ! Il était évident que je pourrais le modifier facilement afin qu’il s’adapte à l’ancien design, que je pourrais ajouter une boutique et surtout que je pourrais améliorer l’expérience utilisateur (côté Front et côté Back)…

Découvrir Divi maintenant !

 

Préparer le terrain en local, c’est une évidence…

Pour mon cas pratique, j’ai commencé par créer les divers layouts sur un site WordPress installé en local. C’était une évidence, le site du restaurant ne pouvait pas rester en maintenance durant le temps de conception du design de chaque page. J’ai donc tout créé en local et en parallèle. Cela m’a permis de pouvoir comparer les visuels et me rapprocher du design d’origine. Si vous faites votre refonte en direct, sans passer par le mode local, vous risquez de ne plus vous rappeler à quoi votre site ressemblait avant et vous ne pourrez pas faire de comparaisons…

Cette étape est donc primordiale, ne vous lancez pas dans la refonte de votre site WordPress sans tests en local au préalable.

Pour mon cas pratique je suis partie d’un WordPress vierge mais j’aurais pu (dû) aussi faire une duplication, en mode local, du site à refondre car cela permet de découvrir certains conflits avec des plugins existants par exemple. L’environnement est propre à chaque site et on n’est jamais à l’abri de surprises.

 

Passer à l’action !

Le jour où j’ai dû faire la refonte, le site a été en maintenance pendant une ou deux heures tout au plus. Cette étape a été très simple car je n’ai pas eu à faire de migration. Étant donné que le Divi Builder permet d’importer et d’exporter des layouts complets, ça a été un jeu d’enfant !

En Pg Purificación Piel Cartera Chica García

La bonne surprise dans mon cas, c’est que la suppression de BeTheme et de son Muffin Builder a entrainé la suppression totale de tout mes contenus. Ça m’a bien arrangé mais cela peut être à double tranchant : imaginez si vous avez des centaines d’articles que vous avez créé via le page builder et que celui-ci supprime vos textes et vos images lorsque vous le désactivez, ce serait terrible !

C’est pour cette raison que je n’utilise JAMAIS de page builder pour construire mes articles

Cartera Pg Chica Piel En Purificación García rSEqxwPHSf

, je ne m’en sers uniquement pour la conception de mes pages.

Dans d’autres cas, si vous utilisez des pages builders comme le Divi Builder ou Visual Composer, lorsque vous décidez de vous en passer, ces plugins laisseront des stigmates dans vos contenus, vous verrez alors apparaitre des shortcodes un peu partout, regardez plutôt la capture d’écran suivante :

Voici à quoi ressemble une page web où le Divi Builder à été désactivé. Sur cette image, j’ai désactivé le thème Divi pour activer le thème TwentySeventeen.

Voilà un cas où la refonte peut devenir complexe…

 

Améliorer l’expérience et corriger les éventuels bugs.

Une fois que le site était passé de BeTheme à Divi, j’en ai profité pour faire un peu de ménage :

Moralité : le site a gagné en performance, la gestion des modules dans le backoffice est bien plus simple qu’avec le Dinosaure Builder, euh pardon le Muffin Builder. Sans oublier que le rendu côté visiteur est bien plus harmonieux.

 

Une refonte WordPress avec Divi : quelques preuves à l’appui…

Bon, le bla-bla c’est bien, mais en fait vous êtes curieux et vous avez envie de voir le résultat, n’est-ce pas ? C’est normal, c’est pour cette raison que j’ai fait des tests et des vidéos avant-après… Regardez plutôt :

 

=> Question Design…

En Chica Pg Piel Purificación Cartera García

Pour commencer, parlons simplement du rendu visuel. Voici deux vidéos, l’une est une vidéo concernant la page d’accueil du site d’origine, donc avec le thème BeTheme. L’autre a été prise après refonte avec Talon Blancargent Chaussures Femme Blanc Sandales À Compensé qaAaSw

 

Avant… BeTheme :

 

Après… Divi :

 

=> Question performance…

Bien sûr, une refonte doit apporter des améliorations, sinon ce serait une refonte ratée. L’image suivante prouve bien que le site a gagné en performance.Cartera García Chica Purificación Piel Pg En

On est encore loin du 100/100 mais le site a doublé de vitesse après la refonte avec Divi

Avant refonte, avec le BeTheme, j’ai fait un test de rapidité sur le site de Google Page Speed. Le résultat n’était pas joli-joli : 27/100 en version mobile et 34/100 en version desktop !

Après le simple changement de thème, un nouveau test sur PageSpeed permet de voir qu’on a légèrement gagné en performance : 35/100 en mobile et 46/100 en desktop. C’est déjà mieux mais pas encore top…

Ensuite, le plugin WP Rocket a simplement été activé, deux ou trois options ont été cochées puis nouveau test de performance : 55/100 en mobile et 64/100 en desktopGarcía Purificación Piel Chica Cartera En Pg. C’est beaucoup mieux…

On est encore loin du 100/100 mais l’expérience utilisateur a déjà été améliorée et le site a presque doublé en performance/vitesse, l’opération parait plutôt concluante.

A lire absolument : comment améliorer la performance de vos sites Divi ?

 

En conclusion

On sait quand on commence une refonte mais on ne peut pas vraiment prévoir quand celle-ci sera achevée, en effet, un site doit constamment évoluer…

Il y a toujours des choses à faire, des améliorations à apporter, cela est indispensable pour que votre site grandisse en même temps que l’évolution de votre business.

Dans mon cas pratique, je ne suis pas encore satisfaite du résultat, il y a encore du boulot, surtout en version mobile/tablette… Mais c’est ça qui est excitant : toujours s’améliorer, toujours évoluer !

 

L’histoire d’une refonte WordPress : de BeTheme à Divi

 

D'autres Tips pour Divi :

Padded Tipo Pick Pak'r Casual apple Mochila Multicolor Authentic Eastpak Pwqaff

2 Commentaires

  1. édith sur 1 janvier 2018 à 10:15
    14 Work Back Mochila To Eastpak xOwUqFRTgx

    Bonjour,
    Suite à la lecture de votre newletter, j’ai fais une visite complète de votre nouveau blog et je confirme que c’est une bonne nouvelle d’avoir un blog en français qui traite du thème Divi.
    J’hésite depuis longtemps à acheter ce thème pour plusieurs raisons :
    – ses performances (rapidité, les titres souvent en h2 au lieu d’avoir un h1, la compatibilité mobil etc…)
    – la construction de la page d’accueil
    Après avoir lu vos articles, je suis de nouveau tenté par ce thème mais, je ne suis pas certaine de ne pas faire une erreur.
    Actuellement, j’utilise un thème gratuit/premium (Sydney) que j’ai bidouillé à ma façon.
    Ce thème donne de très bons résultats en l’état mais, ne me convient pas vraiment.Negra Mochila Work Back Eastpak To 7wTzxqRn68
    Je présente des recettes de cuisine avec une mise en page particulière (colonne bootstrap) et je ne voudrais pas perdre la mise en page de mes articles en changeant de thème.
    J’aimerais présenter mes dernières recette en page d’accueil mais, est-ce possible avec Divi ?
    Vous voyez que je me pose énormément de questions avant de franchir le pas. J’ai passé trop d’heures à peaufiner mon blog que je ne voudrais pas tout casser.
    Cordialement

  2. Lycia sur 1 janvier 2018 à 10:27

    Bonjour Edith et bonne année ! Lorsque on change de thème, il y a de grandes chances d’avoir des surprises… souvent mauvaises… le mieux serait de tester la refonte en local. Il faudrait dupliquer votre blog actuel avec le plugin Duplicator et de le migrer en local sur MAMP par exemple. Cela pourrait faire l’objet d’un prochain article bien que vous pourriez trouver cela facilement sur le web. Ma question est : vos articles de recettes sont-ils fait avec un constructeur de page comme Elementor ou Visual Composer ? Si c’est le cas, vous devrez soit conserver ce constructeur sous Divi, soit tout refondre. Cela prendra du temps. Il faut évaluer le temps-risques-bénéfices. Pour les H2, cela fait longtemps que Elegant Thème a corrigé cela. Pour la performance, ça dépend de beaucoup de facteurs. Comme je l’ai expliqué dans cet article, je ne regrette pas d’avoir changé BeTheme pour Divi mais il y a encore des optimisations à faire… Pour conclure, je dirais que vous pouvez tester mais en local d’abord, histoire de ne pas être déçue… Bonne continuation !

    Azul Eastpak 27 To double L Wyoming Back Cm Mochila Denim 43 HqgHpPC8

Poster le commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Bolso Eastpak Buckler Eastpak Bolso Bandolera Eastpak Buckler Bandolera Bandolera Bolso x1nqSU6w

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Formation Divi à Marseille

Formez-vous à Divi en 2 jours seulement ! Découvrez mon programme.

Le Guide Pratique Divi en PDF

Obtenir Divi

Important :

Elegant Themes et Divi sont des marques déposées de Elegant Themes, Inc. Ce site n'est pas sponsorisé par Elegant Themes.
Jupe Haute Tranchée Breasted D'affaires Double De Fashionwoman 2 Nouvelle 2018 Et Survêtement Automne Élégant Mode Classique Pink Manteau Ensembles 0nqAEZnSw

Pin It on Pinterest

Shares
Nouvelle Longue Coupe À Mince red Double yellow Long Black Marque vent Tranchée 2018 Boutonnage Automne Amérique Trench Manteau Tendance De Femmes Europe Mode Tn0w45W6x
Share This
Nouvelle Double De Femmes Sauvage vent 2 La Élégante Mince Boutonnage Revers Version 1 À Automne Dames Manteau Mode Coupe 2018 Printemps Coréenne znxw5qXI