Comment créer un site Web ou un blog en 2020 - Guide gratuit et facile pour créer un site Web

WordPress oEmbed : intégrez (presque) tout

Il est facile de placer des vidéos, des images, des tweets et de nombreux autres types de supports externes sur votre site Web WordPress avec oEmbed. Les plugins WordPress sont la vie du système et plus que jamais, il existe un plugin pour presque tout. Mais c’est bien de pouvoir faire des travaux sans utiliser de plugins supplémentaires.

La plupart des tâches que WordPress oEmbed peut faire pour vous maintenant, dans le passé auraient été effectuées à l’aide d’un plugin WordPress, l’équipe de développement derrière WordPress semble assez déterminée à faire en sorte que oEmbed prenne en charge de plus en plus de types de médias riches, ce qui est génial nouveau pour les utilisateurs.

Qu’est-ce qu’oEmbed ?

En termes simples, WordPress oEmbed reconnaît les URL de divers services pour les formater et les afficher automatiquement. Par exemple, des vidéos Youtube, de l’audio SoundCloud ou même des publications WordPress. Lorsque WordPress verra l’URL, il se connectera au service externe (comme Youtube) et demandera le code HTML approprié pour intégrer la vidéo sur la page ou la publication.

Vous n’avez plus besoin de copier-coller pour obtenir le code d’une vidéo. Vous pouvez littéralement mettre l’URL de la vidéo ou d’un autre média directement sur votre article ou page WordPress et cela fonctionne.

À quoi peut servir WordPress oEmbed ?

Bien qu’oEmbed existe depuis un certain temps dans WordPress, depuis la version 2.9. Mais depuis lors, ils ont ajouté un certain nombre de nouveaux services qui fonctionnent avec oEmbed, donc la liste s’allonge de plus en plus.

Tous les services vidéo comme Youtube, Vimeo et même Hulu sont pris en charge. Les sites de photos comme Instagram, Flickr et Photobucket fonctionnent très bien. Même les sites sociaux comme Twitter et Facebook ils sont compatibles. Heck, vous pouvez même ajouter vos articles de blog.

Pour une liste complète des 36 services oEmbed, rendez-vous sur cette page du Codex WordPress.

Comment utiliser oEmbeds dans l’éditeur classique

Pour ceux d’entre vous qui utilisent l’éditeur classique, collez simplement les liens de votre choix dans l’éditeur de texte enrichi. Donc, si vous souhaitez partager la liste de lecture Mellow Indie Chill de SoundCloud, vous devez d’abord obtenir l’URL :

https://soundcloud.com/soundcloud-scenes/sets/coffee-shop-mellow-indie-chill

Collez-le ensuite dans la zone de texte principale et vous verrez ceci :

Super, hein ?

Il y a une chose à retenir lors de l’utilisation d’oEmbeds dans l’éditeur WordPress classique : l’URL du les médias doivent être sur une ligne par eux-mêmes. Vous n’avez pas besoin de basculer vers l’éditeur de texte ou quoi que ce soit, n’oubliez pas de cliquer sur Entrée pour que ce soit sur une ligne à part.

Comment utiliser oEmbeds dans Gutenberg

Si vous utilisez Gutenberg, l’ajout d’oEmbed est un peu différent, car il existe un bloc spécifiquement pour les ajouter. Pour commencer, vous pouvez trouver le bloc pour votre type de média spécifique (Gutenberg propose plusieurs options de bloc) ou simplement rechercher le bloc Insérer.

WordPress oEmbed dans Gutenberg

Ajoutez ensuite votre lien :

Bloc WordPress oEmbed Gutenberg

Et puis cliquez sur le bouton pour intégrer. Le bloc identifiera l’intégration et l’affichera en conséquence, comme indiqué ci-dessous :

Affichage WordPress oEmbed Gutenberg

C’est tout!

Contrôler la taille des objets incorporés

Voici une astuce supplémentaire à noter. WordPress s’appuie sur un paramètre de largeur de contenu pour contrôler la largeur d’un objet intégré. Certains thèmes WordPress auront déjà cet ensemble et il correspondra à la largeur du contenu affiché.

Si vous avez un thème qui ne prend pas en charge cette largeur, il est très facile de l’ajouter vous-même.

if ( ! isset( $content_width ) ) {
	$content_width = 600;
}

Vous pouvez le mettre en toute sécurité dans le fichier function.php de votre thème.

WordPress recommande également d’ajouter un peu de CSS à votre thème :

.size-auto, 
.size-full,
.size-large,
.size-medium,
.size-thumbnail {
	max-width: 100%;
	height: auto;
}

Fondamentalement, ce qu’il fait, c’est vérifier si la largeur a été définie, et sinon, il la définit à 550 (pixels). Remplacez simplement le numéro par celui qui convient à votre situation.

Sur la base de cette valeur, WordPress l’utilisera comme largeur pour tous les oEmbeds qu’il voit maintenant. Il est suffisamment intelligent pour calculer la hauteur en fonction de la largeur que vous fournissez, vous n’avez donc pas à vous soucier de régler la hauteur.

oEmbed est une excellente fonctionnalité et je l’utilise tout le temps. C’est génial pour les utilisateurs finaux de WordPress, plus de soucis avec les plugins et les paramètres compliqués, il suffit de déposer l’URL du média sur la page et le tour est joué.

Allez l’essayer sur votre site WordPress maintenant !