Tutoriel complet du thème WordPress Blocksy (Blocs, Gutenberg, WooCommerce et bien plus)

Les thèmes WordPress sont de véritables atouts pour votre site web afin de leur donner une touche personnelle et unique. Il en existe des centaines aujourd’hui et pour savoir lequel convient il faut en essayer plusieurs. Différents critères rentrent en jeu lorsqu’on choisit un thème et je dirais que les principaux sont : la performance (ex : temps de chargement des pages), le design, la facilité d’utilisation et des fonctionnalités permettant d’exploiter son site web de la manière qu’on veut. 

Aujourd’hui on va s’intéresser au thème WordPress Blocksy qui regroupe plus de 30 000 installations actives et de très bon avis avec une note de 5/5. Blocksy est un thème WordPress léger, riche en fonctionnalités et, basé sur des blocs, doté de toutes les fonctionnalités essentielles dont vous aurez besoin pour votre site web. Que vous souhaitiez créer un blog, lancer une boutique e-commerce, concevoir une page d’accueil, ou créer des sites web pour des agences commerciales et des entreprises, Blocksy peut être la bonne solution. Dans ce tutoriel WordPress sur Blocksy, nous verrons certaines de ses fonctionnalités pour vous permettre de comprendre s’il convient à vos besoins.

0 blocksy
Blocksy est-il fait pour vous ? 

Trouver le meilleur thème WordPress occupe beaucoup d’entre nous. Et, il y a beaucoup de choses à considérer avant de choisir un thème pour votre site. Quel que soit l’objectif pour lequel vous recherchez un thème, il doit être bien codé, rapide et facilement personnalisable. Heureusement, Blocksy répond à toutes ces exigences et offre des caractéristiques et des fonctionnalités remarquables. 

Blocksy utilise des… blocs Gutenberg 

Pas vraiment surprenant avec l’ampleur que prend Gutenberg. Blocksy a été conçu avec l’éditeur Gutenberg qui est décrit comme l’avenir de WordPress. Ce thème va vous offrir une solide expérience d’éditeur de blocs avec un design basé sur les blocs. Si vous êtes un fan de Gutenberg, vous allez adorer.

Thème ultra léger et rapide

La vitesse de votre site web a une grande importance pour vos visiteurs et pour l’ensemble de votre activité. La vitesse du site a un impact profond sur les revenus de votre entreprise. Plus votre site se charge lentement, plus vos revenus diminuent. Blocksy étant très léger, il se charge beaucoup plus rapidement sur les navigateurs des visiteurs. Blocksy est l’un des thèmes WordPress les plus rapides disponibles aujourd’hui.

Blocksy est doté d’un système natif de chargement pour accélérer le chargement des sites. Il est classé en tête dans la plupart des outils de test de vitesse comme Pingdom et Gtmetrix. Avec votre site web construit avec Blocksy, vous n’avez pas besoin d’optimiser grand-chose pour obtenir la vitesse attendue du site.

Installation

Pour l’installation il suffit de suivre les étapes suivantes : Apparences > Thèmes et cherchez Blocksy dans la barre de recherche.

1 installation
Une fois le thème activé, vous verrez une notification dans votre tableau de bord vous invitant à installer et à activer le plugin Blocksy Companion. Bien que cela ne soit pas nécessaire et utile à tous, le plugin vous donne accès à plusieurs modèles de sites préconstruits ainsi qu’à des fonctionnalités supplémentaires telles qu’une notification de cookies RGPD, l’intégration de Mailchimp, des icônes réseaux sociaux, des widgets de messages populaires, et plus encore. Il est donc probablement utile de le télécharger pour aller plus loin.

Si vous souhaitez télécharger le plugin, il vous suffit de cliquer sur le bouton bleu Installer le plugin. Vous pouvez ensuite importer un site préconstruit en allant dans l’onglet Starter Sites. 

starter sites

Vous pouvez prévisualiser chaque site et cliquer sur le bouton Importer pour les importer sur votre site. Gardez à l’esprit que vous devrez installer un plugin Page Builder comme Elementor ou Brizy si vous ne souhaitez pas utiliser Gutenberg. 

Une fois que le site que vous avez choisi a été installé, vous pouvez procéder à la personnalisation du design et à la modification des pages individuellement pour répondre à vos besoins spécifiques.

Si vous ne voulez pas du plugin Blocksy Companion, vous pouvez cliquer sur le bouton X pour désactiver la notification et procéder à l’utilisation du thème. 

J’insiste sur le fait que le tableau de bord du thème Blocksy répertorie quelques plugins utiles (voir la capture d’écran ci-dessous) que vous pouvez installer sur votre site, mais qui ne sont pas nécessaires au bon fonctionnement du thème. Ils permettent toutefois d’étendre les fonctionnalités du thème. 

