web-dev-qa-db-fra.com

WordPress oEmbed W3C Validation

J'ai récemment construit un thème qui utilise la fonctionnalité oEmbed de WordPress.

Dans la mesure du possible, j'aime que mes thèmes soient validés via W3C. Le contenu du site Web est basé sur les vidéos Vimeo, je reçois donc plus de 30 erreurs de validation.

L'outil de validation signale les attributs suivants:

frameborder
webkitallowfullscreen
mozallowfullscreen

Je suis conscient du fait que l'attribut allowfullscreen est requis pour les lecteurs HTML5, mais je me suis demandé s'il existe une solution qui réussira la validation.

Je peux voir que webkitallowfullscreen et mozallowfullscreen ne sont plus nécessaires: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe

validationoembed
3
Sam

Le fichier class-oembed.php révèle certains des filtres disponibles concernant les oEmbeds.

Nous pouvons utiliser les filtres oembed_result _ ou oembed_dataparse pour modifier le code HTML extrait de Vimeo avant sa mise en cache dans le méta de publication. Voici un exemple pour ce dernier:

add_filter( 'oembed_dataparse', function( $return, $data, $url )
{
    // Target only Vimeo:
    if(
            is_object( $data ) 
        &&  property_exists( $data, 'provider_name' )
        &&  'Vimeo' === $data->provider_name
    )
    {
        // Remove the unwanted attributes:
        $return = str_ireplace(
            array( 
                'frameborder="0"', 
                'webkitallowfullscreen', 
                'mozallowfullscreen' 
            ),
            '',
            $return
        );
    }
    return $return;
}, 10, 3 );

Exemple:

Avant:

<iframe src="//player.vimeo.com/video/32001208" 
        width="584" 
        height="329" 
        frameborder="0" 
        title="Earth" 
        webkitallowfullscreen 
        mozallowfullscreen 
        allowfullscreen></iframe>

Après:

<iframe src="//player.vimeo.com/video/32001208" 
        width="584" 
        height="329"  
        title="Earth"   
        allowfullscreen></iframe>

Notes complémentaires sur xhtml:

Si vous extrayez la API Vimeo oEmbed , il existe un paramètre xhtml avec le xhtml=false par défaut. Vous pouvez essayer par exemple:

https://vimeo.com/api/oembed.json?url=https%3A//vimeo.com/32001208

vs.

https://vimeo.com/api/oembed.json?url=https%3A//vimeo.com/32001208&xhtml=true

Donc au lieu de:

webkitallowfullscreen mozallowfullscreen allowfullscreen

on a:

 webkitallowfullscreen="webkitallowfullscreen" 
 mozallowfullscreen="mozallowfullscreen" 
 allowfullscreen="allowfullscreen"

Si nous voulons viserXHTMLvalidation, nous pourrions essayer de le modifier via le oembed_remote_get_args, par exemple. Mais je n'ai pas testé cela.

5
birgire