Comment commencer à utiliser WordPress Playground

Transcription

Bonjour, je suis Adam et je vais vous montrer comment utiliser WordPress Playground. Lorsque vous accédez à l’adresse playground.wordpress.net, vous obtenez un site WordPress entièrement fonctionnel dans votre navigateur. Utilisez-le à votre convenance pour tester les extensions et les thèmes, construire vos propres thèmes, et des sites complets.

Commençons par installer quelques extensions. J’accède au répertoire des extensions de WordPress et télécharge l’extension Gutenberg, l’extension Create Block Theme puis le thème Skatepark. Une fois ces fichiers téléchargés, je vais dans le menu Extensions, puis Ajouter une extension, et j’installe les extensions. La première chose que l’on peut remarquer est un message d’erreur indiquant que nous ne pouvons pas nous connecter au répertoire des extensions WordPress et ceci parce que Playground ne dispose pas d’accès à internet. C’est utile pour votre vie privée, mais cela signifie que nous n’obtiendrons pas de liste des extensions sur cet écran.

Bien, téléversons les extensions. Je cherche l’extension Gutenberg dont j’ai le fichier zip sur mon disque dur, pour le glisser-déposer ici. Ainsi je pourrais l’installer puis l’activer. Je fais la même chose pour l’extension Create Block Theme. Là encore, je vais déposer le fichier zip, puis l’installer et l’activer. Maintenant il est temps d’installer le thème Skatepark. C’est la même procédure que pour les extensions, je vais glisser-déposer le fichier ici puis l’installer. Maintenant nous pouvons activer notre thème. Voilà, nous venons de démarrer un nouveau site, d’installer quelques extensions, activé un thème et cela nous a pris environ une minute, pas mal.

Comme vous pouvez le voir l’éditeur Gutenberg est présent. Le bon thème est installé. Tout fonctionne. Cependant, c’était un peu lourd comme procédure. Voyons comment on peut automatiser le processus d’installation des extensions. Je vais rafraîchir l’ensemble du site et repartir sur de nouvelles bases. Il s’agit donc d’un nouveau Playground sur lequel aucun changement n’a été appliqué. Dans la barre d’adresse, je vais saisir point d’interrogation, theme égal skatepark, puis esperluette, plugin égal Gutenberg, esperluette plugin égal create tiret block tiret theme. Ce que cela va faire c’est télécharger et installer ce thème et ces deux extensions puis les activer pour moi. Nous avons donc maintenant la même configuration que précédemment, à la différence que nous n’avons presque rien eu à faire. Cela n’a pris que quelques secondes et maintenant nous avons un site avec les extensions et le thème que nous souhaitions.

Que pouvons-nous faire d’autre avec WordPress Playground. Et bien puisque nous avons l’extension Create Block Theme, nous pouvons construire un thème en entier dans WordPress Playground. Pour cela, activons le menu Apparence, puis Éditeur pour ouvrir l’éditeur de site. Et maintenant dans l’éditeur de site, nous allons personnaliser notre site. Ainsi je vais modifier la couleur d’arrière-plan du thème, et par exemple la hauteur des lignes et quelques polices de caractères et accélérer un peu le processus. À ce stade, vous êtes libre de personnaliser le thème comme vous le souhaitez.

Nous avons maintenant terminé. Voici notre thème personnalisé. Nous pouvons l’exporter en activant le bouton Options, puis le menu Create Block Theme, et en descendant un peu, accéder à la commande Exporter le zip. Je vais donc cliquer dessus et cela entrainera le téléchargement d’un fichier zip contenant le thème personnalisé que je peux installer sur n’importe quel site WordPress. Démarrons, un nouveau Playground et allons dans l’admin puis Apparence, Themes et installons notre nouveau thème personnalisé. Je vais le téléverser en utilisant le fichier que j’ai exporté à l’étape précédente. Une fois que je l’aurais installé et activé mon nouveau Playground aura exactement le même thème que celui que je viens de construire. Et je pourrais téléverser ce thème sur n’importe quel site WordPress dans le monde et l’installer. C’est exactement ce que je fais. Et vous aussi,  vous pouvez aller sur playground@wordpress.net et construire votre propre thème WordPress. 

Ne nous arrêtons pas là, et construisons un site complet. Il s’agit de la documentation de WordPress Playground. Recréons-la en utilisant notre nouveau thème personnalisé. Copier les choses est toujours un bon point de départ. Je vais donc copier toute cette section et la coller dans une composition. Trouvons la composition la mieux adaptée, celle-ci a des colonnes, c’est donc un bon choix. Je vais donc coller ce contenu ici, et ajouter une vidéo YouTube dans la colonne de droite, puis personnaliser la section d’entête du site et celle du pied de page. Je corrige quelques styles et retire les liens vers les réseaux sociaux et apporte quelques modifications ici et là. Et voilà, notre tout nouveau site ressemble à la documentation de WordPress Playground.

Mais, ce site existe uniquement dans mon navigateur. Sauvegardons-le donc sur mon ordinateur. Sur le site WordPress Playground, je vais cliquer sur l’icône Télécharger et cela va télécharger un fichier zip contenant l’intégralité de mon site WordPress. Je vais extraire le contenu et jeter un coup d’œil à l’intérieur. Ce répertoire WordPress contient tous les fichiers du cœur de WordPress. Et si j’explore le répertoire, je vais trouver le fichier SQLite de la base de données où sont stockés toutes mes pages et mes articles et la configuration de WordPress. Ce fichier zip contient un site WordPress complet. Je peux donc le prendre et l’héberger quelque part. Mais je peux aussi l’importer dans une autre instance de WordPress Playground. Et pour faire cela, je vais cliquer sur cette icône de téléversement. Je sélectionne ensuite le fichier wordpress-playground.zip, et clique sur Importer. Et voilà, mon site WordPress est maintenant là. Je n’ai plus besoin d’envoyer des captures d’écran ou des vidéos à mes amis ou clients,  je peux leur envoyer un véritable site WordPress et leur permettre de jouer avec de manière interactive dans leur navigateur. 

Examinons un autre aspect de WordPress Playground, à savoir les tests de compatibilité des extensions et des thèmes de notre site. Playground vous permet de basculer entre différentes versions de PHP et de WordPress. Sélectionnons la version 6.0 et installons le thème que nous avons créé plus tôt dans ce tutoriel. Sur le site, nous pouvons voir qu’il fonctionne, ce qui est très bien.

Mais ne nous arrêtons pas là. Testons également WordPress 5.9. Pour cela, je dois juste sélectionner cette version. Et maintenant nous avons un site WordPress en version 5.9. Essayons d’installer à nouveau ce même thème. Sélectionnons le bon fichier zip. Une erreur se produit. Le thème requiert WordPress 6.0 ou plus. Et tout ce que nous avons eu à faire pour le savoir était d’aller sur playground@wordpress.net et d’effectuer quelques clics. Nous n’avons pas eu besoin de créer 20 sites WordPress différents, cela n’a pris que quelques clics et quelques minutes.

J’espère que vous apprécierez WordPress Playground autant que moi,  et j’ai hâte de voir ce que vous allez construire avec lui.

Traduction: Jenny Dupuy

Suggestions

Found a typo, grammar error or outdated screenshot? Contact us.