useful plugins

Une fois arrivé sur la page d’accueil, vous aurez une vue d’ensemble sur tous les raccourcis qui vous permettront de personnaliser votre thème Blocksy. 

accueil

accueil 2
Options de personnalisation 

Le thème Blocksy ne manque pas d’options de personnalisation. Vous pouvez facilement modifier les couleurs, choisir parmi des centaines de polices Google, télécharger votre propre logo, ajuster l’espacement entre les éléments du site, etc. 

Le thème Blocksy comprend plusieurs options de mise en page prédéfinies pour les articles de blog ainsi que pour les autres pages de votre site. Vous pouvez également insérer votre code Google Analytics et les liens vers vos profils sur les réseaux sociaux dans le Customizer WordPress standard lui-même. 

En plus des options de personnalisation intégrées, vous pouvez également modifier chaque élément de votre site web lorsque vous commencez à éditer vos pages avec l’un des plugins de construction de pages pris en charge. Vous pouvez modifier les paramètres de style pour chaque élément individuel de la page ainsi que pour chaque section. Cela élargit vraiment ce que vous pouvez faire avec ce thème autrement assez simple.

Comme je l’ai dit plus haut, le thème Blocksy prend en charge Elementor, Brizi et Beaver Builder. Si vous utilisez déjà l’un de ces plugins, vous pouvez facilement passer au thème Blocksy et l’utiliser pour votre site. 

Si aucun de ces constructeurs de pages ne fonctionne pour vous, le thème Blocksy a été conçu avec Gutenberg à l’esprit et prend également en charge tous les blocs Gutenberg. Vous pouvez facilement ajuster la largeur des blocs, utiliser des modèles de blocs et créer des blocs réutilisables pour une utilisation ultérieure lors de la création d’articles de blog et de contenu de page pour votre site. 

Couleurs 

Les couleurs sont modifiables selon vos besoins, que ce soit les couleurs globales, le texte, les titres ou les bordures. 

2 couleurs
En tête 

Vous pouvez avoir 3 rangées pour l’en-tête et le pied de page. Chacune de ces rangées peut avoir différents ensembles de colonnes pour y placer des éléments. 

Vous trouverez des éléments variés à insérer comme un logo que vous aurez défini auparavant, des boutons ou des icônes pour les réseaux sociaux. Tout est personnalisable de la typographie, jusqu’aux couleurs et formes. 

3 en tête
Comme vous pouvez le constater, vous pourrez gérer la disposition de vos éléments à l’aide du glisser-déposer. Ce fonctionnement permet de gagner pas mal de temps lorsque vous créez une page sur votre site web. 

Blog

Il vous sera possible de définir la structure de blog parmi les options proposées(simple, classique, grille , grille améliorée), d’ajouter ou d’enlever des colonnes et le nombre de publications sur une même page. 

4 blog
Dans les options de cartes vous pourrez définir les éléments de carte du blog comme la méta description, le titre ou l’image mise en avant par exemple. 

4 blog (1)

Dans la partie design, il est possible d’ajuster la couleur des polices du titre, de l’extrait, de la méta, de l’arrière-plan de la carte et bien plus encore. 

4 blog (2)
Pages 

Les options de page sont basiques mais efficaces; vous pourrez gérer l’affichage du contenu et son design notamment l’arrière-plan de la page ainsi que le style de la zone de contenu et son espacement vertical. 

5 pages

Vous pouvez également activer/désactiver l’image mise en avant et les commentaires. 

Barre latérale

Comme pour les éléments précédents, il vous sera possible d’ajuster la structure de la barre latérale en choisissant l’affichage. Vous pouvez aussi contrôler la largeur de la barre, la marge externe et l’espacement vertical des widgets en définissant le pourcentage à l’aide d’une jauge à curseur. Réglez le type de design et les couleurs directement ici.

6 barre latérale
Balises, visibilité de la colonne latérale et position sur mobile sont également personnalisables 

6 barre latérale(1)
Pied de page 

Le pied de page de Blocksy offre plusieurs zones à widgets, une zone pour vos réseaux sociaux et menu de pied de page. Le tout est organisé sur trois rangées. Vous pouvez également définir sa couleur dans l’onglet Footers où vous trouverez la palette de couleurs. 

7 pied de page
Options Woocommerce 

En ce qui concerne l’intégration de WooCommerce, le thème Blocksy dispose de fonctionnalités supplémentaires pour vous aider à créer une boutique hors du commun. Vos clients pourront utiliser la fonction d’affichage rapide pour voir le produit et l’ajouter à leur panier sans avoir à naviguer vers la page du produit.

