Tag

snippets

Browsing

Le problème : le code des vidéos n’est pas valide en HTML5

Voici ce que le code oEmbed de WordPress donne par défaut avec un lien Youtube :

Or le petit problème, c’est que tout cela n’est pas vraiment valide au niveau W3C et je commence à me lasser de voir ces erreurs de validation sur toutes les pages du site avec des vidéos :

Erreur 1 : Attribute allowfullscreen not allowed on element iframe at this point.
Erreur 2 : The frameborder attribute on the iframe element is obsolete. Use CSS instead.

La solution : filtrer le rendu oEmbed de WordPress pour purifier le code

Voici donc la solution que j’ai mise en place sur le site : je filtre le code oEmbed de WordPress de manière à retirer le tag allowfullscreen qui n’a rien à faire là et à supprimer l’attribut frameborder, que je remplace par un style="border: none" :

  1. éditez le fichier functions.php de votre thème
  2. ajoutez-y cette fonction :
  3. enregistrez le fichier.

Notez que WordPress cache les résultats oEmbed dans la table postmeta donc après avoir installé ce code et si vous voulez vérifier que cela fonctionne, éditez un article pour que le postmeta se mette à jour.

Voilà, vos pages avec vidéos YouTube devraient maitenant être valides.

J’utilise le plugin Comment Form Quicktags sur le site pour simplifier la vie de celles et ceux qui souhaitent laisser des commentaires. Un petit clic et hop, on peut mettre en page son commentaire facilement.

Ce plugin présente un problème : les quicktags ne sont affichés qu’aux utilisateurs enregistrés (membres du site). Or l’intérêt d’un tel plugin est d’être accessible à tout le monde, membre ou simple visiteur occasionnel.

Voici comment le modifier pour que tous puissent y avoir accès :

  1. éditez le fichier comment-form-quicktags.php
  2. recherchez la fonction can_quicktag()
    	/**
    	 * Check capabilities.
    	 */
    	function can_quicktag() {
    		return !$this->options['cap_check'] || ($this->options['cap_check'] && current_user_can($this->cap));
    	}
  3. modifiez-la comme ceci :
    	/**
    	 * Check capabilities.
    	 */
    	function can_quicktag() {
    		/* Universal Quicktags Fix by Matt (skyminds.net) */
    		//return !$this->options['cap_check'] || ($this->options['cap_check'] && current_user_can($this->cap));
    		return TRUE;
    	}

Et voilà : les quicktags sont maintenant utilisables par tous les visiteurs.

Spelling error report

The following text will be sent to our editors: