X The Ultimate WordPress Theme : Review complète

X : voilà donc un thème WordPress qui fait parler de lui en ce moment sur ThemeForest ! Plus de 10000 ventes en l’espace de 4 mois.

Je vois depuis des semaines la même bannière de pub qui revient par-ci par-là sur les blogs. Une bannière assez sobre. Un grand X, avec écrit en-dessous « THE Theme ». Qu’est-ce que c’est ce truc ?

Un petit tour sur ThemeForest pour savoir ce que c’est. Ils se disent le thème ultime méga polyvalent multi-purpose multi-design, « le dernier thème WordPress que vous aurez à acheter », disent-ils.

Je publie souvent des sélections de thèmes WordPress sur ce blog. Je me retrouve donc souvent à dénicher les bons thèmes – du moins c’est ce que j’essaie de faire! – à regarder les démo des thèmes, les fonctionnalités présentes, le design, les critiques des utilisateurs, etc. Je décide de faire pareil avec ce fameux X.

Cette fois, je me fais le plaisir d’acquérir un nouveau compte avec l’accès au thème avec tout ce qui va avec. Je me mets donc à m’amuser avec le thème et à tester tout ce que l’on peut faire avec. Et je suis loin d’avoir terminé. Et je ne suis pas déçu. Ça donne plein d’idées pour des nouveaux sites WordPress.

Je vous fais aujourd’hui avec plaisir une review détaillée du thème. On ne me paie pas pour ça. Mais si jamais vous décidez de vous faire payer ce thème à travers mon lien – et je vous en remercie – j’aurai une petite commission : ) . Aller, jetez un coup d’oeil au thème et revenez vite pour lire la suite.

Visiter le thème X

Pour vous présenter ce thème, j’ai décidé de ne pas lister les fonctionnalités et les trucs super biens qu’on trouve dedans, mais plutôt de faire une sorte de tutoriel à travers lequel nous verrons comment mettre en place son site WordPress avec ce thème, en présentant les différentes fonctionnalités au fur et à mesure.

Utiliser X pour créer votre Site WordPress

Aller, voyons concrètement comment utiliser ce thème sur votre site WordPress. Je pense que vous ne serez pas déçu.

Important :Avant d’installer quoi que ce soit, je vous conseille de faire un peu le ménage sur votre installation WordPress. Si vous venez tout juste d’installer WordPress, vous verrez qu’il y a une page, un article et un commentaire qui sont créés par défaut. Effacez-les. Si par contre vous voulez installer X sur un site WordPress déjà existant, passez d’abord en mode maintenance, désactivez tous les plugins, puis installez le thème et réactivez vos plugins un à un. Il se peut qu’il y ait un conflit entre vos plugins et ceux proposés par X.

Ce que je conseille aux personnes détenant un site déjà existant avec du contenu, c’est de créer une nouvelle installation WordPress, de suivre les étapes d’installation du thème X, puis d’importer le contenu de leur ancien site.

Si vous voulez externaliser cette tâche, WordPress Scouts propose une prestation complète pour l’installation de X ou tout autre thème WordPress. N’hésitez pas à prendre contact avec nous via le formulaire de contact dans tous les cas.

Installation du thème et des plugins requis/recommandés

Première chose, il faut installer et activer le thème. Une fois activé, un message comme ceci s’affiche :

Plugins requis et recommandés par le thème X

X requiert l’installation de deux plugins : Force Regenerate Thumbnails et X Shortcodes. Le premier permet la régénération des images en miniatures. Il est très utile puisque X donne une grande flexibilité en terme de redimensionnement un peu de tout ce qui se trouve sur le site. Ce qui engendrera à tous les coups des problèmes de taille avec vos images que vous avez uploadées avant de personnaliser votre site. D’où l’utilité du plugin. Le second plugin permet de profiter d’une quarantaine de raccourcis proposés par X.

Par ailleurs, X recommande l’utilisation des plugins Contact Form 7 pour le formulaire de contact, de Slider Revolution qui est un plugin premium qui sera offert par le thème. Celui-ci, comme vous pouvez le voir sur les démos, permet de créer des sliders évolués.

Cliquez sur « Begin installing plugins », sélectionnez tous les plugins et lancez l’installation.

Installer les plugins requis

Importer le contenu de la démo

Important : Cette étape n’a de sens que sur un site WordPress vierge !!! Vous risquez de tout casser si vous importez le contenu de la démo sur un site existant avec du contenu déjà. En effet, cette étape importera non seulement du contenu bidon mais changera totalement l’aspect visuel du site. Je suppose donc que vous travaillez sur une nouvelle installation WordPress vierge.

