WordPress : mettre à jour le code Youtube

Le code des plateformes – vidéos ou autre – évolue et il n’est pas rare de tomber sur de vieux articles qui embarquent un vieux code embed pour afficher des vidéos.

Si votre site a quelques années, il y a plusieurs méthodes d’intégration – plus ou moins optimisées – dont certaines ne s’afficheront pas (celles utilisant le plugin Flash par exemple) sur une tablette ou un smartphone.

youtube

Sur SkyMinds, je me suis dit que ce serait sympa d’avoir un système unifié : toutes les vidéos YouTube seront automatiquement insérées par WordPress en utilisant la méthode native, à savoir oEmbed.

Pour ce faire, j’utilise le plugin Search Regex qui permet d’intervenir facilement sur la base de données pour effectuer des changements en masse, tout en proposant la visualisation des changements avant que ces derniers ne soient appliqués.

Toutes les manipulations sont à effectuer avec Search Regex, en activant la case regex. Je me sers du signe dièse (#) comme délimiteur pour les expressions régulières.

Remplacer le vieux code d’intégration flash de YouTube

Avec Search Regex, on cherche :

<object [^>]*><param name="movie" value="https:\/\/www\.youtube\.com\/v\/([^"&?]+)">.*?<\/object>Code language: HTML, XML (xml)

Et on remplace par :

https://www.youtube.com/watch?v=$1Code language: JavaScript (javascript)

Remplacer le code flash validé de YouTube

On recherche avec le drapeau regex activé :

<object.*?youtube\.com\/v\/(.*?)["&?].*?<\/object>

et

<iframe[^>]+src="https:\/\/www\.youtube\.com\/embed\/([^"?]+)[^"]*"[\s\S]*?<\/iframe>Code language: PHP (php)

Et on remplace par :

https://www.youtube.com/watch?v=$1Code language: JavaScript (javascript)

Remplacer le code flash de YouTube-NoCookie

On recherche avec le drapeau regex activé :

<object[^>]+?data="https?:\/\/www\.youtube-nocookie\.com\/v\/([^"&?\/\s]+)[^"]*".*?<\/object>

et

<iframe.*?youtube-nocookie\.com\/embed\/(.*?)["?].*?<\/iframe>Code language: JavaScript (javascript)

Et on remplace par :

https://www.youtube.com/watch?v=$1Code language: JavaScript (javascript)

Voilà, ce sont tous les bouts de code différents que j’ai trouvé chez moi. L’intérêt d’utiliser la fonction oEmbed native est aussi de pouvoir filtrer le code que renvoie YouTube à l’appel d’une vidéo, ce qui est beaucoup plus facile à maintenir à l’échelle d’un site.

Maintenant, vous pouvez rendre le nouveau code HTML5 de vos oEmbed valide facilement.

Rencontrez-vous des défis avec votre site WordPress ou WooCommerce? Laissez-moi les résoudre pour vous.

Discutons des solutions possibles »

Articles conseillés :

Matt

Matt Biscay est développeur WordPress et WooCommerce certifié chez Codeable, ainsi que sysadmin qualifié et enseignant-chercheur. Passionné par le code performant et les solutions sécurisées, je m'efforce d'offrir une expérience utilisateur exceptionnelle sur chaque projet.

Vous avez aimé cet article ? Vous avez un projet en tête et vous pensez que je pourrais vous aider à le concrétiser ? N'hésitez pas à me contacter, je serais ravi de discuter avec vous de votre projet !

1 pensée sur “WordPress : mettre à jour le code Youtube”

Opinions