8

我正在尝试将动态 Facebook og 元标记添加到我的 Wordpress 网站。我将它们添加到 single.php 而不是通常推荐的 functions.php 文件，因为我在下面有代码，用于我创建的 Facebook 应用程序，每次有人查看单个博客帖子时都需要执行，因为它随后会发布到他们的 Facebook他们已阅读该特定帖子的时间表。我不想使用插件，因为我的一些插件曾经相互冲突，而且把它理顺是一团糟。我最大的问题是我需要og:url标签是动态的，尽管og:title, og:description,og:image等也应该是动态的。这是我在 single.php 文件顶部的代码：

编辑：这是我现在使用的工作代码。感谢大家的帮助：

    <?php

$params = array();
if(count($_GET) > 0) {
    $params = $_GET;
} else {
    $params = $_POST;
}
// defaults
if($params['type'] == "") $params['type'] = "picture";
if($params['locale'] == "") $params['locale'] = "en_US";
if($params['description'] == "") $params['description'] = "Visit Internet LOLs for the funniest humor on the web! :)";
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# internetlolsapp: http://ogp.me/ns/fb/internetlolsapp#">
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>

        <!-- Open Graph meta tags -->
        <meta property="fb:app_id" content="378076268920252" />
        <meta property="og:site_name" content="meta site name"/>
        <meta property="og:url" content="<?php echo 'http://internetlols.com'.$_SERVER['REQUEST_URI']; ?>"/>
        <meta property="og:type" content="internetlolsapp:<?php echo $params['type']; ?>"/>

        <meta property="og:description" content="<?php echo $params['description']; ?>"/>

    </head>
