Comment supprimer le texte «Facebook social plugin»?

J’utilise les commentaires de Facebook Social Plugin Lorsque je l’ai intégré, le script a créé un iFrame contenant le texte “Facebook Social Plugin” avec le logo de Facebook en bas (voir l’image ci-dessous).

J’ai inspecté l’élément à l’aide de Firebug et j’ai essayé de définir sa classe pour display:none; dans mon fichier CSS. Cependant – cela ne le cache pas (je suppose que c’est parce que c’est dans son propre iFrame). Comment utiliser CSS ou jQuery (ou toute autre méthode) pour désactiver ce texte?

Merci!

Plugin social Facebook

Vous compliquez les choses trop. Petit changement CSS …

 .fb_iframe_widget{overflow: hidden;} .fb_ltr{margin-bottom: -20px;}

Terminé!

Sidenote – Je suis d’accord avec l’avertissement concernant les problèmes juridiques. Tu ne devrais pas vraiment faire ça.

Vous ne pouvez contrôler que les options proposées par le développeur du plugin (ici, Facebook). La plupart des développeurs de plugins n’autorisent pas la modification de leur code et Facebook en est un. Je vous suggère de vous en tenir à ce que Facebook vous fournit.

Ayez une lecture de ce qui suit:

Centre de droits de marque
Politiques de la plateforme Facebook

S’il s’agit d’un problème CSS pour l’iFrame, vous ne pouvez rien y faire (par exemple: le remplacer). Il se charge depuis un autre site afin que vous n’ayez pas le contrôle sur celui-ci.

J’ai rencontré ce problème aussi. Je l’ai corrigé en définissant la hauteur de l’iframe à l’aide d’un style en ligne et en définissant le débordement sur masqué.

Exemple: iframe est 185px. Ajouter ceci en ligne:

style = “débordement: caché; hauteur: 160px;”

Voir l’exemple iframe dans la description de la méthode .contents() .

Vous pouvez facilement accéder à la DIV (ou autre chose) et modifier le CSS correspondant, ou manipuler de toute autre manière.

 .fb_iframe_widget {overflow: hidden;} div.fb-comments.fb_iframe_widget span {margin-bottom: -35px;}

Css

 .facebookOuter { width:248px; padding:10px 0px 10px 10px; height:230px; overflow:hidden; } .facebookInner { height:250px; width: 238px; overflow: hidden; }

Et comme boîte

Si vous jouez avec les dimensions de la boîte, vous pouvez la faire disparaître d’elle-même, et vous n’avez même pas cassé leurs termes techniquement, parce que vous n’avez pas modifié leur code en utilisant vos propres hacks. =)

Exemple:

entrez la description de l'image ici

Les dimensions sur celui-ci sont 310×382. Vous pouvez toujours le voir pointer du nez, mais c’est assez caché pour que quiconque jette un coup d’œil sur votre page ne le remarque pas vraiment. Et comme la plupart des surfeurs ont tendance à lire rapidement …

J’ai utilisé le code suivant pour m’en débarrasser. Il semble que ce soit le plus récent qui fonctionne. Il suffit de changer le fond de la marge à votre convenance.

 .fb_iframe_widget { overflow: hidden; } .fb_iframe_widget span { margin-bottom: -30px; }

Les autres solutions ont pour effet secondaire de faire basculer les choses. Voici une solution Less / Sass / SCSS qui tient compte de la liste déroulante:

 div.fb_iframe_widget span { overflow: hidden; margin-top: -32px; iframe { top: 32px; } }

Ils ont mis l’iframe en position: absolute , sans doute pour réduire vos chances de réussir cela. Cela rend top facile à définir, et le tour est joué.

Ils ont également défini leur iframe sur débordement: hidden, vous pouvez donc l’attaquer avec un style plus court si vous préférez et vous retrouver avec un espace plus important en bas de la zone de commentaires:

 div.fb_iframe_widget iframe { box-sizing: border-box; padding-bottom: 32px; }

Chomp.