Networks dev.ModulesHTML5

Facebook - Embedded Videos

Note : Module HTML5. L'installation du script Facebook SDK dans le blog est requis.


Les paramètres du module

Attribut Valeur Signification
class fb-post Syntaxe HTML5
data-href https://www.facebook.com/ Adresse de la vidéo Facebook
data-width Largeur du module.
De 220 à 750 pixels.
Valeur par défaut : 500px.
data-show-text
  • true
  • false
Intégration du texte de la publication Facebook.
data-allowfullscreen
  • true
  • false
Autoriser la lecture de la vidéo en mode plein écran.
data-autoplay
  • true
  • false
Démarrage automatique de la vidéo (sans son).


Exemple HTML

<div class="fb-video"
     data-href="https://www.facebook.com/radiocontact/videos/vb.194038183842/10153727389593843"
     data-width="650"
     data-show-text="true"
     data-allowfullscreen="true"
     data-autoplay="true">
</div>
Résultat :


Conversion XML

Le code officiel fourni par Facebook est un code HTML. Pour l'injecter dans l'éditeur XML de Blogger, certaines règles XML doivent être respectées :
  • Les double-quotes deviennent des single-quotes.
  • La balise d'ouverture devient la balise de fermeture : <div></div><div/>.

Chaque attribut contenant une expression Blogger doit être précédé du préfixe expr: et chaque expression doit ressortir un résultat correspondant à la valeur attendue dans l'attribut.

Exemple
<div class='fb-video'
     data-href='https://www.facebook.com/radiocontact/videos/vb.194038183842/10153727389593843'
     data-width='650'
     expr:data-show-text='EXPRESSION'
     data-allowfullscreen='true'
     data-autoplay='true'/>

Pour employer des valeurs variables en fonction de diverses conditions, certaines données et certains opérateurs peuvent être intégrés dans le code.
Vous choisissez les données à intégrer en fonction de l'emplacement du code dans le modèle.

<div class='fb-video'
     data-href='https://www.facebook.com/radiocontact/videos/vb.194038183842/10153727389593843'
     data-width='650'
     expr:data-show-text='datab:blog.isMobile ? false : true'
     data-allowfullscreen='true'
     expr:data-autoplay='data:blog.pageType == "index"'/>
Le texte de la publication ne sera pas affiché dans la version mobile.
La vidéo démarrera automatiquement dans les pages de type Index.
Dernière modification :

Posts les plus consultés de ce blog

DéveloppementsMulti-versions
Facebook : Bouton J'aime [Like button]
Populaire
ThéorieRéférences XMLParamètres des données
Le paramètre Image redimensionnable [isResizable]
Populaire
ThéorieRéférences XMLTypes des variables d'habillage
Variables d'habillage - Les arrière-plans [background]
Populaire