Si vous jetez un coup d’œil à l’interface de votre site, vous verrez une page très moche avec peu de contenu. Heureusement, X nous met à disposition du contenu bien formaté qui nous donnera une interface qui ressemble quasiment à celle de la démo.

Pour cela, rendez-vous à votre compte membre sur theme.co. Dans la section « Demo content », cliquez sur « Download Demo Content ». Décompressez le fichier .zip et vous aurez enfin un fichier XML.

Sélectionner Outils > Importer puis WordPress. Si vous n’avez pas d’importateur déjà installé, une fenêtre pop-up s’affichera, cliquez sur « Installer maintenant ». Une fois installé, cliquez sur « Activer l’extension & lancer l’importateur ».

Importer la démo du thème WordPress X

Sélectionnez le fichier XML qu’on vient de télécharger et cliquez sur Envoyer.

Importer le contenu de la démo du thème X

Ici, il faut sélectionner votre nom d’utilisateur dans les deux points et cocher la dernière case pour importer les fichiers attachés.

Voilà, vous avez maintenant du contenu avec des articles et des images. Si vous regardez votre site, vous verrez un blog classique avec des articles de formats différents à gauche, et une sidebar à droite. C’est loin de ce qu’on voulait avoir. Mais avant de passer à la suite, je voudrais vous présenter un outil très  puissant utilisé par X pour la personnalisation de votre thème : le Customizer.

Le Customizer

X utilise le Customizer qui a été très largement exploité par l’équipe Themeco pour vous permettre de gérer tous les aspects visuels de votre site en utilisant un visualiseur en direct afin de pouvoir apprécier les changements avant de les enregistrer. Vous pouvez donc changer les couleurs, la forme des boutons, le header, le footer, le portfolio, et tous les autres aspects de votre site. Vous n’avez donc pas à passer par le tableau de bord pour faire vos modifications, et encore moins par le code.

Vous pouvez y accéder dans le tableau de bord via le menu Customizer :

Customizer - tableau de bord

Avant de procéder à une modification, vous pouvez exporter votre customisation actuelle pour la réimporter plus tard si jamais vous décidez de revenir en arrière.

Cliquez sur Customizer, vous serez redirigé vers le site, avec le customizer à gauche :

Customizer du thème X

Je pense que détailler tout ce que l’on peut faire avec le Customizer de X nécessiterait un tutoriel entier. Mais en gros, ça vous permet de changer un peu tout ce que vous voulez sur votre site. Pour ne donner que quelques exemples, vous pouvez changer la position de la barre de navigation (fixé à gauche, à droite, en haut, ou statique) dans la section Header; changer le style des boutons (3D, flat, transparent), la forme, la taille, la couleur; choisir le nombre de colonne dans la page Portfolio, dans le Footer, dans le Header; changer l’affichage des articles dans le blog; ou changer carrément de « Stack » qui changera totalement l’apparence du thème puisque chaque Stack fonctionne comme un thème différent avec ses propres options, fonctionnalités, layouts, etc.

Nous verrons dans le paragraphe suivant cette notion de Stack qui est l’une des particularités du thème. Sinon, je vous laisse vous amuser un peu avec le Customizer, peut-être trouverez-vous le look qui vous sautera aux yeux. Pour vous faciliter l’utilisation du Customizer, l’auteur du thème a fait une dizaine de vidéos à ce sujet pour vous montrer tout ce que l’on peut faire avec. Elles sont sur votre compte Themeco.

Les Stacks : 3 thèmes en 1

X arrive avec 3 designs différents qui permettent de mettre en place des sites WordPress totalement différents et uniques.

Le premier, Integrity, est conçu pour les designs polyvalents fonctionnant aussi bien pour les sites WordPress d’entreprises et business, que pour les sites créatifs.

Renew est conçu pour les sites WordPress dotés d’un flat design.

Enfin, Icon est plutôt conçu pour les sites WordPress minimalistes modernes.

Aller passons à quelque chose de plus visuel, c’est beaucoup plus parlant en voyant ça de ses yeux. Nous allons voir comment créer des sites WordPress différents avec ces Stacks à l’aide de différents contenus démo fournis par Themeco.

Themeco propose des démos pour les 3 Stacks, et pour chaque Stack ils proposent 10 démos différentes. Vous avez donc 30 designs différents et uniques pour créer votre site WordPress! Sans compter que pour chaque design, grâce au Customizer, vous pouvez personnaliser davantage votre site avec toutes les options proposées.

