Error 404 when sharing on Facebook - wordpress

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.

Related

preload link - wordpress and flatsome

I found so many different articles and tried to implement it, but I still can't get it working.
Google pagespeed recommends to preload few files, but I can't figure it out :/
I went ahead and updated my header.php
<head>
<!--custom preload -->
<link rel="preload" as="font" crossorigin="anonymous" href="https://allurehemp.com/allurehemp/assets/css/icons/fl-icons.woff2" >
<link rel="preload" as="style" crossorigin="anonymous" href="https://allurehemp.com/allurehemp/assets/css/fl-icons.css" >
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<?php wp_head(); ?>
</head>
And now i'm facing the following issue(s);
A preload for 'https://allurehemp.com/allurehemp/assets/css/fl-icons.css' is found, but is not used because the request credentials mode does not match. Consider taking a look at crossorigin attribute.
Any recommendation is appreciated =)
I realize this is quite delayed, but I just figured this out for my site. Maybe it will be helpful for others, if the OP doesn't need this anymore.
It's way simpler than I thought it would be. Below is what I did, and it worked. No more warning/penalty in PageSpeed Insights, and my performance score increased.
In your WP admin area/dashboard, go to Flatsome > Advanced > Global Settings (see screenshot below)
Screenshot of relevant Flatsome > Advanced > Global Settings area
Insert the following line into the 'Header Scripts' area:
<link rel='preload' href='//wp-content/themes/flatsome/assets/css/icons/fl-icons.woff2' as='font' type='font/woff2' crossorigin='anonymous'>
OTHER NOTES:
A. The link in my code snippet is relative to the site domain, so you don't need to change it and insert your domain or anything. The double slash forces the same security protocol as the origin site, so it should force load https if your site uses https (which it should).
B. This probably goes without saying, but you never know: If you're adding anything to the theme files, always use a child theme so your updates/changes don't get overwritten when you update your theme. Here's a great plugin I've used several times to create a child theme in WordPress: https://wordpress.org/plugins/child-theme-configurator/
C. The links you included in the in the header.php file didn't include the "type=" bit. I'm not certain, but this could have been the source of the problem for you.
D. I didn't add a preload link for the css file like you did because all my css is minified and combined. Also, that particular file is just a few lines anyway, so preloading likely won't make much of a difference.
Hopefully this helps! :)

How to load Wordpress functions wp_head() into Laravel <head> tag?

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.

Unable to change facebook thumbnail image for magento site

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

how to change my wordpress homepage title, description and image on facebook

I build a new wordpress site and installed the Yoast SEO plugin.
My homepage defined as some of my pages.
When i post the link on facebook i can't see any description/title/image that i want
checked on - https://developers.facebook.com/tools/debug/og/object/
i got:
og:type article
(i think that In order to work should appear : website)
maybe someone knows Where I'm wrong?
Thank you!
Facebook uses OpenGraph, a protocol for which if no default values are defined (and you have no standard HTML <meta> values defined,) you can set certain properties so that your site will appear as you want it when you share it socially.
It should be noted that Opengraph will, by default, attempt to interpret these properties by their corresponding <meta> elements (stuff like <meta name="description" content="describe my site">).
If you don't have these, I suggest you add them, but the OpenGraph properties can be defined explicitly, too. The process for adding properties like this involve the use of the <meta> tag, typically in your header.php.
There are a lot of properties you can define
I think most pertinent to your situation would be:
<meta property="og:image" content="path/to/image">
<meta property="og:title" content="My cool website">
<meta property="og:description" content="Description of site">
These work for sites that use OpenGraph, but it's no substitute for having proper <meta> tags in the <head> of your document.
here's a bit of reading you can do on defining site meta
Hope this helps!

wp_head inserts og meta tags. where's causing them?

<script type='text/javascript' src='http://test.groundguitar.com/wp- includes/js/jquery/jquery.js?ver=1.10.2'></script>
<script type='text/javascript' src='http://test.groundguitar.com/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1'></script>
<style type="text/css">.recentcomments a{display:inline !important;padding:0 !important;margin:0 !important;}</style>
<meta property="og:type" content="article" />
<meta property="og:url" content="" />
<meta property="og:title" content="" />
<meta property="og:site_name" content="" />
<meta property="og:locale" content="en_US" />
<meta property="og:description" content="" />
<meta property="og:image" content="" />
</head>
These are lines added by wp_head();. For some reason it adds og tags, and I can't figure out why.
I'm using the Yoast SEO plugin, but have previously used All In One SEO, and they both had og tags disabled, yet this still appeared in the header. Rest of the plugins I'm using are: Facebook Comments by Fat Panda, Contact Form 7 and Any Mobile Theme Switcher. Disabling any of them didn't remove the tags.
Could this be a leftover from a plugin used in the past, which didn't uninstall correctly, and how can I remove it, or at least find out what's causing it?
That definitely looks like something a plugin would add.
First thing I would do is check the header.php file of your theme just to make sure they are not hard coded in there, never hurts to eliminate the obvious first.
Next, do you have JetPack enabled? If so do you have it's Social Links module enabled? Those og tags might be generated from there.
Last but not least if they still are showing up you will need to turn of EVERY plugin and check, might be something that another, not so obvious plugin might be doing.
Good luck!
Yoast plugin provides Opengraph for Facebook and Twitter so that if someone shares your post/page, the desired image with custom title can forward to those social media. You can check https: //www.facebook.com/kumarsn11/posts/747660215383716 this link which redirects user to your website. Its always helpful. Read some basic info about opengraph, you will get basic idea what you are actually using. Read This https: //blog.kissmetrics.com/open-graph-meta-tags/
You can disable it by SEO-> Social-> Add Opengraph Metadata. Disable This.
but I will recommend you not to disable, but use it properly with more customization.
When you click this social icon, you can use custom title other than original or keep the same for Facebook and Twitter.

Resources