Facebook Open Graph share issue - facebook

I have Facebook share button on my Wordpress site. I have the open graph call in my functions.php. The problem I'm having is when you press the share button below a single post you get the meta description of the site from header.php along with a random image posted to Facebook.
When you use twitter which I have linked to my Facebook page you all the meta info along with the correct image for that particular post the same with a Facebook linked Pinterest account.
I've used the Facebook developer tool scraped various post URL and the all came back with the correct meta info and image error free. Can anyone explain this issue to me.

I figured out what the issue was.
Posting solution in case anyone might come across the same problem.
add: <?php the_permalink(); ?> to the data-href= URL:
<div class="fb-share-button" data-href="<?php the_permalink(); ?>" data-layout="button"></div>
oppose to:
<div class="fb-share-button" data-href="YOUR SITE URL" data-layout="button"></div>
This will load all pertinent info into the Facebook Iframe for Facebook Posting.

Related

Facebook comments not showing in mobile

I have this website named 1FAKT and i have integrated Facebook comments on it. Strangely comments made in Facebook comments are visible in desktop template BUT are not showing in mobile template.
Example:
Post in desktop: Desktopo Link
Same post in mobile: Mobile Link
Mobile is default active in Facebook script. Then what's the problem?
I recently had a similar issue. For me, this was due to css flex-box properties that I had assigned to div containing facebook comments plugin. When I removed the styles for this div the plugin worked fine. You may also want to try assigning data-mobile="false" property to your comments div. See below for an example of code that worked for me.
<div style='text-align:center;'>
<div class="fb-comments" data-href="http://localhost:8000/es/comments" data-width="600" data-numposts="10" data-mobile:"false"></div>
</div>

Want the facebook comment box url dynamically assigned according to posts

I am working to create a website using wordpress. There are a number of posts in my web site. I am to add the facebook comment button that appears below every single posts in my site. For this purpose I used the facebook social plugin.
I added the codes generated at facebook developers site to my single post page file. Now the problem is: The same comments appear in every page in my posts everywhere. how can I make this a specific one .
<div class="fb-comments" data-href="http://rabindraadhikari.com" data-width="600" data-numposts="3" data-colorscheme="light"></div>
I want to change the data-href part of the code so that it assigns the url according to the page where it is displayed.
The format of the posts url belonging my site is www.domain-name.com/post-id
How can it be done??
Somewhere, I found it can be done like this but it didnt work
<div class="fb-comments" data-href="+location.href+" data-num-posts="3" data-width="470"></div>
location.href is a property from javascript, so
<script>
document.write('<div class="fb-comments" data-href="'+location.href+'" data-num-posts="3" data-width="470"></div>');
</script>

Can Facebook Page and third party website share Likes?

I am trying to get my head around this FB API thing and I wonder if it is possible to share likes between FB page and a website.
For example: I have a website example.com that has a like social plug-in button on it, I also have a FB page(as recommended by FB, not sure why I need one) for example.com.
What happens when the user clicks on like? Is it possible to interconnect these entities so that the likes don't get scattered?
You can change the Facebook like-button to a like-box containing the id of your page.
An example of this would be:
<div
class="fb-like-box"
data-href="http://www.facebook.com/example.comFB" data-width="300"
data-height="300" data-show-faces="true"
data-stream="true" data-header="true">
</div>

Activity Feed Not Working on my website

I cannot get the activity feed to show the updates on my FB page on my web page. The url is www.briggroseunder7s.co.uk
It is showing random info from facebook, Below is the code i am using.
<div class="fb-activity" data-site="www.facebook.com" data-action="like,comment" data-width="300" align="center" data-height="300" data-header="true" data-colorscheme="dark" data-font="tahoma" data-recommendations="true" ></div>
I am only an amateur and trying to get this working for my kids football site. Any help is much appreciated.
In your code example above, data-site="www.facebook.com" is incorrect. What you need there is your website's url where the activity is happening.

AddThis Facebook custom parameters

I'm using custom AddThis buttons to share things in Twitter and Facebook... for Twitter share I use:
addthis:templates="{ twitter: ' {{title}} # {{url}} via #agenciauzzye' }"
I know that for the Facebook custom description, title, url, image and other things I must have to use meta tags. The problem is that I have a blog with one static page and all the content (posts) are loaded inside one div with AJAX. The main page is a posts list where I have the buttons to share each post...
How do you guys share content in Facebook with AddThis without set up the meta tags???
The only solution I found is to use direct Facebook share URL, without pass by AddThis code (and so, without log for analysis). Something like:
<a onClick="window.open('http://www.facebook.com/sharer.php?s=100&p[summary]=<?php echo rawurlencode(striptags(abrev_texto(get_output($descricao),1000,"p"," ...",true)));?>&p[title]=<?php echo rawurlencode(get_output($post->titulo));?>&p[url]=<?php echo rawurlencode(ROOT_SERVER . ROOT . "blog/" . $urlAux); ?>&&p[images][0]=<?php echo rawurlencode($imageShare);?>','sharer','toolbar=0,status=0,width=548,height=325');" href="javascript: void(0)"></a>
You can see more details in http://blog.uzzye.com
Luckily the Facebook developers were smart enough to realize they cannot predict every type of web page on the internet. Instead, they offer a few simple meta tags that control how this information is passed to Facebook:
title: <meta name=”title” content=”The title of the link being shared” />
short description: <meta name=”description” content=”A description of the page” />
optional thumbnail image: <link rel=”image_src” href=”http://example.com/images/image.jpg” />
That’s all you need to tell Facebook what to populate in the link details when someone shares your page with others on Facebook.