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.

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.