{"id":69376,"date":"2021-10-31T07:44:19","date_gmt":"2021-10-31T07:44:19","guid":{"rendered":"https:\/\/blogging-techies.com\/fr\/wordpress-oembed-integrez-presque-tout\/"},"modified":"2021-10-31T07:44:19","modified_gmt":"2021-10-31T07:44:19","slug":"wordpress-oembed-integrez-presque-tout","status":"publish","type":"post","link":"https:\/\/blogging-techies.com\/fr\/wordpress-oembed-integrez-presque-tout\/","title":{"rendered":"WordPress oEmbed : int\u00e9grez (presque) tout"},"content":{"rendered":"

\n<\/p>\n

Il est facile de placer des vid\u00e9os, 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\u00e8me 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\u00e9mentaires.<\/p>\n

La plupart des t\u00e2ches que WordPress oEmbed peut faire pour vous maintenant, dans le pass\u00e9 auraient \u00e9t\u00e9 effectu\u00e9es \u00e0 l’aide d’un plugin WordPress, l’\u00e9quipe de d\u00e9veloppement derri\u00e8re WordPress semble assez d\u00e9termin\u00e9e \u00e0 faire en sorte que oEmbed prenne en charge de plus en plus de types de m\u00e9dias riches, ce qui est g\u00e9nial nouveau pour les utilisateurs.<\/p>\n

<\/span>Qu’est-ce qu’oEmbed ?<\/span><\/h2>\n

En termes simples, WordPress oEmbed reconna\u00eet les URL de divers services pour les formater et les afficher automatiquement. Par exemple, des vid\u00e9os Youtube, de l’audio SoundCloud ou m\u00eame des publications WordPress. Lorsque WordPress verra l’URL, il se connectera au service externe (comme Youtube) et demandera le code HTML appropri\u00e9 pour int\u00e9grer la vid\u00e9o sur la page ou la publication.<\/p>\n

Vous n’avez plus besoin de copier-coller pour obtenir le code d’une vid\u00e9o. Vous pouvez litt\u00e9ralement mettre l’URL de la vid\u00e9o ou d’un autre m\u00e9dia directement sur votre article ou page WordPress et cela fonctionne.<\/p>\n

<\/span>\u00c0 quoi peut servir WordPress oEmbed ?<\/span><\/h2>\n

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

Tous les services vid\u00e9o comme Youtube, Vimeo et m\u00eame Hulu sont pris en charge. Les sites de photos comme Instagram, Flickr et Photobucket fonctionnent tr\u00e8s bien. M\u00eame les sites sociaux comme Twitter et Facebook ils sont compatibles. Heck, vous pouvez m\u00eame ajouter vos articles de blog.<\/p>\n

Pour une liste compl\u00e8te des 36 services oEmbed, rendez-vous sur cette page du Codex WordPress.<\/p>\n

<\/span>Comment utiliser oEmbeds dans l’\u00e9diteur classique<\/span><\/h2>\n

Pour ceux d’entre vous qui utilisent l’\u00e9diteur classique, collez simplement les liens de votre choix dans l’\u00e9diteur de texte enrichi. Donc, si vous souhaitez partager la liste de lecture Mellow Indie Chill de SoundCloud, vous devez d’abord obtenir l’URL\u00a0:<\/p>\n

https:\/\/soundcloud.com\/soundcloud-scenes\/sets\/coffee-shop-mellow-indie-chill<\/pre>\n
Collez-le ensuite dans la zone de texte principale et vous verrez ceci\u00a0:<\/p>\n
Super, hein ?<\/p>\n
Il y a une chose \u00e0 retenir lors de l’utilisation d’oEmbeds dans l’\u00e9diteur WordPress classique : l’URL du les m\u00e9dias doivent \u00eatre sur une ligne par eux-m\u00eames<\/strong>.  Vous n’avez pas besoin de basculer vers l’\u00e9diteur de texte ou quoi que ce soit, n’oubliez pas de cliquer sur Entr\u00e9e pour que ce soit sur une ligne \u00e0 part.<\/p>\n
<\/span>Comment utiliser oEmbeds dans Gutenberg<\/span><\/h2>\n
Si vous utilisez Gutenberg, l’ajout d’oEmbed est un peu diff\u00e9rent, car il existe un bloc sp\u00e9cifiquement pour les ajouter.  Pour commencer, vous pouvez trouver le bloc pour votre type de m\u00e9dia sp\u00e9cifique (Gutenberg propose plusieurs options de bloc) ou simplement rechercher le bloc Ins\u00e9rer.<\/p>\n
\"WordPress<\/p>\n
Ajoutez ensuite votre lien\u00a0:<\/p>\n
\"Bloc<\/p>\n
Et puis cliquez sur le bouton pour int\u00e9grer.  Le bloc identifiera l’int\u00e9gration et l’affichera en cons\u00e9quence, comme indiqu\u00e9 ci-dessous\u00a0:<\/p>\n
\"Affichage<\/p>\n
C’est tout!<\/p>\n
<\/span>Contr\u00f4ler la taille des objets incorpor\u00e9s<\/span><\/h2>\n
Voici une astuce suppl\u00e9mentaire \u00e0 noter.  WordPress s’appuie sur un param\u00e8tre de largeur de contenu pour contr\u00f4ler la largeur d’un objet int\u00e9gr\u00e9.  Certains th\u00e8mes WordPress auront d\u00e9j\u00e0 cet ensemble et il correspondra \u00e0 la largeur du contenu affich\u00e9.<\/p>\n
Si vous avez un th\u00e8me qui ne prend pas en charge cette largeur, il est tr\u00e8s facile de l’ajouter vous-m\u00eame.<\/p>\n
if ( ! isset( $content_width ) ) {\r\n\t$content_width = 600;\r\n}<\/pre>\n
Vous pouvez le mettre en toute s\u00e9curit\u00e9 dans le fichier function.php de votre th\u00e8me.<\/p>\n
WordPress recommande \u00e9galement d’ajouter un peu de CSS \u00e0 votre th\u00e8me :<\/p>\n
.size-auto, \r\n.size-full,\r\n.size-large,\r\n.size-medium,\r\n.size-thumbnail {\r\n\tmax-width: 100%;\r\n\theight: auto;\r\n}<\/pre>\n
Fondamentalement, ce qu’il fait, c’est v\u00e9rifier si la largeur a \u00e9t\u00e9 d\u00e9finie, et sinon, il la d\u00e9finit \u00e0 550 (pixels).  Remplacez simplement le num\u00e9ro par celui qui convient \u00e0 votre situation.<\/p>\n
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 \u00e0 vous soucier de r\u00e9gler la hauteur.<\/p>\n
oEmbed est une excellente fonctionnalit\u00e9 et je l’utilise tout le temps.  C’est g\u00e9nial pour les utilisateurs finaux de WordPress, plus de soucis avec les plugins et les param\u00e8tres compliqu\u00e9s, il suffit de d\u00e9poser l’URL du m\u00e9dia sur la page et le tour est jou\u00e9.<\/p>\n
Allez l’essayer sur votre site WordPress maintenant !<\/p>\n  
\n
\n
Table of Contents<\/p>\nToggle<\/span><\/path><\/svg><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n