Comment exporter et importer des blocs Gutenberg dans WordPress


Au début, les utilisateurs de WordPress avaient une relation douce-amère avec le générateur basé sur des blocs WordPress. Ensuite, comme nous l’avons découvert dans notre guide de Gutenberg, le nouvel éditeur est livré avec des fonctionnalités incroyables qui rendent la création de contenu magnifique facile et amusante. Maintenant, certains ne peuvent pas en avoir assez de l’éditeur.

Gutenberg vous offre suffisamment de fonctionnalités pour créer des pages et des articles remarquables, sans écrire de code. Peu importe le contenu que vous souhaitez ajouter, Gutenberg n’a que le bloc.

Vous souhaitez modifier et styliser en profondeur chaque bloc de contenu? Gutenberg vous soutient grâce à une batterie d’options de personnalisation. Vous voulez encore plus de blocs que ce qui est disponible dans l’éditeur par défaut? Il existe une tonne de plug-ins Gutenberg.

C’est pourquoi il est triste que de nombreux utilisateurs ne connaissent pas Blocs réutilisables, l’une des brillantes fonctionnalités de Gutenberg. Si vous ne savez pas de quoi nous parlons, les blocs réutilisables sont tout simplement contenu blocs que vous créez, enregistrez et réutilisez à volonté.

Supposons que vous souhaitiez ajouter une incitation à l’action, une note de remerciement, une signature, un formulaire ou toute autre chose à la fin de chaque publication ou page.

Auparavant, vous deviez enregistrer la fonctionnalité dans un fichier texte sur votre ordinateur. Lorsque vous en avez besoin, vous pouvez ensuite le copier-coller dans votre publication ou votre page. Gutenberg a atténué ce problème. Désormais, vous n’avez plus besoin d’utiliser des fichiers texte ni de créer les mêmes blocs à partir de zéro à chaque fois.

Vous pouvez créer un seul bloc réutilisable et l’utiliser non seulement dans vos publications et pages, mais également sur d’autres sites Web WordPress.

Que vous créiez de nombreux sites Web ou que vous ayez besoin d’ajouter du contenu spécial à chaque publication / page, les blocs réutilisables Gutenberg peuvent vous aider à gagner beaucoup de temps.

Et dans l’article d’aujourd’hui, nous vous montrons exactement comment créer et exporter des blocs Gutenberg réutilisables dans WordPress. Notre objectif est de vous aider à déplacer et à réutiliser facilement des blocs de contenu personnalisés sur plusieurs publications / pages / sites Web WordPress.

De côté: Si vous créez un bloc en utilisant un plugin tel que Getwid, par exemple, vous devez installer le plugin sur les autres sites WordPress que vous souhaitez réutiliser ledit bloc. Notez également que vos blocs peuvent sembler légèrement différents d’un thème à l’autre, mais c’est très bien car Gutenberg vous offre beaucoup de puissance de personnalisation.

Cela à l’écart, prenez une tasse de café et profitez de la lecture.

Tout d’abord, vous avez besoin de blocs réutilisables

Malheureusement, vous ne pouvez pas exporter ou importer ordinaire blocs. Pour exporter et importer des blocs Gutenberg, vous devez d’abord créer réutilisable blocs.

À des fins d’illustration, je vais créer un merci note que je voudrais ajouter à la fin de chaque article que je publie. Vous savez, sans réécrire la note à chaque fois que je dois l’ajouter à un message 🙂

ma merci note n’est rien de complexe; juste un simple bloc de paragraphe avec des liens vers Twitter et Facebook. Gardez à l’esprit que votre bloc peut être tout ce que vous voulez – une bannière publicitaire, un curseur d’image, un devis, une liste, les derniers messages, le formulaire MailChimp, etc.

Plus tard, je vais vous montrer comment exporter la note (lire, bloquer) vers un deuxième site Web WordPress. Ça m’a l’air bien? Très bien, commençons.

Comment créer un bloc réutilisable

La création d’un bloc réutilisable est incroyablement facile. Aller vers Messages> Ajouter un nouveau pour lancer l’éditeur Gutenberg:

ajouter un nouveau message wordpress

Ensuite, cliquez sur le Ajouter un bloc (+) puis choisissez votre bloc de contenu. Dans notre cas, j’ai ajouté le bloc de paragraphe, comme indiqué dans l’image suivante.

ajout d'un bloc gutenberg dans wordpress

Après cela, personnalisez et stylisez votre bloc selon vos besoins. J’ai ajouté du texte, des liens vers les réseaux sociaux et une couleur d’arrière-plan. Voici comment notre nouveau bloc aka merci note regarde dans mon éditeur Gutenberg:

Comment exporter et importer des blocs Gutenberg dans WordPress 1

Très gentil John Doe. Très agréable. Maintenant, je vais probablement suivre votre blog sur les réseaux sociaux 🙂 Avancer rapidement.

Pour le moment, la note ci-dessus est un ordinaire bloquer. Nous devons le convertir en réutilisable bloc que nous pouvons exporter et importer. Pour ce faire, cliquez sur le Plus d’options icône, puis Ajouter aux blocs réutilisables, comme indiqué ci-dessous.

Comment exporter et importer des blocs Gutenberg dans WordPress 2

Ensuite, nommez votre bloc réutilisable et appuyez sur le sauver comme illustré ci-dessous.

nommer un bloc gutenberg réutilisable

Et voilà, vous venez de créer votre premier bloc réutilisable. Bravo amigo.

Comment utiliser les blocs réutilisables

L’ajout du bloc réutilisable que nous venons de créer à vos publications ou pages est extrêmement simple. Une fois que vous avez ajouté le contenu requis à votre publication ou page, cliquez sur le Ajouter un bloc (+) , faites défiler jusqu’à Blocs réutilisables onglet, et choisissez votre bloc (note de remerciement dans notre cas), comme indiqué ci-dessous.

