The code I use to render share button is:
<a name="fb_share" share_url="http://www.XYZ.com" type="button_count"></a>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"
type="text/javascript">
</script>
The above code exists in the page and works fine and when users clicks a button, that action will add the above code (with a different url) to the dom and My goal is to render another facebook button with count. However the problem is that the FB.Share js seems to somehow know it has already did the job and will not render again.
After poking around with the FB.Share script a bit I found this methoe FB.Share.renderAll() can force a re-render but without count numbers.
Anyone has any insights? Thanks!
try calling the JavaScript SDK's FB.XFBML.parse();
See: http://developers.facebook.com/docs/reference/javascript/FB.XFBML.parse/
When you re-add facebook share script, it renders again the share button.
for example: $.getScript("http://static.ak.fbcdn.net/connect.php/js/FB.Share");
Related
I'm trying to make all picture posts on my homepage not clickable, so they can't link to the permalinks. (I just want them to stay as miniatures with the hover cycle effect already provided by the theme)
I've tried removing {LinkOpenTag} and {LinkCloseTag} from:
{block:Photo}
<div class="wide-sizer">
<div class="image">
{LinkOpenTag}
<img src="{block:PermalinkPage}{PhotoURL-HighRes}{/block:PermalinkPage}{block:IndexPage}{PhotoURL-500}{/block:IndexPage}" alt="{PhotoAlt}"
data-high-res="{PhotoURL-HighRes}"
data-width="{PhotoWidth-HighRes}"
data-height="{PhotoHeight-HighRes}"
/>
{LinkCloseTag}
</div>
But photos and photosets are still clickable.
This is my page: http://woodstudiofr.tumblr.com
I'm using the "Spectator Theme".
UPDATE: ok so i tried removing as data-permalink={Permalink}as lharby suggested, but now all the links redirect to /undefined.
Any ideas?
thanks again for your time !
As mentioned in my comment, the data-permalink attribute has been removed, but there is still some custom javascript which is casing the url to be returned undefined.
Go to the bottom of your template, before the closing <body> tag and add this code:
<script type="text/javascript">
$(document).ready(function(){
$('.post').unbind('click').click(function(){});
});
</script>
(Basically instead of binding the post to a click function which is in the custom javascript we are now attempting to unbind it on click).
I tested it in the browser and it looks to be working (although a couple of other methods I thought would work didn't).
EDIT
In order to change the cursor on the post element. Remove the clickable class from the .post div from the template (if you can, if it is hard coded in).
Alternatively inside the style tags at the bottom, add the following css:
.post-grid .post.photo.clickable a,
.post.clickable {
cursor: default;
}
I got the code for the Facebook share button code right from facebook, it is as this:
<div class="fb-share-button" data-href="http://example.com/item/sharefb/47"></div>
While on a regular page, it works fine. It renders it assyncrhonously and for each item on the page working great.
But inside a fancybox ajax call, the button simply won't work. Facebook API will not process it, and the div will not turn into facebook's iframe full of stuff.
Any hints?
You need to parse the button after opening the box:
FB.XFBML.parse();
Source: https://developers.facebook.com/docs/reference/javascript/FB.XFBML.parse
I'm trying to debug/troubleshoot why the content that is displayed in the share link/window continues to show our browser detection content which we do not want displayed. I've updated our code to detect the Facebook crawler and not show this content if it's detected but the share link is still showing this. I've even tried to use the Facebook debugger to refresh the cache but it is still not working.
The share button code I'm using is this:
<div class="fb-like"
data-href="https://www-dev.hoopladigital.com/title/11042831"
data-layout="button_count"
data-colorscheme="dark"
data-action="like"
data-show-faces="true"
data-share="true"></div>
So either the cache is not being cleared, or my browser detection code is still getting executed when it shouldn't be. The text pointed to in the arrow in this screenshot should not be getting displayed.
How do I go about troubleshooting this?
http://note.io/LvbN5K
Your og:description is empty, so most likely Facebook takes the first text content that looks relevant to it … so provide a description!
I am using wordpress for my website and I am trying to set up my pages so that a user has to click a button to view the content. Yes, very simple with show/hide etc but the button I Want the user to click is this http://www.facebook.com/plugins/like.php
To display that in my page i need to use an iframe which is where it gets tricky. I have set up the show/hide code so that when a user clicks the like button (or anywhere in the iframe) it will display the content. But, no such luck!
This is my code
<div id="imagebox" style="display:none;"><?php $image = wp_get_attachment_image_src(get_field('image'), 'full'); ?>
<img src="<?php echo $image[0]; ?>" alt="<?php get_the_title(get_field('image')) ?>" /> </div>
<div onclick="ShowDiv()"><iframe src="http://www.facebook.com/plugins/like.php? href=http://www.facebook.com/BrandBang&" allowTransparency="true">
</iframe></div>
<script language="javascript">
function ShowDiv()
{
document.getElementById("imagebox").style.display = '';
}
</script>
I know that it is hard to use iframes to do what I am trying to do, but i am a total newbie when it comes to this stuff. Any help would be great!
Have tried giving your div an id="imagebox"?
EDIT:
This was already answered here.
But, I didn't realize at first sight that you're loading something in the iframe that is not coming from your own domain, so you're going to fall in a cross site scripting event, which is not allowed.
Afaik, you have to redesign some way your implementation.
For instance, you could retrieve the generated html from facebook using curl and then outputting in your own div. Something like that should work.
is it possible to create simple Like button for fan page? When I create official Like button, insert my fan page URL in form, it always generate button with image and page title as it is Like box not Like button. I just want simple Like button only with "Like" label and users count.
Is this an issue or default behavior, or just my misunderstanding?
Thanks for advice
Tomas Teicher
Did you mean you want this button?
http://developers.facebook.com/docs/reference/plugins/like
Alternatively, you may use AddThis widget - They even provide analytics for you.
http://www.addthis.com/
I use the widget on this website: http://muamalat.com.my/consumer-banking/financing/mortgage/
I must have misread your question. In that case I've only come across this: http://developers.facebook.com/docs/reference/plugins/like-box/
Uncheck show faces, stream and header; that's the cleanest you could get. Is this what you're looking for?
I don't think AddThis has that feature you speak of. :)
One way to only show the like button by itself is to hide the top part of the button by setting the iframe dimensions to the size of the button: 60x20.
<iframe src="http://www.facebook.com/plugins/like.php?&href=&send=false&layout=button_count&width=60&height=20&show_faces=false&action=like&colosheme=light"
allowtransparency="true" frameborder="0" scrolling="no"
style="width: 60px; height: 20px;">
</iframe>
If you are using Iframe you need to place an http or https: because >iframe starts as
<iframe src="//www.facebook.com/plugins/likebox.php?href= ................></iframe>
and you need to place
<iframe src="**http:**//www.facebook.com/plugins/likebox.php?href= ................></iframe>
The above answer did help me in finding that out.
If i read this correct, then it is definitely possible:
https://developers.facebook.com/docs/reference/plugins/like/
Put in your Page URL, for example: https://www.facebook.com/bladauhu
(that is my own page)
Uncheck Send Button, use Layout Style "button_count", uncheck Show Faces. Leave the rest as it is and click on the "Get code" button. Use the HTML5 or XFBML Version.
For me, this works just like every other Website and it shows the correct number of likes from the Facebook Page. No additional Images, just the plain and simple Like button.
Adding data-layout='button_count' to the HTML5 version worked for me:
<div class="fb-like" data-href="http://facebook.com/wewantoo" data-send="false" data-width="90" data-show-faces="false" data-layout='button_count'></div>