Le thème prend également en charge la fonction d’ajout au panier AJAX et plusieurs mises en page différentes de la galerie de produits pour présenter vos produits de manière visuellement attrayante. Ce sont des fonctionnalités que beaucoup de gens attendent de la plupart des boutiques en ligne, c’est donc un réel avantage que Blocksy les inclut ici, surtout en ce qui concerne les fonctionnalités de WooCommerce. En d’autres termes, Blocksy vous permet de créer une boutique en ligne de manière aussi simple et directe que n’importe quel autre type de site web. 

Fonctionnalités phares 

Voici quelques fonctionnalités phares qui font de Blocksy un thème très performant. On les retrouve de manière consistante dans son utilisation. 

  • Plusieurs mises en page pour les archives et les pages uniques : Blocksy est pourvu de cinq types de mises en page modernes et épurées que vous pouvez utiliser pour des articles. Vous pouvez facilement définir une mise en page différente pour une liste d’articles différente (Catégories, Auteurs, Recherche, etc.). Les 5 mises en page d’archives sont Simple, Classique, Grille, Grille améliorée et Gutenberg.
  • Couleurs et arrière-plan : Blocksy propose plusieurs palettes de couleurs dans le personnalisateur. Vous pouvez passer à n’importe quel ensemble de votre choix. De plus, vous pouvez personnaliser la couleur de ces ensembles comme vous le souhaitez. Blocksy vous permet également de choisir une couleur globale pour la couleur de la police de base, la couleur des liens, la couleur des titres (H1 – H6) et la couleur de la sélection du texte.
  • Code adapté au SEO : Votre site sera facile à trouver grâce à l’optimisation intégrée des moteurs de recherche.
  • Barres latérales adhésives : La navigation sur votre site est ainsi plus facile et plus intuitive pour les visiteurs. 
  • Des widgets personnalisés pour les articles liés, les articles tendance, etc : Ajoutez-en autant (ou aussi peu) que vous le souhaitez pour mieux guider l’expérience de navigation des visiteurs du site. 
  • Plusieurs zones de widgets : Là encore, vous pouvez personnaliser la mise en page de votre site afin de disposer des fonctionnalités que vous privilégiez. 
  • Liens vers les réseaux sociaux intégrés : Il est plus facile de créer un réseau social et un public à long terme si vous trouvez des moyens de rester en contact avec les visiteurs même après qu’ils aient rebondi.
  • Typographie avancée : Ce thème WordPress avancé vous donne la liberté de modifier la typographie de chaque partie de votre site web globalement et localement. Aussi, il prend en charge une grande variété de plus de 900 polices Google.

Dernières technologies web utilisées par Blocksy

Blocksy utilise des technologies éprouvées et les plus récentes pour vous offrir les meilleurs résultats possibles. Ce ne sont pas des choses que vous voyez mais ces technologies sont les raisons pour lesquelles Blocksy est un thème WordPress très performant et à chargement rapide.

Les technologies que Blocksy utilise sont notamment les suivantes :

  • React : Sans aucun doute, React est l’une des bibliothèques JavaScript les plus populaires. Des composants React ont été utilisés pour créer des options Blocksy.
  • Webpack : Le pipeline de construction Webpack fournit un système permettant de charger le code uniquement pour les fonctionnalités dont vous avez besoin, sans ralentir votre site.
  • Babel : Blocksy utilise les dernières fonctionnalités du langage JS activées par Babel et contribue à leur bon fonctionnement dans tous les navigateurs.

Version gratuite ou version payante 

Comme vous le savez, la plupart des thèmes et plugins WordPress proposent des versions gratuites et payantes de leurs produits. Blocksy ne fait pas exception à la règle et propose donc une version payante.

Voici les tarifs pour que vous ayez une idée du budget nécessaire pour exploiter toute la puissance des ses fonctionnalités :

Vous avez le choix entre un abonnement annuel ou à vie (achat d’une licence permanente).

Personnel : cet abonnement coûte environ 30€/an et peut être utilisé sur un seul site. Si vous optez pour la version à vie, vous paierez environ 90€

Professionnel : cet abonnement coûte environ 40€/an ou environ 120€ pour la licence à vie et vous permet de l’utiliser sur 5 sites.

Agence : ce plan coûte environ 59€/an ou environ 180€ pour la version à vie. Avec cette licence, vous pouvez installer la version pro sur un nombre illimité de sites web. 

Tous les abonnements offrent les mêmes fonctionnalités. La seule différence est le nombre de sites sur lesquels vous pouvez installer la version Pro. 

abonnements annuels

abonnements à vie

Bien que les fonctionnalités gratuites de Blocksy répondront à la plupart de vos besoins, voici une comparaison des versions gratuites et pro. Certaines fonctionnalités ne sont pas négligeables et peuvent justifier un investissement financier !

9 free vs pro
10 free vs pro (1)

11 free vs pro (2)

12 free vs pro (3)
13 free vs pro (4)
14 free vs pro (5)
Fonctionnalités Pro

