It would appear that the WordPress theme that I am working with was not optimized to work with open graph tags. I changed this line of code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
to this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" xmlns:og="http://ogp.me/ns#" xmlns:fb="http://www.facebook.com/2008/fbml" <?php language_attributes(); ?>>
When I run the url through the debugging tool on FB, it sees the proper image for the homepage, but that’s about the only progress I get. When attempting to share an article it pulls no description or image at all (I use featured images) and the FB Debugger says “document returned no data” when I check to see what the scraper returned for the site.
I have had issues with OG tags before and have, through trial and error, solved the problem. This is really frustrating me. I’ve even tried adding three plugins at once that would all populate the tags, and then running the debugger, hoping it would give me the error message saying “multiple og tags.” It does not. Did I not add the code in my header the correct way?
I will provide my entire header code just in case anyone needs it.
<?php include( TEMPLATEPATH . '/includes/options.php' ); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" xmlns:og="http://ogp.me/ns#" xmlns:fb="http://www.facebook.com/2008/fbml" <?php language_attributes(); ?>>
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<title><?php wp_title('«', true, 'right'); ?> <?php bloginfo('name'); ?></title>
<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css/screen.css" type="text/css" />
<!--[if lte IE 7]><link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css/ie.css" type="text/css" media="screen, projection" /><![endif]-->
<!--[if lte IE 6]><link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css/ie6.css" type="text/css" media="screen, projection" />
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/nav.js"></script><![endif]-->
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php if ( $mb_subscribe_feed ) { echo $mb_subscribe_feed; } else { bloginfo('rss2_url'); } ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php if (is_singular()) wp_enqueue_script('comment-reply'); ?>
<?php wp_head(); ?>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery.qtip.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery.qtip.style.js"></script>
</head>
<body<?php if ($mb_clean == 1) { echo ' class="clean"'; } ?>>
<!-- header -->
<div id="header"<?php if ($mb_clean == 1) { echo ' class="clean"'; } ?>>
<div id="header-inner">
<div id="header-bottom">
<?php if ($mb_logo == 1) { ?>
<div id="logo-custom" style="width:<?php echo $mb_logo_width; ?>px; height:<?php echo $mb_logo_height; ?>px;"><a href="<?php bloginfo('home'); ?>"><?php bloginfo('name'); ?><span style="background: url('<?php echo $mb_logo_image; ?>') no-repeat 0 0"> </span></a></div>
<?php } else { ?>
<div id="logo"<?php if ($mb_clean == 1) { echo ' class="clean"'; } ?>><a href="<?php bloginfo('home'); ?>"><?php bloginfo('name'); ?><span> </span></a></div>
<?php } ?>
<?php if ( !$mb_leaderboard ) echo''; else { ?>
<div id="ad-leaderboard">
<?php echo $mb_leaderboard; ?>
</div>
<?php } ?>
<!-- nav -->
<div id="nav">
<div id="navlist">
<?php mb_nav(); ?>
</div>
</div>
<!-- /nav -->
<!-- social -->
<div id="social"<?php if ($mb_clean == 1) { echo ' class="clean"'; } ?>>
<ul>
<?php if ($mb_subscribe_email) { ?><li id="social-email"><a href="<?php echo $mb_subscribe_email; ?>" title="Sign-up for Email Updates">Email Updates</a></li><?php } ?>
<?php if ($mb_subscribe_feed) { ?><li id="social-feed"><a href="<?php echo $mb_subscribe_feed; ?>" title="Subscribe to RSS Feed">RSS Feed</a></li><?php } else { ?><li id="social-feed"><a href="<?php bloginfo('rss2_url'); ?>">RSS Feed</a></li><?php } ?>
<?php if ($mb_social_twitter) { ?><li id="social-twitter"><a href="<?php echo $mb_social_twitter; ?>" title="Twitter">Twitter</a></li><?php } ?>
<?php if ($mb_social_myspace) { ?><li id="social-myspace"><a href="<?php echo $mb_social_myspace; ?>" title="MySpace">MySpace</a></li><?php } ?>
<?php if ($mb_social_facebook) { ?><li id="social-facebook"><a href="<?php echo $mb_social_facebook; ?>" title="Facebook">Facebook</a></li><?php } ?>
</ul>
</div>
<!-- /social -->
</div>
</div>
</div>
<!-- /header -->
First off, the DOCTYPE and opening HTML tags should be separate — not combined like you have them. See here:
https://www.w3schools.com/tags/tag_doctype.asp
Finally, use a plugin like Complete Open Graph to set up the appropriate prefix and Open Graph tags. It’s automatic and should solve your problem, unless you want to continue to fight it manually.
https://wordpress.org/plugins/complete-open-graph/