bloc réutilisable gutenberg

Après avoir ajouté le bloc réutilisable à votre publication ou à votre page, cliquez sur le Aperçu/Publier pour afficher vos résultats dans le front-end. Voici ce que j’ai obtenu:

Comment exporter et importer des blocs Gutenberg dans WordPress 3

Mon site de test exécute le thème Twenty Twenty.

La meilleure partie est que je peux réutiliser mon merci note bloquer à tout moment, sans avoir à le créer à partir de zéro. Je peux l’ajouter à tous les types de publication qui prennent en charge les blocs Gutenberg.

Maintenant que vous savez comment créer et utiliser des blocs réutilisables, apprenons-en plus sur l’exportation de ces blocs vers un autre site Web WordPress. Pour éviter toute confusion, j’utiliserai le même bloc que nous venons de créer.

Comment exporter des blocs Gutenberg dans WordPress

L’exportation d’un bloc Gutenberg réutilisable est l’affaire des élèves de quatrième année, vous aurez terminé en un rien de temps.

Que faire?

Dans l’éditeur Gutenberg, cliquez sur le Plus d’outils et d’options icône, puis Gérer tous les blocs réutilisables, comme nous le soulignons ci-dessous:

gérer tous les blocs réutilisables

Cela vous conduit au Blocs écran où vous pouvez visualiser et gérer tous vos blocs réutilisables:

Comment exporter et importer des blocs Gutenberg dans WordPress 4

Nous avons seulement Merci Note mais l’écran ci-dessus se remplira à mesure que vous en créerez plus. Pour exporter, passez la souris sur le titre et cliquez sur le Exporter en JSON lien qui apparaît. Voir l’image ci-dessous.

Comment exporter et importer des blocs Gutenberg dans WordPress 5

Ensuite, enregistrez le fichier JSON sur votre ordinateur:

Comment exporter et importer des blocs Gutenberg dans WordPress 6

Maintenant que nous avons le fichier JSON sur votre ordinateur, il est temps d’importer le bloc sur notre deuxième site de test.

Comment importer des blocs Gutenberg dans WordPress

L’importation de vos blocs réutilisables est aussi simple que A, B, C. Tout d’abord, ouvrez l’éditeur Gutenberg. Deuxièmement, cliquez sur le Plus d’outils et d’options icône, puis Gérer tous les blocs réutilisables, comme indiqué ci-dessous.

Comment exporter et importer des blocs Gutenberg dans WordPress 7

Sur le Blocs écran qui suit, cliquez sur Importer depuis JSON, choisissez le fichier que vous avez téléchargé précédemment, puis appuyez sur le Importation bouton dans cet ordre:

Comment exporter et importer des blocs Gutenberg dans WordPress 8

Et c’est tout! Juste comme ça, vous avez réussi à importer un bloc Gutenberg réutilisable sur votre deuxième site WordPress:

Comment exporter et importer des blocs Gutenberg dans WordPress 9

N’était-ce pas si simple? Ensuite, vous pouvez utiliser et réutiliser votre bloc Gutenberg sur le deuxième site Web autant de fois que vous le souhaitez.

Existe-t-il des plugins pour exporter des blocs Gutenberg?

Oh oui, et j’en ai trouvé un par ThemeIsle, un développeur WordPress réputé. Il s’agit d’un plugin gratuit appelé Blocs Export Import. Essentiellement, le plugin vous permet de sauter tout ce tutoriel. Oui c’est vrai; vous n’avez même pas besoin de créer des blocs réutilisables.

Installez et activez le plugin, puis ouvrez l’éditeur Gutenberg. Concevez votre bloc comme vous le souhaitez, puis cliquez sur le Plus d’options icône. Ensuite, appuyez sur le Exporter JSON, comme indiqué ci-dessous. Voici la capture d’écran:

Comment exporter et importer des blocs Gutenberg dans WordPress 10

Cela télécharge le fichier JSON sur votre ordinateur. Pour importer le fichier JSON à l’aide du plugin, ouvrez l’éditeur Gutenberg. Ensuite, cliquez sur le Ajouter un bloc icône, puis Importer des blocs depuis JSON sous le Widgets languette:

Comment exporter et importer des blocs Gutenberg dans WordPress 11

Après cela, cliquez sur Choisir le fichier pour sélectionner le fichier sur votre ordinateur et appuyez sur le Télécharger bouton:

Comment exporter et importer des blocs Gutenberg dans WordPress 12

Le seul problème avec la méthode du plugin est que vos blocs ne seront pas enregistrés sur votre site WordPress. Pour enregistrer des blocs dans votre base de données WordPress, vous devez utiliser la méthode manuelle. Peut-être que cela changera à l’avenir.

Malheureusement, je n’ai pas pu trouver un autre plugin. Pourtant, le plugin peut vous faire gagner beaucoup de temps si vous ne vous souciez pas d’enregistrer des blocs réutilisables sur votre site Web. Vous aurez les blocs sous forme de fichiers JSON sur votre ordinateur.


Les blocs réutilisables de Gutenberg sont une bouée de sauvetage. Ils vous permettent de répliquer rapidement des modèles et des fonctionnalités, car vous ne partez pas de zéro. Si vous créez beaucoup de publications / pages et / ou sites Web, apprendre à exporter des blocs Gutenberg sera très utile.

Vous avez des questions ou des suggestions sur les blocs Gutenberg? Veuillez nous en informer dans les commentaires ci-dessous.

Partagez cet article

Newsletter

Inscrivez-vous à notre newsletter pour profiter de toutes nos astuces !

Laissez une réponse

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