web-dev-qa-db-fra.com

Définissez l'attribut wmode sur transparent pour le shortcode incorporé afin de faire passer le menu déroulant sur YouTube incorporé dans Internet Explorer.

Lorsque vous survolez mon menu déroulant avec IE8 ou IE9, le menu div apparaît derrière l’intégration de YouTube. Cela fonctionne bien sur tous les autres navigateurs.

Après des recherches, j'ai découvert que beaucoup d'autres avaient le même problème et la solution consiste à définir l'attribut wmode sur transparent. Donc, par exemple, <iframe width="578" height="325" src="http://www.youtube.com/embed/XXXX?wmode=transparent"></iframe> ou <param name="wmode" value="transparent" />.

Ma question est la suivante: comment ajuster le shortcode Wordpress [embed] pour définir l'attribut wmode sur transparent?

shortcodeembedvideosyoutubeoembed
3
Christine Cooper

Vous pouvez filtrer la sortie HTML pour oEmbed avec oembed_result. Maintenant, testez l'hôte HTTP de l'URL pour www.youtube.com et ajoutez le paramètre.

Le résultat oEmbed est mis en cache dans un champ méta post afin d'éviter un trop grand nombre de demandes. Pour mettre à jour d'anciennes publications, j'ai ajouté un assistant d'activation qui efface uniquement le contenu mis en cache pour Youtube.

<?php  # -*- coding: utf-8 -*-
/* Plugin Name: Add 'wmode' to video embeds */

register_activation_hook( __FILE__, 't5_clear_oembed_cache' );
add_filter( 'oembed_result', 't5_oembed_wmode', 10, 2 );

/**
 * Add "wmode=transparent" query string to youtube embeds.
 *
 * @wp-hook oembed_result
 * @param   string $html
 * @param   string $url
 * @return  string
 */
function t5_oembed_wmode( $html, $url )
{
    if ( 'www.youtube.com' !== parse_url( $url, PHP_URL_Host ) )
        return $html;

    return str_replace( '=oembed', '=oembed&amp;wmode=transparent', $html );
}

/**
 * Clear oEmbed cache for all youtube embeds.
 *
 * @return void
 */
function t5_clear_oembed_cache()
{
    global $wpdb;

    $posts = $wpdb->get_results(
        "SELECT post_id, meta_key
            FROM  `$wpdb->postmeta`
            WHERE  `meta_key` LIKE  '_oembed%'
                AND `meta_value` LIKE  '%youtube%'"
    );

    if ( ! $posts )
        return;

    /*
    return print '<pre>$posts = ' . htmlspecialchars( print_r( $posts, TRUE ), ENT_QUOTES, 'utf-8', FALSE ) . "</pre>\n";
    /*/
    foreach ( $posts as $post )
        delete_post_meta( $post->post_id, $post->meta_key );
    /**/
}

Sachez que cet attribut rend les vidéos inaccessibles aux utilisateurs de lecteurs d'écran , afin qu'ils ne puissent pas les écouter. La meilleure option serait donc d’utiliser plutôt la sortie HTML5 de Youtube.

4
fuxia

C'est une idée terrible car les films Flash avec wmode transparent ne sont plus disponibles pour les utilisateurs aveugles avec des lecteurs d'écran. Les aveugles aiment écouter des vidéos avant que ce vieux marron ne revienne. Utilisez la vidéo HTML5 intégrée pour que tout le monde et les utilisateurs d’Internet Explorer 8 obtiennent un lien vers youtube. Ne faites pas souffrir votre accessibilité parce que les anciens IE étaient terribles avec l'intégration.

2
user30934