</html>

  <script type="text/javascript">
  function postView()
  {
      FB.api(
        '/me/internetlolsapp:view',
        'post',
        { picture: '<?php echo 'http://internetlols.com'.$_SERVER['REQUEST_URI']; ?>' },
        function(response) {
       if (!response) {
          // FAIL GRACEFULLY alert('Error occurred : No Response');
       } else if (response.error) {
          // FAIL GRACEFULLY alert('Error occurred : ' + response.error);
       } else {
          // SUCCESS alert('View was successful! Action ID: ' + response.id);
       }
        });
  }
  </script>
</head>
<body>
  <div id="fb-root"></div>
  <script>
    window.fbAsyncInit = function() {
      FB.init({
        appId      : '378076268920252', // App ID
        status     : true, // check login status
        cookie     : true, // enable cookies to allow the server to access the session
        xfbml      : true  // parse XFBML
      });
    };

    // Load the SDK Asynchronously
    (function(d){
      var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
      js = d.createElement('script'); js.id = id; js.async = true;
      js.src = "//connect.facebook.net/en_US/all.js";
      d.getElementsByTagName('head')[0].appendChild(js);
    }(document));
  </script>



</body>

<body onload='postView()'>
</html>

我正在尝试遵循此处的代码：动态生成 Facebook Open Graph 元标记 ，并且每当我阅读博客文章时它都会发布到我的 Facebook 时间线，但是对于标题，它当然会发布“默认标题”并且当我单击“我的 Facebook 时间线上的默认标题”链接，它会将我发送到 single.php 的 URL，在 URL 的末尾有一堆废话

http://MYSITE.com/wp-content/themes/twentyeleven/single.php?fb_action_ids=10151048340001514&fb_action_types=internetlolsapp%3Aview&fb_source=other_multiline

而不是博客文章 URL。我想知道它是否与我在“FB.api”之后的第 3 行中放置的 URL 有任何关系，但是当我阅读时，我尝试放在那里的任何其他内容都会阻止该应用程序在我的 Facebook 时间线上发布任何内容一篇博文。

任何想法如何解决这一问题？这几天我一直在拔头发。非常感激任何的帮助！提前致谢。

4

5 回答 5

2

我从 Facebook Featured Image and Open Graph Meta Tags ( http://www.ryanscowles.com )中改编了一个函数，并将其粘贴到 functions.php 上，它可以工作！（wordpress 3.5.1）

<?php
//function to limit description to 300 characters
function limit($var, $limit) {
    if ( strlen($var) > $limit ) {
        return substr($var, 0, $limit) . '...';
    }
    else {
        return $var;
    }
}

// Set your Open Graph Meta Tags
function fbogmeta_header() {
    if (is_single()) {
        //getting the right post content
        $postsubtitrare = get_post_meta($post->ID, 'id-subtitrare', true);
        $post_subtitrare = get_post($postsubtitrare);
        $content = limit(strip_tags($post_subtitrare-> post_content),297);
        ?>
        <meta property="og:title" content="<?php the_title(); ?>"/>
        <meta property="og:description" content="<?php echo $content; ?>" />
        <meta property="og:url" content="<?php the_permalink(); ?>"/>
        <?php $fb_image = wp_get_attachment_image_src(get_post_thumbnail_id(     get_the_ID() ), 'thumbnail'); ?>
        <?php if ($fb_image) : ?>
        <meta property="og:image" content="<?php echo $fb_image[0]; ?>" />
        <?php endif; ?>
        <meta property="og:type" content="<?php
        if (is_single() || is_page()) { echo "article"; } else { echo "website";}     ?>"
        />
        <meta property="og:site_name" content="<?php bloginfo('name'); ?>"/>
        <?php
        }
        }
add_action('wp_head', 'fbogmeta_header');
?>
于 2013-10-21T16:51:15.007 回答
2

For what its worth, I use a function from Ryan S. Cowles to do this and it works perfectly. It inserts the data dynamically with the wp_head hook making every page load the OG meta info dynamically. Anytime one of your page links is used in the FB status box, it calls the info relating to that page. I use Featured Images on all of my pages but if you don't you could easily write in a default fallback.

This is in my functions file:

/*
Plugin Name: Facebook Featured Image and Open Graph Meta Tags
Version: 1.0
Plugin URI: http://www.ryanscowles.com
Description: Automatically set the posts' Featured Image as the thumbnail and set appropriate Open Graph meta tags for sharing on Facebook.
Author: Ryan S. Cowles
Author URI: http://www.ryanscowles.com
*/

define ('pluginDirName', 'fb-featured-image');
// Allow for Facebooks's markup language
add_filter('language_attributes', 'add_og_xml_ns');
function add_og_xml_ns($content) {
  return ' xmlns:og="http://ogp.me/ns#" ' . $content;
}

add_filter('language_attributes', 'add_fb_xml_ns');
function add_fb_xml_ns($content) {
  return ' xmlns:fb="https://www.facebook.com/2008/fbml" ' . $content;
}    

// Set your Open Graph Meta Tags
function fbogmeta_header() {
  if (is_single()) {
    ?>
        <meta property="og:title" content="<?php the_title(); ?>"/>
        <meta property="og:description" content="<?php echo strip_tags(get_the_content($post->ID)); ?>" />
        <meta property="og:url" content="<?php the_permalink(); ?>"/>
        <?php $fb_image = wp_get_attachment_image_src(get_post_thumbnail_id( get_the_ID() ), 'thumbnail'); ?>
        <?php if ($fb_image) : ?>
            <meta property="og:image" content="<?php echo $fb_image[0]; ?>" />
            <?php endif; ?>
        <meta property="og:type" content="<?php
            if (is_single() || is_page()) { echo "article"; } else { echo "website";} ?>"
        />
        <meta property="og:site_name" content="<?php bloginfo('name'); ?>"/>

<?php
  }
}
add_action('wp_head', 'fbogmeta_header');
于 2013-07-15T15:27:10.380 回答
1

使用 Wordpress，您无需通过$_GET或传递此信息$_POST。Wordpress 为您提供了所有这些功能。

我可以理解您不想使用插件的愿望，但其中一些插件（如 Wordpress SEO 或官方 Facebook）可以为您添加此插件，让您的生活更轻松。如果没有，找一个简单的把它拆开看看他们在做什么。

如果你真的想自己动手，你应该使用模板标签设置标题。您可以通过the_title()函数检索帖子标题。您正在寻找的其他元数据点还有其他内容。

最后一点：您的og:image文件必须至少有 50 像素的一面，否则 Facebook 将不会显示它。Favicon，就像您尝试使用的一样，几乎总是太小。有关完整的图像规格，请参阅此页面。

于 2012-06-18T01:46:23.347 回答
0

我最终通过使用以下代码行使 Facebook og:url 标签动态化来解决它：

<meta property="og:url" content="<?php echo 'http://internetlols.com'.$_SERVER['REQUEST_URI']; ?>"/>

{ picture: '<?php echo 'http://internetlols.com'.$_SERVER['REQUEST_URI']; ?>' },
于 2012-06-19T16:48:07.123 回答
0

要使og:url&og:title动态，请尝试使用此

<meta property="og:url" content="<?php echo get_permalink($post->ID); ?>"/>
<meta property="og:title" content="<?php echo $post->post_title; ?>"/>

还有其他数据可通过该$post对象获得。有关更多信息，请参见此处http://www.rlmseo.com/blog/wordpress-post-variable-quick-reference/

于 2012-06-18T12:51:39.247 回答