I have a wordpress blog inside a CMS of an institution! I cannot change that.
The wordpress-blog is implemented as an iFrame in the CMS.
I tried a few wordpress plugins for social media inlcuding facebook likes. But unfortunatly facebook is not finding the content of the blogpost!
Sometimes it takes the content and the pictures of the blogpost, sometimes it just takes a picture of the CMS and sometimes it just posts the link. Especially if i want to share it by hand by "posting" the blogpost of wordpress in facebook.
Is there any possibility to let facebook manually know where the relevant content is (maybe by div-id or something?)
Related
This is my post featured image.
This is my post entitled "First post" with social icons at the bottom for sharing using social media feather plugin
This is what shows up when I clicked the facebook button
The image above shows that it doesn't return the right image set as featured image for the first post to be shared in facebook. I also encountered the same problem using WP Social Sharing. Can anybody help me solve this please. Thanks a lot.
Facebook, and other platforms that allow social sharing (LinkedIn, Twitter, G+, etc), all use a protocol called OpenGraph.
In it's simplest form, OpenGraph is a series of meta tags placed on a web page that describe that page. Common tags include a title of the page, description, image and a category. It is this OpenGraph image that Facebook uses in it's preview for the social share.
The tag itself is called og:image, and Facebook suggest it is at least 1200x630 pixels, although they will still use the image if it is less than that. As a side note for anyone viewing this thread and having the same issue with Facebook apps - you'll need to serve the image over HTTPS for that, something you don't need to do in this case.
I would suggest viewing the source of your page and finding the OpenGraph tags. If none are present (very possible) then Facebook is just doing it's best based on what it sees on the page. You can remedy this by adding your own tags, or using one of the many OpenGraph plugins available for WordPress.
More information on Facebook's best practices for social sharing are available.
This is my first attempt with social share buttons on a classic HTML website (not a CMS).
I understand that social meta tags are now the way to go as you have more control on what you are sharing (you can have more control on the title, the picture, the description, the content type etc..).
What I don't get is how to share a specific article only when you have ten articles displayed on the same page.
All the tutorials I read about sharing buttons are dedicated to a whole web page but I would like to share a specific section of the page per button, not the whole page (one page = 10 articles = 10 share buttons).
How would I achieve that?
Thank you.
(Bonus question: are social meta tags shared by FB, twitter and linkedin or are they only dedicated to FB?)
I don't know if you are still struggling with this, but I've just been thinking about a similar-but-different problem, with a one-page site where the content is swapped out dynamically so that it is not possible to change the og: tags in the header.
The solution requires generating individual pages for each specific article that have their own with dedicated og: tags. Then in your page which lists 10 articles, each one has a share button where the link points to the specific article page, e.g. <a href="https://www.facebook.com/sharer/sharer.php?u=http://yoursite.com/article1.html">.
When some clicks the share button, facebook will crawl the target url for og: tags, not the page you are currently on.
In your case the solution is pretty straightforward, as you presumably have individual pages for the articles already. Mine is slightly trickier because I have to generate extra pages which won't be navigated to from my site but exist for facebook to crawl (and to display the right content when people arrive via the social shares).
When I paste a friend's wordpress site url in a facebook comment, I see the following extra text (I've changed the url for anonymity) The home page of the wordpress blog is titled "Home"
For some reason facebook adds the extra lines in i.e. where it says "You may use these HTML tags and ... " or perhaps the wordpress generated html get incorrectly parsed/referenced in the facebook comments browser.
I have zero wordpress experience but do understand CMS concepts well. Any help on how to resolve this will be much appreciated by my friend. I can disclose the url if its really needed to resolve the issue. I decided to try posting the question with an anonymous url first, just in case this is a known, encountered-before issue.
Wondering if the facebook graph-api has anything to do with this? (FB graph-api is not my forte either as I'm more into iOS development)
Home
http://mywordpressfoo.net/
You may use these HTML tags and attributes:
<a href="" title=""> <abbr title=""> <acronym title="">
<b> <blockquote cite=""> <cite> <code> <del datetime="">
<em> <i> <q cite=""> <strike> <strong>
It sounds like your friend's blog does not have OpenGraph tags. Facebook uses these to determine how URLs display when posted on their site (e.g. YouTube URLs display embedded videos, Flickr URLs photos, etc.).
You can find more information about the metatags that Facebook supports in their OpenGraph documentation. Your friend will probably want to make individual posts "Articles", while the homepage should be a "Blog" or a "Website".
Depending on your friend's competency with editing WordPress templates, they might find it easier to integrate Facebook's official WordPress plugin, which includes support for OpenGraph tags.
A little while ago, I built this:
http://www.littlebray.co.uk/photos.aspx
It's kind of an off-Facebook partial replica of a Facebook photo album gallery, the photos in the gallery section are all pulled from Facebook albums on the Page for Little Bray (fb.com/littlebray) enlarging them gives you a kinda full screen view of them with commenting facilties on the right margin, just like Facebook.
You'll notice that, whilst this comment section looks a bit like a Facebook plugin, it isn't, and the reason for this is that if I used Facebooks Comments Plugin, when a user comments on a photo on the website, or comments on the same photo (remembering the photos come from the same source), it will create two different streams of comments, one shown on FB and one shown on the website.
With my method, any comments posted either on the website or FB will appear in both places as they're al directly injected into the FB graph relating to the object ID of the photo.
A bit later on, I created another, similar image gallery but used Facebooks Social Plugin "Comments" in the right hand margin to comment on photos. The difference here though was that these photos were lcoally hosted by the website and not already Facebook album objects, so this other website is the only source for these images and thus creating FB objects when commenting via a URL is fine.
BUT... it got me thinking, is my first example just a lot of work, is it possible to use Facebooks own Social Plugin to post comments on an object which already exists on Facebook in that way?
I tried pasting a graph URL https://graph.facebook.com/FB_OBJECT_ID into the Comments example on Facebooks Social Plugins page from a status update of mine, but nothing showed.
Any ideas?
EDIT ---
I have discovered I am not alone in asking this question:
Using social plugins for pre-existing Facebook posts
Load comments from open graph object into Facebook comments social plugin
Neither of those have satisfactory answers though. Perhaps I just need to improve my own code and make my own plugin.
At this time the comments plugin can not be used in that way.
I am currently working on a rebranding with my company, and I am having some issues with the thumbnails which are appearing next to the facebook posts when someone shares our website. The issue is that our old logo is still appearing in the thumbnail image, and not our new one - not ideal. Is there an easy way of updating the choice of these thumbnails to give the choice of our new logo?
Make sure you have the correct OpenGraph og:tags in your HTML markup and use the Facebook Debugger to scrape your URL and refresh Facebook's caching of your URL; it will show you what metadata Facebook can see for your URL.