Aller au contenu
Il y a deux ans, Themeco lance son produit phare, le thème baptisé « X ». En fanfare, et à grands coups de communication en ligne, Themeco explique qu’il s’agit d’une révolution dans la sphère WordPress.
À l’époque, je venais d’acheter Avada, mais j’étais très curieux de voir X en action. J’ai donc cassé ma tirelire, et je ne regrette pas du tout la transition. Il faut dire que X talonne Avada, et qu’il détient le record de ventes hebdomadaires chez Theme Forest.
Alors, pourquoi X a-t-il autant la cote auprès de ses utilisateurs ? On regarde ce que le bébé a dans le ventre, et on fait le point sur ce qu’il est véritablement.
Un thème ultra-versatile
X est plus qu’un thème. Il s’agit plus d’un Framework qu’autre chose. On y retrouve tellement d’options et de fonctionnalités qu’on a largement dépassé le qualificatif de simple thème. Petit tour d’horizon de tout ce qu’on y retrouve…
Les fonctionnalités de base
Template de page
X permet de choisir plusieurs template de page :
- Avec une colonne latérale
- Sans colonne latérale
- Avec un Header
- Sans Header
- Idem pour le footer
- Pleine largeur
- Colonne latérale à gauche, ou à droite
- Portfolio
Pas de surprise, mais là où Themeco fait fort, c’est que tout ça est mixé. On pourra par exemple faire une page qui contient un header, mais pas de footer, ou le contraire. Voir ni header, ni footer. En tout, on retrouve 12 modèles de page par défaut.
Portfolio
Comme tous les thèmes récents, on peut intégrer un portfolio sur X, avec des fonctions de tri en Ajax. On a la possibilité de créer différentes catégories, et d’intégrer un récapitulatif des derniers PF sur une page, avec un simple shortcode.
Les stacks
Autre nouveauté, la présence de « stack ». Il s’agit de mise en page prédéfinie, avec des styles très variés. Aujourd’hui, on dénombre quatre stack sur X. Chaque stack lui-même comprenant une petite dizaine de variations. On approche donc la quarantaine de styles radicalement différents les uns des autres. Quelques exemples ci-dessous vous permettront de voir ce qu’on peut obtenir en quelques clics. Et vous allez voir que le customiser permet d’aller encore plus loin…
[soliloquy id= »10300″]
Les démos
Comme si ça n’était pas suffisant, le thème propose également d’intégrer des démos, histoire de prendre le monstre en main avec du contenu : aujourd’hui, il en existe cinq (Church, Restaurant, Agency, Spa et Education).
Les démos facilitent grandement la découverte des fonctionnalités, ainsi que la prise en main du thème. Une nouvelle démo est en cours de préparation, et doit sortir au début de l’année. Perso, je pense qu’on peut effectivement utiliser ces données pour comprendre la logique du framework, mais que c’est une erreur de les utiliser pour y placer son contenu. Après, pour un débutant, c’est un élément bien pratique, qui peut servir de « béquille » pour quelques semaines.
Le customiser
Depuis la version 3.4 de WordPress, on retrouve une option de personnalisation dans le menu apparence. Cet outil intègre une API qu’on peut utiliser sur un thème. Et chez Themeco, ils n’ont pas fait les choses à moitié, car c’est dans le customizer que sont intégrés les paramètres des stack.
Le customizer de X et donc une splendide usine à gaz qui permet de choisir un très grand nombre d’options. Et c’est justement cette combinaison d’option qui définit les stack, ainsi que leur version. Voici donc un petit panel de ce qu’on peut modifier dans cette version du customiser enrichi.
- Choix du stack
- Mise en page du site (boîte ou pleine largeur)
- Largeur maximal du site en pixel
- Largeur du site (en pourcentage)
- Mise en page globale (contenu à gauche-colonne latérale droite, contenu à droite-colonne latérale à gauche, pleine largeur)
- Background : couleur, motif, image, images avec fondu
- Options spécifiques au stack
- Typo personnalisé
- Typo du logo (si vous n’utilisez pas d’image), couleur, taille, graisse, letter-spacing, uppercase (ou pas)
- Couleur des liens de la navigation, style du hover, graisse, uppercase etc
- Idem pour les titres (Hn)
- Idem pour la typo du Body
- Idem pour les liens
- Style des boutons (3D, flat, bouton squelette)
- Forme des boutons (coins carrés, arrondis, gélules)
- Taille des boutons (six tailles différentes)
- Sélection de la taille de la typo des boutons, couleur de fond, couleur des bords, pareil pour le Hover
- Position du header (Static en haut, fixe en haut, fixe à gauche, fixe à droite)
- Mise en page du logo et de la navigation (en ligne, ou empilés)
- Activation ou désactivation de la recherche dans la barre de navigation
- Hauteur de la navigation quand elle est en haut
- Largeur de la navigation quand elle est sur le côté
- Upload du logo
- Logo Retina ready
- Alignment du logo
- Alignement du bouton de navigation sur les mobiles
- Taille des boutons de navigation pour les mobiles
- Zoning des widgets pour le header (1 à 4)
- Possibilité de différencier les boutons des widgets du header (hover inclus)
- Activation/désactivation d’une top-bar dans le header
- Possibilité d’insérer du contenu dans la top bar (HTML accepté)
- Activation désactivation du fil d’Ariane
- Possibilité d’activer une zone de widgets dans le footer, avec un à quatre slots
- Activation désactivation d’une autre zone dans le footer, avec possibilité de mettre des widgets, un menu, des icônes sociales etc.
- Possibilité d’insérer du HTML brut dans le footer
- activation désactivation d’un bouton scroll to top
- Choix du style pour le blog (standard ou masonry)
- Choix de la mise en page pour le blog
- Choix de la mise en page pour les archives (comme pour le blog)
- Activer ou désactiver les métas pour les articles
- Extrait ou article complet sur la page des articles
- URL customisée pour les objets de portfolio
- Possibilité d’activer le croping pour les images du portfolio
- Activation et désactivation des métas pour les objets de portfolio
- Liste d’étiquettes personnalisées pour le portfolio
- Titre personnalisé pour les projets du portfolio
- Boutons personnalisés pour les objets du portfolio
- Activer ou désactiver le partage social sur le portfolio
- Régler et pré visualiser les options de bbPress
- Mettre à jour le layout de bbPress
- Activer ou désactiver la présence de bbPress dans le menu de navigation
- idem pour Buddy Press
- idem pour WooCommerce
- Intégration de profil pour Facebook, Twitter, Google plus, LinkedIn, Four square, Youtube, Vimeo, Instagram, Pinterest etc.
- Favicon pour le site
- Intégration de CSS ou JS personnalisé dans le Head
- Gestion des widgets
- Et pleins d’autres options…
Waouh. Ça en fait des choses. On réalise très rapidement la puissance de cet outil et de son potentiel. On peut réaliser à peu près tout et n’importe quoi en terme de mise en page, sans avoir à mettre les mains dans le CSS.
Les possibilités de création sont inouïes, et la seule limite, c’est l’imagination.
X intègre les meilleurs technologies du web
En tant que prétendant au trône, Themeco a mis le paquet pour utiliser ce qui se fait de mieux sur le web. Le « package X » comprend donc tout ce qu’il faut pour être un best-seller sur Themeforest. 100 % responsive-design, le thème est livré avec Woocommerce (pour monter une boutique en ligne), BB-Press (pour créer un forum sur votre site), BudyPress (pour intégrer des fonctions sociales, idéales pour un club de sport ou une entreprise), et tout les « classiques » du web moderne :
- Mega-menu
- Navigation one-page (pour ceux qui le souhaite)
- 2 formulaires de contact différents
- 7 formats d’articles différents (vidéo, audio, liens, citations etc)
- marqueurs sémantiques pour le SEO (citation, header, footer etc)
- support RTL
- possibilité de créer plusieurs colonnes latérales (pour y afficher différents widgets en fonction de la catégorie, de la taxonomie etc)
- possibilité d’afficher les contenus avec des fondus, des effets de slide etc…
Si vous voulez voir ce que ça donne en live, vous pouvez jeter un coup d’oeil à mon site principal en cliquant ici…
Les extensions
Thèmeco ne s’arrête pas là. Avec X, c’est une véritable armée d’extensions qui débarque. La plupart sont parfaitement optionnelles, d’autres sont obligatoires, et certaines sont carrément incontournables.
Cornerstone
C’est le builder de page. On va y revenir, car il s’agit d’une petite révolution dans la sphère WordPress. On lui consacrera même plusieurs tutoriels, parce que si on veut utiliser l’outil au maximum de ses capacités, il va falloir optimiser pas mal de choses.
Content Dock
Content Dock est une petite slide-box qui apparait sur certaines pages (paramétrage au choix), à gauche ou à droite. On peut insérer à peu près tout ce qu’on veut (HTML supporté) puisque cela rajoute une zone widgetisable dans le gestionnaire de widgets.
ConvertPlug
ConvertPlug est un plugin de conversion. Permet d’afficher du contenu (vidéo, formulaire d’inscription newsletter, code promo etc.), selon tout un tas de critères (utilisateur, action utilisateur, temps passé sur la page etc.). Intègre des données comme analytics, pour mesurer la conversion, faire du AB Testing etc.
Custom 404
Plugin bien pratique pour créer une page 404 personnalisée.
Disqus Comments
Vous en avez marre du système de commentaire natif de WordPress ? Disqus remplace ce dernier, grâce à un Frame. Allège la charge sur votre serveur, mais nécessite un compte de gestion tiers.
Mailchimp
Mailchimp permet d’intégrer sur votre site l’API du célèbre provider de mass-mailing. Construisez votre formulaire, et récupérez automatiquement les adresses de votre audience sur votre compte Mailchimp.
Envira Gallery
Un gestionnaire de galerie en responsive design. On peut intégrer tout un tas de mise en page : lightbox, Masonry, Albums, Galerie vidéo. Possibilité d’intégration des réseaux sociaux etc…
Essential Grid
Une création de Themepunch. Essential Grid permet de créer une grille de contenu (photos, articles, vidéos etc.), avec filtre en Ajax. Véritable usine à gaz permettant de personnaliser à fond sa présentation de contenu.
Facebook Comments
Activer les commentaires Facebook, plutôt que le système natif de WordPress. Permet d’accroitre l’interaction avec toute l’audience connectée à Facebook (c’est-à-dire 90 % de vos visiteurs…).
Google Analytics
Vous ne savez pas où coller le script de tracking analytics sur votre thème ? Avec ce plugin, vous êtes tranquille, un simple copier-coller, et c’est réglé. Pas besoin de vous connecter en FTP. Rapide, simple.
Layerslider
Layerslider, c’est un concurrent solide à Revolution Slider. Permet de créer des sliders avec des animations, grâce à un builder intégré en back-office. Le système de calque offre de très nombreuses possibilités de création.
Olark Integration
Olark, c’est un système de chat pour vous permettre de communiquer directement avec vos visiteurs. Une petite fenêtre en bas de vos pages offre une interface de communication directe, remplacée par un formulaire de contact si vous n’êtes pas dispo.
Slider Revolution
C’est certainement le plug-in de slide heures le plus utilisé sur WordPress. Il permet de créer des Snyder avec tout un tas d’animations. C’est une grosse usine à gaz, et il faut une petite heure pour le prendre en main correctement.
Smooth Scroll
Smooth Scroll, c’est un peu un gadget, qui permet de modifier le comportement de scroll, selon plusieurs paramètres. Pas vraiment utile, c’est juste un petit plus appréciable sur les sites qui comprennent notamment des effets en parallaxe.
Soliloquy
Vous avez besoin d’un Snyder tout simple ? Sans effet, juste une petite présentation d’une image ? Solyloquy peut réaliser tout ça. En quelques minutes, vous intégrez votre Snyder sur la page, vous choisissez les photos que vous y mettez, et basta !
Term of Use
Si votre site permet aux utilisateurs de s’inscrire, ce plug-in permettra de valider des conditions générales d’utilisation. Vos visiteurs devront les accepter pour s’enregistrer sur votre site.
Typekit
Typekit permet d’ajouter davantage de police que Google fonte. C’est un plus indéniable si vous avez une demande très particulière, et que vous n’avez pas envie de mettre les mains dans votre CSS pour importer les polices.
Under Construction
Vous avez des travaux à faire sur le site ? Under Construction vous permet d’afficher le contenu de votre choix, avec un compte à rebours si besoin, pour expliquer à votre utilisateur que le contenu n’est pas disponible. Très bien pour le lancement d’un site.
Video Lock
Video Lock vous permet d’intégrer une vidéo sur une page, avec un call-to-action qui n’apparaît que quand vous le souhaitez. Un outil de marketing-vidéo fort pratique.
Visual Composer
X tournait avant sous Visual Composer. Le plug-in est toujours disponible dans le back office, mais on lui préférera quand même Cornerstone. Pour ceux qui ne connaissent pas, Visual Composer est un builder de page très utilisé.
White Label
White Label permet de modifier l’écran de connexion au back office de WordPress, et d’intégrer des contenus sur le back-office (HTML supporté). Très bien si vous voulez vendre un site en marque blanche.
Vous avez vu, il y en a quand même un paquet ! Un bémol toutefois sur Revolution Slider, Layer Slider et Grid Essential, qui sont de véritables usines à gaz, et dont le code source est extrêmement lourd ! Perso, je vous conseille de vous en passer si vous pouvez. Ou alors de ne les utiliser que sur des pages « peu importantes » de votre site.
Maintenant, examinons LE plugin du thème : Cornerstone…
Cornerstone, c’est quoi ?
Cornerstone est un constructeur de page. Sa particularité, c’est son espace de travail full Front-office. Cet espace est divisé en deux parties : à gauche, les outils que vous avez à disposition, et à droite, le résultat en direct !
L’interface fonctionne en drag-and-drop : vous ajoutez vos sections, vos colonnes, et vous déposez simplement les éléments que vous souhaitez utiliser dans les conteneurs. Tout ce que vous faites sur votre écran de travail est un rendu parfait du résultat final. Et Themeco réussit ici son pari : créer une interface de travail qui réunit à la fois le front-end, et le back-end…
Cornerstone permet d’intégrer tout un tas de composants :
- Accordéon
- Alertes
- Contenus Audio
- Encart sur l’auteur
- Grille de contenus
- Citations
- Boutons
- Call-to-action
- Clear (pour les floats)
- Code (pour insérer du code source non-interprété)
- Conteneurs parent et enfants
- Colonnes
- Titre personnalisé (avec des icônes, ou pas)
- Lettrine
- Fonctions de partage social
- Titre à la une
- Espacement vertical
- Eléments en surbrillance
- Icones (Font awesome)
- Listes différenciées (avec les icones justement)
- Images
- Lignes
- Google Map ou autre provider de map
- Popovers & Tooltips (affiche une petite boite de contenu au survol d’un élément)
- Prombox : une boite avec image, header, texte et CTA
- Contenu protég,é déverrouillable avec mot de passe ou connexion utilisateur
- Liste d’articles récents
- Lightbox responsive
- Grille de prix
- Slider
- Texte responsive (avec un JavaScript)
- Vidéo responsive
- Sélection d’affichage du contenu en fonction du terminal utilisateur
- Barre de recherche
- Animation-bar
- Contenu dans des onglets
- Table des matières
- Contenu avec effet flip-over
- Compteurs animés
- Liste à la une
- Zone de saisie
- HTML ou scripts bruts
- Zone widgetisable
Comme ça, c’est clair : tout ce qu’on trouve traditionnellement sur un site Internet, vous pouvez l’ajouter sur votre site. En quelques clics.
C’est déjà un très bon point pour le thème et son builder de page. Mais, pour moi, ce n’est pas le meilleur point de Cornerstone. L’intérêt réside bien plutôt dans la facilité qu’on a à travailler avec cet outil.
En effet, le coup de génie de Themeco, c’est d’avoir conçu une interface qui permet de gérer la mise en page, les éléments de contenu, les options de WordPress, les CSS et les JavaScript, tout ça sur une seule page !
Je vais prendre un exemple tout bête : vous créez un bouton différencié sur un article. Avec une interface d’édition classique, vous allez être obligés de jongler entre :
- La page d’édition de votre article
- Votre client ftp
- Votre feuille de style
- Éventuellement un fichier JavaScript
- Votre article en front office.
Cette simple opération de création vous oblige à jongler entre cinq interfaces (si vous développez d’abord en local, c’est encore pire, évidemment)… Et c’est sans compter sur les temps de chargement et d’upload de de vos fichiers. En gros, la création de votre bouton va vous prendre plusieurs minutes.
Sur Cornerstone, vous n’avez qu’une seule interface à gérer, et vous avez les résultats en direct. L’onglet « settings » vous permet justement d’avoir accès aux CSS et aux JavaScript que vous allez utiliser. Chaque élément peut avoir un id ou une classe spécifique. Et toutes les modifications que vous faites sont visibles en temps réel sur la fenêtre de droite, celle qui contient votre page.
Maintenant, imaginez un peu le temps que vous allez gagner sur l’intégration d’un site complet !
Et ce n’est pas tout ! Chaque bloc que vous allez créer, chaque section que vous allez produire, chaque page que vous allez définir, tout ça pour être enregistré dans Cornerstone.
Du coup, vous allez pouvoir vous constituer une bibliothèque de contenu, que vous utiliserez sur votre site, au gré de vos besoins.
Pour mon site principal, par exemple, j’ai démarré en créant les maquettes sous Photoshop, un bloc-notes à côté pour définir les sections et une convention de nommages des classes CSS, puis j’ai créé une seule page contenant tous les blocs que je peux utiliser.
Ensuite, il m’a suffi de créer les pages (vides), et d’importer mes blocs grâce à la bibliothèque que j’avais constituée précédemment. Les maquettes étant déjà réalisées, tout le travail d’intégration n’a consisté qu’à uploader les textes et les images !
Les performances du thème
Avec un tout petit effort sur les temps de chargement, on peut atteindre de très bonnes performances. Pour mon site principal, j’ai juste utilisé un outil pour concaténer et minifier les css et JavaScripts. Le résultat en image :
Ça parle tout seul, seulement 42 appels http et 1.54 secondes de temps de chargement pour une page de bourrin qui fait 1.9 MB ! Je pourrai gratter quelques points encore, en utilisant un CDN pour paralléliser les envois de contenus, mais ça veut dire prendre un Wildcard SSL (car le site est full https), donc craquer 200 € pour quelques millisecondes de gain : ROI trop faible pour être mis en place.
Bref, même avec une usine à gaz, les développeurs de X ont fait ce qu’il fallait pour que le thème soit le plus léger possible, et ça, on apprécie énormément…
Les points faibles de X
Souvent, en informatique, quand c’est simple pour l’utilisateur, c’est compliqué pour le développeur. Plus vous avez de fonctionnalités disponibles, plus le système sera complexe à mettre en place. Pour moi, il y a deux points négatifs sur X.
Le premier, c’est que c’est un Framework. Si un jour, celui-ci n’est plus maintenu, et qu’il n’est plus compatible avec WordPress, c’est terminé. Un Framework, c’est vraiment pratique, ça fait gagner du temps, mais ça vous met dans une situation de dépendance.
Le premier reproche que je fais à X, je pourrais donc le faire à tous les thèmes modernes.
Pour le second point, ça va dépendre de l’utilisateur… En effet, le code source de X peut devenir lourd. Si vous utilisez les fonctions de personnalisation de Cornerstone sans passer par la case « CSS », vous allez vous retrouver avec un ratio text-to-code au ras des pâquerettes.
Cornerstone, comme tous les builders de page, ne peut implémenter les styles que dans le code source, et pas dans un fichier externe. Donc, si vous vous lâchez sur la création, et que vous utilisez le builder pour créer votre style sur la page (titre plus gros, gras, en rouge etc.), vous allez injecter pas mal de CSS « inline » dans le code. Et ça, ce n’est pas top-top pour le référencement.
De la même façon, le customiser, c’est une très bonne idée. Mais où se retrouve tout le CSS généré par cette couche applicative ? Dans le Head. Donc, sur toutes les pages. Si votre CSS est dans un fichier .css, comme il se doit, votre navigateur ne va le télécharger qu’une seule fois. Mais ici, on va retrouver le CSS du customiser sur toutes les pages : ça alourdit inutilement votre Head.
Heureusement, il y a une solution pour fixer ça
Oui, sinon, je ne m’en servirai pas. Le tuto pour virer cette saleté de code redondant du head est en cours de réalisation. Vous verrez, c’est ultra-simple : un copier-coller, une fonction PHP (fournie avec le tuto), et hop, on retrouve un head ultra-léger 🙂 La mise en place du fix prend 3 minutes à tout casser !
Pour le reste, en faisant un tout petit peu attention à la façon dont vous créez vos contenus, il est possible d’avoir un résultat plus qu’honorable !
Les points forts du thème
X est effectivement un thème très complet, très versatile, et assez facile à prendre en main. L’interface est intuitive, bien travaillée et ergonomique. Avec Cornerstone, vous avez accès à tout ce dont vous avez besoin pour intégrer tous vos contenus, rapidement et facilement.
La bibliothèque de blocs de page qu’on peut constituer est à elle seule un avantage majeur pour tous les créatifs qui utilisent WordPress. Le très grand nombre d’extensions et de shortcode permet de réaliser un site unique, pour un coût dérisoire (64 $).
Ajoutez à ça un support très réactif, une communauté de plusieurs milliers d’utilisateurs, et vous avez toutes les chances pour créer un site ultra-complet et personnalisé, en un temps record.
Conclusion
Le thème X est une véritable merveille ! Seulement, pour utiliser tout son potentiel et avoir des performances optimales, il faudra créer un thème enfant et mettre un peu les mains dans le code. Pour les néophytes, il permet d’avoir un site correct, pour un tout petit prix. Et pour les créatifs qui aiment bien optimiser les choses à fond, il peut tout simplement devenir LE thème par excellence, pour réaliser tous les projets !
Superbe article ! Quel contenu !!
Un grand GRAND merci pour cette lecture, j’y vois beaucoup plus clair en tant que débutant WordPress. On ressent ta passion dans les lignes, et ça c’est vraiment cool, car c’est pas courant de nos jours 🙂
Je suis tombé sur ton site en cherchant des choses sur le theme X que j’ai acheté hier (et avec lequel je débute WordPress), et avec les tutos et les articles, c’est que du bonheur !
Au plaisir de te lire et de voir d’avantage de tutos. Encore merci et à très vite !!
Bonjour Sam,
merci beaucoup pour les compliments, ça fait toujours plaisir (et ça motive pour la suite). Au plaisir de voir ce que tu as pu monter avec ce superbe thème 🙂
Bonjour Charles,
Je pense me tourner vers le theme X tres biento, cependant a la lecture de votre article 2 dernier point retienne mon attention pour passer a l achat !
Je vous cite donc…
»Cornerstone, comme tous les builders de page, ne peut implémenter les styles que dans le code source, et pas dans un fichier externe. Donc, si vous vous lâchez sur la création, et que vous utilisez le builder pour créer votre style sur la page (titre plus gros, gras, en rouge etc.), vous allez injecter pas mal de CSS « inline » dans le code. Et ça, ce n’est pas top-top pour le référencement »
1 ) Donc Question est ce que la solution a ce probleme c’est votre tuto sur le css dans le head ? ou faut t il faire autre chose car je ne suis pas tres sure que ce soit ça lorsque je vous lis ? sinon que faire ?
Je vous cite de nouveau :
»Pour le reste, en faisant un tout petit peu attention à la façon dont vous créez vos contenus, il est possible d’avoir un résultat plus qu’honorable ! »
2 ) Que voulez vous dire par faire un tout petit peu attention ? pour rappel je suis debutant en wp et a part utiliser les outils de base, customiser, et cornerstone et les stack je ne peu rien faire d autre…
3) j’ai aussi lu votre article sur le gain de vitesse avec votre nouvel hebergement chez OVH dont vous etes tres content, perso je suis chez O2switch est ce que ça vaut le coup de changer ou les performances sont similaire ?
Voila, j ai ete un peu long mais je voulais aller au fond de la question
Au plaisir de vous lire..
David
Bonjour David,
Le tuto pour retirer le CSS du head est là pour nettoyer le « formatage » du Customizer, il ne gère pas le code CSS injecté par Cornerstone sur le contenu principal des pages. Les bonnes pratiques, c’est simplement d’ajouter une classe ou un id sur les éléments redondants pour coder leur style dans le fichier de CSS du thème enfant. Maintenant, si vous ne connaissez pas le CSS, et que vous voulez utiliser les outils de Cornerstone, ça n’est pas très pénalisant en soi (et de très nombreux éditeurs de contenus fonctionnent comme ça). Franchement, pour avoir testé pas mal d’autres thèmes depuis la création de cet article, je persiste et signe : vous ne trouverez pas mieux que ce thème là pour créer un site unique.
Pour votre hébergeur, ne changez rien, O2 Switch a un très bon produit, pas cher, facile à utiliser. Migrer chez OVH pour prendre un VPS, ça veut dire « mettre les mains dans le code et la tête dans les logs », et je ne suis pas sur que ça vous plaise 🙂 Bonne journée 🙂
Ok merci, oui deja que je trouve ça un peu compliquer chez o2switch… j ai vraiment pas envie de me faire ch…, avec trop de tech, car j ai du contenue a envoyer… j ai acheter le X on va bien voir ce que j arrive a en faire maintenant, si vous etes motiver je serai tres interesser par un petit tuto ( simple et clair ) sur l optimisation de cornerstone et les bonnes pratiques pour optimiser mon site, ou si vous connaissez un tuto qui explique ça en ligne vous pouvez peut etre mettre le lien, j’essai de m ameliorer et je veux faire ranker mon site mais j ai des bases tech de debutant…en tout cas merci je vais deja optimiser le customizer grace a votre tuto, bon mois d ‘aout ! Dav
Pourtant O2 switch a un controle panel assez simple par rapport aux autres hébergeurs. Pour les tutos sur Cornerstone, c’est prévu, avec d’autres tutos pour optimiser WordPress pour le SEO. Stay Tuned 🙂
Bonjour Charles,
Du haut niveau, comme d’habitude.
A la lecture de cette page, le thème X semble très similaire qu thème Divi, que j’utilise depuis peu. As tu déjà eu l’occasion de le tester ?
J’en conclu également que Divi a le même inconvénient en terme de CSS injecté dans le code.
J’ai donc une question, la solution que tu envisages pour solutionner ce problème est elle valable pour Divi ?
Merci
Salut Jérome, Divi, X, Avada Builder, Enfold, Beaver Builder, même combat.
Tous les constructeurs de page qui permettent de modifier le style en cliquant sur des boutons injectent du CSS inline. Tous. Et je parle même pas de la p***** de couche qu’ils injectent dans le head (le pire, et de loin, étant Avada).
Dans tous les cas, c’est possible de virer cette saleté du head, en dégreffant la fonction qui appose ces contenus (faut fouiller un peu dans les fichiers du thème, avec notepad++, mais ça se fait très bien, voir : https://www.gdm-pixel.fr/tutos/wordpress/retirer-css-head-theme-x/). Donc oui, c’est faisable avec Divi, faut juste trouver le nom de la fonction (essaie avec le chercher/remplacer de notepad++, en utilisant l’option « chercher dans tous les fichiers d’un dossier »).
EDIT : trouvé sur Divi 2, c’est à la ligne 963 de functions.php (add_action( ‘wp_head’, ‘et_divi_add_customizer_css’ );…
Essaie d’ajouter ça à ton functions.php dans ton thème enfant :
function remove_inline_customizer_css () { remove_action( 'wp_head', 'et_divi_add_customizer_css', 9998); } add_action('after_setup_theme', 'remove_inline_customizer_css');Adapte en fonction du nom de ta fonction déclarée dans le thème parent 🙂
Merci Charles.
Quand je touche au php, c’est pour suivre, bêtement, un bon tuto. Du coup je vais essayer, mais si je n’y parviens pas, me permets tu de te citer auprès de la (petite) communauté divi France afin de trouver quelqu’un qui pourrait adapter ton astuce au thème Divi ?
Encore merci pour tes tutos que je suis régulièrement.
A ce sujet, y aurait pas comme une petite baisse de régime ? 😉
Une grosse baisse tu veux dire ! J’ai trop de boulot en ce moment, donc je ne me plains pas, mais c’est clair que j’ai du mal à assurer la prod et les tutos sur le blog. Normalement, la fonction que je t’ai indiqué fait le taf, mais peut être à adapter pour Divi 3…
bonjour,
J’ai fait installer l’année dernière le thème themeco X sur mon wordpress et je suis en train de réaliser tant bien que mal mon site. Mon problème si quelqu’un peut le résoudre c’est que j’aimerai bien avoir mon site en plein page sur tout l’écran sans limite de bordure à droite et à gauche. J’ai cherché en vain les paramètres et j’ai rien rien trouvé???
Il faut que je tape un code? A l’aide
Merci à vous
Salut Brahms, pour ton besoin, ça se passe dans le customiser 🙂 Ou alors, sur Cornerstone, tu sélectionnes ton row, et tu décoches l’option pour que le row soit en mode « container ». Il occupera alors 100 % de l’espace dispo (et non plus seulement la largeur max du conteneur définie dans le customiser). X est un thème super versatile : autant tu peux faire quelque chose de simple quand tu es débutant, autant il peut devenir ultra-complexe dès que tu veux personnaliser tout à fond…