Avant de conclure nous allons voir quelques fonctionnalités pro qui à mon sens peuvent être intéressantes à explorer :

Content Blocks (Hooks) (PRO)

Les blocs de contenu de Blocksy sont des fonctionnalités très intéressantes pour construire votre site. Ces blocs sont principalement des crochets que vous pouvez placer n’importe où sur votre site, guidés par des indices visuels. Vous pouvez créer ces blocs de contenu et les placer de manière conditionnelle. Vous pouvez créer facilement des pages 404, des en-têtes et des pieds de page personnalisés et les placer à différents endroits.

Options avancées pour les blogs

Blocksy offre beaucoup d’options qui sont dédiées aux sites de blogs. C’est maintenant sans doute l’un des meilleurs thèmes WordPress pour les blogs. Si vous prévoyez de vous lancer dans le blogging, vous pouvez choisir Blocksy en raison de ses fonctionnalités avancées spécifiques aux blogs. 

  • Décidez des éléments à mettre en valeur sur la page unique et la page de listing du blog.
  • Prenez soin des cartes de blog et ajoutez-y des effets.
  • Présentez des widgets élégants en sélectionnant les articles de blog de votre choix.
  • Affichez les articles liés et les articles tendance en bas de la page.
  • Modifiez la typographie de l’ensemble du site, globalement et localement.

White Label (PRO)

Si vous dirigez une agence et que vous recherchez un thème WordPress qui représente votre marque, Blocksy est modulable. Vous pouvez remplacer la marque d’origine par la vôtre. Vous pouvez tout personnaliser, des textes aux auteurs du thème, en passant par les captures d’écran.

Custom Code Snippets (PRO)

Vous n’avez plus besoin d’un plugin tiers pour ajouter du code personnalisé à votre site web. Appliquez globalement les scripts d’en-tête et de pied de page (une partie de CSS ou de JavaScript) à charger sur chaque page. C’est très utile pour charger diverses bibliothèques ou des snippets analytiques. Vous pouvez également ajouter des snippets au niveau des articles et des pages.

Barres latérales personnalisées (PRO)

Vous pouvez rendre les pages de votre site WordPress uniques en attribuant des barres latérales différentes à chacune d’entre elles. Blocksy vous offre la possibilité de créer plusieurs barres latérales avec une interface intuitive à partir du même endroit où vous avez l’habitude de gérer les widgets. 

Conclusion

Blocksy vous évite d’installer de nombreux plugins WordPress supplémentaires. Bien que vous ayez un thème complet installé sur votre site WordPress, vous pourriez avoir besoin d’installer d’autres plugins pour certaines fonctionnalités supplémentaires sur votre site. Blocksy, dans ce cas, fait une exception. Le personnalisateur avancé du thème WordPress Blocksy prend en charge ces sortes de fonctionnalités supplémentaires et vous évite d’installer des plugins supplémentaires sur votre site. 

Si vous avez le thème Blocksy, vous n’avez pas besoin de plugin supplémentaire pour le consentement aux cookies, la barre latérale personnalisée, l’étiquette mise à jour sur les articles, le partage social, le constructeur d’en-tête et de pied de page, et bien d’autres.

Au niveau du support, l’équipe derrière Blocksy est très régulière dans la publication des mises à jour. De nouvelles fonctionnalités, des options, des améliorations des performances et des corrections de bugs sont publiées dans presque chaque mise à jour. Jour après jour, Blocksy devient plus riche et plus avancé dans ses fonctionnalités et ses possibilités de personnalisation.

Le seul inconvénient est qu’il offre un nombre relativement faible de “starter sites” par rapport à d’autres thèmes similaires. En plus de cela, tous les starter sites ne sont pas compatibles avec tous les Page Builders. Cela limite donc considérablement le nombre d’options dont vous disposez (plutôt 2 que 6).

Enfin, je dirais que si vous êtes à la recherche d’un thème gratuit et doté de nombreuses fonctionnalités, avec des temps de chargement rapides et un design moderne, qui peut être étendu via un plugin premium utile et riche en fonctionnalités, le thème Blocksy vaut vraiment le détour. Et puisqu’il est gratuit, vous ne risquez rien en l’essayant !

wpformation
NE MANQUEZ PLUS RIEN !
Inscrivez-vous pour recevoir le meilleur de WordPress dans votre boîte de réception, chaque mois.

Nous ne spammons pas ! Consultez notre politique de confidentialité pour plus d’informations.

A propos de l'auteur...

Avatar de Arnaud

Arnaud

Jeune professionnel passionné par la technologie et l'innovation, j'aime partager mes connaissances sur WordPress. J'aime voyager, découvrir de nouvelles cultures et apprendre de nouvelles idées entrepreneuriales.