Insérer des iframes dans l’éditeur WYSIWYG de WordPress

Avec l’adoption de plus en plus importante du HTML5 dans les navigateurs, et la prise en charge de la vidéo sans plugin comme Flash, les sites proposant du contenu à intégrer tels que Youtube et Dailymotion, donnent maintenant le choix de la méthode d’insertion. Auparavant, pour intégrer un player Flash, il fallait copier plusieurs lignes de code avec les balises OBJECT et EMBED afin de rester compatible avec les différents navigateurs. Aujourd’hui, l’insertion consiste à copier une balise IFRAME ( sans compter quelques liens parfois )  et permet aux sites de partage de vidéos d’adapter la technologie du player suivant le navigateur utilisé. YouTube propose dès maintenant la nouvelle méthode avec IFRAME par défaut, et relègue au rang “d’ancien code d’intégration” la méthode “OBJECT”. Dailymotion a aussi une méthode par IFRAME mais en bêta, motivée par la compatibilité que cela apporte avec les navigateurs mobiles d’Apple notamment. Malheureusement, Tinymce, l’éditeur WYSIWYG embarqué de WordPress, supprime automatiquement la balise IFRAME. Le code suivant, à placer dans le fichier functions.phpde votre thème, va permettre d’ajouter le tag IFRAME et ses attributs à la liste des tags autorisés. Attention, tout de même : les vidéos intégrées par IFRAME ne sont pas ( encore ? )  supportées par tous les agrégateurs de flux RSS.

 /** * autorise les IFRAME dans tinymce */ function add_iframe($initArray) { $initArray['extended_valid_elements'] = "iframe[id|class|title|style|align|frameborder|height|longdesc|marginheight|marginwidth|name|scrolling|src|width]"; return $initArray; } // cette fonction modifie le filtre de l'éditeur add_filter('tiny_mce_before_init', 'add_iframe'); 

 

 

 

 

 

 

vu sur le forum de wordpress.org

add_filter('tiny_mce_before_init', 'sfx_tiny_mce_before_init'); function sfx_tiny_mce_before_init($init) { $init["extended_valid_elements"] = "iframe[id|class|title|style|align|frameborder|height|longdesc|marginheight|marginwidth|name|scrolling|src|width]"; return $init; }
Cette entrée a été publiée dans blog, dev et taggé . Ajoutez le permalien à vos favoris.