I have added the following code to a magento site to update the FB thumbnail image.
1column.phtml
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->getLang() ?>" lang="<?php echo $this->getLang() ?>" xmlns:og="http://ogp.me/ns#" xmlns:fb="http://www.facebook.com/2008/fbml">
head.phtml
<meta property ="og:image" content="www.rekinza.com/images/rekinza-fb_logo.jpg"/>
However, Facebook still picks up a random image from the homepage when I put the link in a FB post.
I tried verifying if my changes are getting reflected in the website, so I checked using view-source and found the below result
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" xmlns:og="http://ogp.me/ns#" xmlns:fb="http://www.facebook.com/2008/fbml">
<meta property ="og:image" content="www.rekinza.com/images/rekinza-fb_logo.jpg"/>
head.phtml
<meta property ="og:image" content="www.rekinza.com/images/rekinza-fb_logo.jpg"/>
Please help ! Ive spent way too manyu hours trying to figure this out.
Thank you !
First of all, correct the URL and make sure there is no misplaced whitespace, with http or https (if you got a certificate):
<meta property="og:image" content="https://www.rekinza.com/images/rekinza-fb_logo.jpg"/>
Then, check out the specifications for Open Graph images: https://developers.facebook.com/docs/sharing/best-practices#images
Related
We have developed website using hybrid technology i.e Laravel and Wordpress
Could anyone explain, is it possible include WP functions into Laravel blade.template?
Because in laravel header blade template need to add or include the wp_head() wordpress function.
Need to add the all tags will be in one place (According to the W3C Standards rules)
same like the below code. please have a look.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta property="og:title" content="title" />
<meta property="og:type" content="type" />
<meta property="og:url" content="http://www.website.com/" />
<meta property="og:image" content="{{url('/')}}/images/top-bg.jpg" />
<title>Website Title</title>
// wordpress funtion
<?php wp_head(); ?>
</head>
<body>
</body>
</html>
To load all Wordpress functions in any PHP application is by include file wp-load.php. In Laravel app include it in your bootstrap/autoload.php. Any way, wordpress function always has side effect when invoked. Unexpected echo, etc. This will also load functions in all enabled worpress plugins too. Give your best attention about it. I mean security of your application.
In wordpress function there is one file called as wp-load.php
only include this file in any PHP application with the Relative path.
See the below example :-
require(dirname(dirname(dirname(dirname(__FILE__)))) . '/wptheme/wp-load.php');
wp_head();
This will also load functions in all enabled worpress plugins files.
For example, the URL of a page has the og: <meta property="og:image" content="https://url.com/wp-content/uploads/2016/09/image.png">
If I write that URL in LinkedIn that previous image is shown, but if I write the URL https://url.com/suburl no image is shown, and the og is the same: <meta property="og:image" content="https://url.com/wp-content/uploads/2016/09/image.png">
Why does LinkedIn do that? In fact both pages have the og meta data. What am I doing wrong?
See answer here:
https://stackoverflow.com/a/43567627/3644967
In short, it's likely because you're missing the OG prefix on your page:
<html lang="en-US" prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# website: http://ogp.me/ns/website#">
Either add it manually, or if you're using a WordPress theme, use a plugin like Complete Open Graph to manage that for you:
https://wordpress.org/plugins/complete-open-graph/
This issue has been posted and resolved a lot, but for some reason, I still can't share my new posts (using Wordpress) to Facebook, either directly on Facebook or using the Share plugin (by Jetpack) on my post. In both situations, it returns in a 404 not found. (with no image, no excerpt, but when clicked it redirects correctly on my post).
It worked fine few days ago.
I've made researches for few days now before asking here, and all the solutions I see didn't work for me.
I tried to use the Facebook link Debugger, a Facebook Like Fix plugin (that apparently worked for someone), debugging the link with www., adding some codes I found in articles about that etc.
I've been redirected to this post frequently (http://www.passwordincorrect.com/issue-with-sharing-wordpress-posts-to-facebook/)
After thinking a lot what could causes this issue without finding it, I even thought if it could be possible (since my posts aren't scheduled) that this happened after I changed my time zone on Windows and, Wordpress would think I posted it "earlier"?
So I finally thought it had something to do with metas, unfortunately this is still kind of a mystery for me, and since that I think my header isn't properly written.
Here is what I got when using the Facebook Debugger on a particular post that I can't share :
Critical Errors That Must Be Fixed
Bad Response Code URL returned a bad HTTP response code.
Warning
Errors That Must Be Fixed
Missing Required Property The 'og:type' property is required, but not present.
Notice
Warnings That Should Be Fixed
Inferred Property The 'og:url' property should be explicitly provided, even if a value can be inferred from other tags.
Inferred Property The 'og:title' property should be explicitly provided, even if a value can be inferred from other tags.
Inferred Property The 'og:description' property should be explicitly provided, even if a value can be inferred from other tags.
The Debugger works fine on the website itself though.
I really hope you guys could give me some advices on how to make it work. If any other details are needed, I'll be glad to add them in my post.
POST EDIT :
So I kept looking to find where my issue comes from.
For some reasons now, I can't even re-scrape informations (using FB URL debugger) for my "website.com" and my olders posts "website.com/post-that-used-to-work", even though I can see the already existing scrape informations. (unlike the recents posts, where I can't see neither existing scrape or new scrape)
According to : https://developers.facebook.com/docs/sharing/best-practices, I added all the needed metas "og:" in my header, didn't work.
It seemed like something was already calling it, so I then installed the NGFB plugin that told me there were issues with Yoast SEO and Photon (by Jetpack).
I desactivated both of them, it didn't work.
I still got these errors when trying to debugg a link on a post when tryng to re-scrape informations :
Error parsing input URL, no data was cached, or no data was scraped.
On the website itself when re-scrape :
Object at URL 'http://website.fr/' of type 'website' is invalid because a required property 'og:title' of type 'string' was not provided.
When showing existing scrape informations of a non-working post :
Critical Errors That Must Be Fixed
Bad Response Code URL returned a bad HTTP response code.
Errors That Must Be Fixed
Missing Required Property The 'og:type' property is required, but not present.
Warnings That Should Be Fixed
Inferred Property The 'og:url' property should be explicitly provided, even if a value can be inferred from other tags.
Inferred Property The 'og:title' property should be explicitly provided, even if a value can be inferred from other tags.
Inferred Property The 'og:description' property should be explicitly provided, even if a value can be inferred from other tags.
When clicking on See exactly what our scraper sees for your URL :
-Non-working post :
Document returned no data
-The website itself :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="Refresh" content="0;url=defaultsite">
<!-- FR -->
</head>
<body>
</body>
</html>
And finally my current head part :
<!doctype html>
<!--[if lt IE 7]> <html class="no-js ie6 oldie" <?php language_attributes(); ?>> <![endif]-->
<!--[if IE 7]> <html class="no-js ie7 oldie" <?php language_attributes(); ?>> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" <?php language_attributes(); ?>> <![endif]-->
<!--[if gt IE 8]><!--> <html <?php language_attributes(); ?>> <!--<![endif]-->
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta http-equiv="Content-Type" content="
<?php bloginfo('html_type'); ?>;
charset=<?php bloginfo('charset'); ?>" />
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<meta name="description" content="Description (changed)"/>
<meta name="author" content="Author (changed)"/>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
<meta property="og:title" content="Title (changed)" />
<meta property="og:site_name" content="Site name (changed)"/>
<meta property="og:description" content="Description (changed)" />
<meta property="og:url" content="http://website.fr" />
<link rel="shortcut icon" href="<?php echo THEME_DIR; ?>/favicon.ico" />
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS2 Feed" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<title><?php wp_title(); ?> - <?php bloginfo( 'name' ); ?></title>
<?php wp_head(); ?>
</head>
Everything works fine for Google+ and Twitter though.
I really hope someone could help me with my issue.
To fix the problem just visit https://developers.facebook.com/tools/debug/og/object/ and click on "Fetch New Scrape Information". Clearing your website cache beforehand is good idea.
I still have no idea why this problem appears, I am not using scheduled posts too, but this fixed my problem right away.
I know this is an old post but it took me a while to figure this out:
https://developers.facebook.com/tools/debug/og/object/
Under When and how we last scraped the URL: check the IP address.
I found it to be an IPV6 address, but my website runs only on IPV4.
The IPV6 address went to the server's default page site, which generated the 404 error, because the URL didn't give a result.
I had the same problem when i public my Wordpress post on Facebook.
Then i saw the Henry answer, and he said that the IPV6 was the problem, but the real problem is the multiple IP4 and IP6 on the DNS configuration.
I Go to my Cpanel or whatever u used to manage ur server, I deleted all the IPV4 and IPV6 that are not important for the domain.
For example, the IPV6 AAAA WWW.
The A a.
another A a, A ide.
Ones the DNS are deleted, i got to: https://developers.facebook.com/tools/debug and ran the test, finally all looks good, the preview worked include the meta tags.
This solved my problem on my domain.
I have created a link on a site that when clicked goes here:
http://www.keli-annpye-beshara.ca/?SMIDS=200899a1028301a28863a227638&t=THE+LIGHT+IS+OUT
When I view the source of this page I see:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta property="og:title" content="THE LIGHT IS OUT"/>
<meta property="og:type" content="website"/>
<meta property="og:url" content="http://www.keli-annpye-beshara.ca"/>
<meta property="og:site_name" content="THE LIGHT IS OUT"/>
<meta property="og:description" content="36 x 60 Acrylic on canvas SOLD"/>
<meta property="og:image" content="http://www.keli-annpye-beshara.ca/assets_d/28863/portfolio_media/lwlm_the-light-is-out---small_108.jpg"/>
When the page shows up on Facebook to be shared, only, canonical domain is displayed and none of the OG tags are working. When I pass the URL through facebook's litner, they say:
Admins And App ID Missing: fb:admins and fb:app_id tags are missing. These tags are necessary for Facebook to render a News Feed story that generates a high clickthrough rate.
Like Button Tag Missing: og:title is missing. The og:title meta tag is necessary for Facebook to render a News Feed story that generates a high clickthrough rate.
Like Button Tag Missing: og:type is missing. The og:type meta tag is necessary for Facebook to render a News Feed story that generates a high clickthrough rate.
Open Graph Warnings That Should Be Fixed
Inferred Property: The 'og:url' property should be explicitly provided, even if a value can be inferred from other tags.
Inferred Property: The 'og:title' property should be explicitly provided, even if a value can be inferred from other tags.
When I click the link to view the page as Facebook' scraper does, they see only the following:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta property="og:image" content="http://www.keli-annpye-beshara.ca/assets_d/28863/web_media/lm_kap-website-pic_135.jpg">
I can tell from this, that they are not scraping the page with the URL parameters in place. This is the default content that displays if no SMIDS parameter is passed.
AFAIK, Facebook will do this with any URL with query strings. Try using an URL shortener. As per the details Facebook is not grasping, I use them on a 'sharer' link ('http://www.facebook.com/sharer/sharer.php'). There's many other posts that talk about this same issue here.
This is a weird problem, never faced before & hope I'll never face it again. Our website worldocricket.com is running on wordpress. Its related to news website so we are using social plugins like facebook's like & twitter's tweet buttons etc..
We created some new pages on our site, they are outside of the wordpress folder but on the same domain & are are connected with wordpress using [wp-load.php]. They all are working fine but when we tried to create facebook like button for one of our new pages; using fb developers tool (like button creator) www.developers.facebook.com/docs/reference/plugins/like/ , it spoiled our lunch.
On adding page url " wwww.worldocricket.com/categories/special/tournaments/asia-cup/2012/accasia312.php " in 'URL to Like' box, it showed like counts in preview, on clicking 'like' & 'send' buttons, it revealed that it is liking/sending the main url of the site ( www.worldocricket.com ) which we don't want to, the url we added (or we want to be shared) was different. I thought that was a temporary problem but even after 24-36 hrs we got the same results.
We added og:title / og:type / og:url / og:image in the header after googling.
<meta property=”og:title” content=”ACC Asia Cup 2012”/>
<meta property="og:url" content="http://worldocricket.com/categories/special/tournaments/asia-cup/2012/accasia312.php" />
<meta property=”og:site_name” content=”World Of Cricket”/>
<meta property="og:image" content="http://worldocricket.com/categories/special/tournaments/asia-cup/2012/temptaby/images/asiacup12logo.jpg"/>
But it also proved to be useless. We then used fb debugger ( www.developers.facebook.com/tools/debug ), it showed that it is fetching right url but there is wrong Canonical URL. So we used <link rel="canonical" href="http://worldocricket.com/categories/special/tournaments/asia-cup/2012/accasia312.php"> but the result was same. :/
Our website : http://worldocricket.com
We want like button on http://worldocricket.com/categories/special/tournaments/asia-cup/2012/accasia312.php
Question is : How to get facebook social plugins (like , share , send) working correctly on our site's respective page?
According to the debugger, when the crawler reaches http://worldocricket.com/categories/special/tournaments/asia-cup/2012/accasia312.php it's finding multiple og:url tags, I've verified this in curl:
<meta property="og:title" content="ACC Asia Cup 2012"/>
<meta property="og:site_name" content="World Of Cricket"/>
<meta property="og:url" content="http://worldocricket.com/categories/special/tournaments/asia-cup/2012/accasia312.php" />
<meta property="og:image" content="http://worldocricket.com/categories/special/tournaments/asia-cup/2012/temptaby/images/asiacup12logo.jpg"/>
<meta itemprop="name" content="ACC Asia Cup 2012">
<meta itemprop="description" content="Best Cricketing event in Asia organized by Asian Cricket Council (ACC).">
<meta itemprop="image" content="http://worldocricket.com/categories/special/tournaments/asia-cup/2012/temptaby/images/asiacup12logo.jpg">
<meta name="generator" content="WordPress 3.3.1" />
<meta property="og:title" content=""/>
<meta property="og:type" content="article"/>
<meta property="og:url" content=""/>
<meta property="og:image" content=""/>
<meta property="og:site_name" content="World Of Cricket"/>
<meta property="fb:admins" content="1789905767"/>
<meta property='og:site_name' content='World Of Cricket' />
<meta property='fb:app_id' content='189072694472072' />
<meta property='og:locale' content='en_US' />
Make sure you're only returning one set of tags and they're valid