Obținerea butonului Facebook Like (generat de JS) pentru a apărea

Folosesc caseta Light PrettyPhoto pentru o galerie de imagini. Atunci când apare imaginea, butoanele Twitter și Facebook apar sub ea. Asta este construit în pluginul PrettyPhoto și funcționează bine.

Problema este că butonul Facebook este tipul iframe (care nu permite utilizatorului să introducă un comentariu). Vreau să îl înlocuiesc cu butonul HTML5 (care deschide o casetă de comentarii atunci când faceți clic pe el, în loc să vă placă doar).

Vreau să le înlocuiesc (codul FB standard pentru butonul iframe):

<div class="facebook"><iframe src="//www.facebook.com/plugins/like.php?locale=en_US&href='+pp_real_links[set_position]+'&layout=button_count&show_faces=true&width=500&action=like&font&colorscheme=light&height=23" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:23px;" allowTransparency="true"></iframe></div>

... cu acest (codul standard fb pentru butonul HTML5 ca):

<div class = "fb-like" date-href = "instagram.com/the-pic" date-send = "false" data-layout = faces = "false"> text test </div>

Când fac înlocuirea, nu se afișează în caseta de lumină. Funcționează însă oriunde altundeva pe site.

Și, da, am înlocuit codul prettyPhoto CSS pentru .facebook cu .fb-like . Am pus, de asemenea, un text în div pentru a verifica că apare în locul potrivit.

Cred că rădăcina problemei este că codul de legătură socială este definit în JS; în setările PrettyPhoto, există un atribut numit "markup" care stochează html pentru butoanele lightbox și share. Deci, probabil, nu se conectează la codul FB JS.

Care este soluția?

0

1 răspunsuri

Codul pe care l-ați postat (vechiul iframe) nu necesită utilizarea facebook JavaScript sdk deoarece încarcă doar iframe-ul.

Pe de altă parte, codul html5 pe care doriți să-l utilizați are nevoie de sdk pentru a-l face, vedeți fb-like div este doar un container în care sdk introduce o nouă iframe.

Din codul dvs. nu pot spune dacă încărcați jsdd, dacă nu încărcați/inițiți-l așa cum este descris în documentație, asigurați-vă că includeți atributul xfbml :

FB.init({
    appId      : 'YOUR_APP_ID',//App ID
    channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html',//Channel File
    status     : true,//check login status
    cookie     : true,//enable cookies to allow the server to access the session
    xfbml      : true //parse XFBML
});

If you are already using the JS sdk then it should work, unless the like button code is added dynamically after the sdk has finished loading and initializing.
If that's the case then just use the FB.XFBML.parse method:

FB.XFBML.parse();

// or you can pass the container element:
FB.XFBML.parse(document.getElementById(ELEMENT_ID));
0
adăugat
Mulțumiri! Adăugarea FB.XFBML.parse (); a rezolvat problema.
adăugat autor bevanb, sursa
JavaScript, România - Moldova
JavaScript, România - Moldova
328 participanți

Comunitatea Română JavaScript: github.com/js-ro Pentru confort, opriți notificările. Parteneri: @node_ro, @php_ro, @python_ro, @seo_ro, @RomaniaGroup, @ai_ro, @Grupuri_IT Offtop: @holywars_ro Joburi: @js_jobs_ro Sponsored with ❤️ by ciupacabra.com