J’ai passé en revue chacune des 30 démos qu’ils proposent juste pour le plaisir des yeux, et je peux vous dire que du choix, vous allez en trouver !

 Créer un site pour votre entreprise avec X

Nous allons voir ici comment reproduire l’une des démos proposées pour le premier Stack – Integrity, pour obtenir un site WordPress professionnel. Vous pourrez bien entendu adapter tout ceci avec votre contenu.

Dans votre espace membre, dans la section « Demo Content » vous trouverez les 30 démos des 3 Stacks. Sélectionnez celle que qui vous plait pour la télécharger. On prendra Integrity 08 pour cet exemple.

Deux choses doivent être téléchargées sur cette page-là, le layout de la page d’accueil (step 2) et les options du Customizer (step 3) pour avoir exactement les mêmes options que celles de la démo.

Le premier contient un fichier HTML qu’il faut ouvrir avec un éditeur de texte, copier tout le contenu, créer une nouvelle page dans WordPress et y coller ce contenu dans l’éditeur (onglet Texte et non pas Visuel)

Contenu de la démo - Integrity 08

Enregistrez et publiez la page. Ensuite, dans Réglages > Lecture il faut sélectionner « Une page statique » puis la page que vous venez de créer dans « Page d’accueil » :

Options de lecture WordPress

Vous pouvez constater que le layout de votre page d’accueil a totalement changé. Mais ça ne ressemble pas encore tout à fait à la démo. Voilà ce que ça donne :

Nouveau look du site

Il faut importer maintenant le second fichier contenant les options du Customizer. Celui-ci est un fichier JSON qu’il faut extraire du dossier .zip téléchargé dans step 3. Pour ce faire, toujours dans le tableau de bord, il faut aller dans Customizer > Import et importer ce fichier JSON.

Nouveau look du site WordPress avec le Customizer importé

Les images de la démo ne sont pas les mêmes que celles importées. Ces dernières sont des rectangles vides. Je pense que c’est par souci de droits d’auteur. Peu importe puisque vous aurez à les changer pour adapter tout cela à votre site. De même pour le texte, on a ici du texte bidon contrairement à la démo. Enfin, le slider en haut de page, n’apparaît pas ici pour les mêmes raisons je pense. N’hésitez pas à remettre le slider avec vos propres images.

Pour vous montrer la possibilité d’avoir plusieurs designs différents, j’ai pris un autre exemple en utilisant la démo de Renew 10. En quelques secondes, on peut passer du design d’au-dessus à celui-ci :

WPScouts avec le design Renew 10

Il existe d’autres designs plus exotiques. A vous de choisir celui qui vous attire le plus. Sinon, vous pouvez toujours repartir de zéro et construire votre propre design avec les shortcodes de X et le Customizer.

Pour avoir un aperçu détaillé sur tous les shortcodes et de quoi ils ont l’air dans chaque Stack, voici trois liens :

Et le WooCommerce !

Vous pouvez utiliser X pour créer votre propre boutique e-commerce puisqu’il intègre parfaitement le plugin WooCommerce. Ça peut se faire en un rien de temps. Il suffit de télécharger le plugin WooCommerce, l’installer, l’activer et installer les pages WooCommerce. Ensuite si vous souhaitez importer du contenu démo pour voir de quoi ont l’air les différents produits et comment les configurer, vous trouverez du contenu démo dans le fichier dummy_data.xml qui se trouve dans le répertoire du plugin.

Encore une fois chaque Stack a un look unique, voici trois démos :

Pour conclure..

Nous avons vu qu’avec X nous pouvons mettre en place en un rien de temps plusieurs sites WordPress avec des designs uniques. Sa force se trouve dans les 3 Stacks proposés, les shortcodes propres à X et le Customizer complet qui permettent de donner à son site une image personnalisée et unique.

Enfin, comme 2200 mots ne valent pas une image, je vous encourage à prendre le temps pour aller contempler les 30 démos proposées par X et trouver le design qui vous va le mieux.

Voir le thème X

Cet article vous a plu?

Abonnez-vous alors à notre newsletter pour recevoir des trucs utiles pour votre site WordPress.

3 Commentaires

  1. lillia 10 avril 2014
    • Anouar Fourti 10 avril 2014
  2. lillia 11 avril 2014

Laisser un Commentaire

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

101 Thèmes WordPress pour Créer ou Relooker votre Site en 2018Voir les Thèmes
+ +

Recevez du contenu
WordPress exclusif

Abonnez-vous à notre newsletter et recevez des trucs utiles pour mieux utiliser votre site WordPress!