1. 技术文章
  2. Dynamic Facebook og Meta Tags in Wordpress PHP

Dynamic Facebook og Meta Tags in Wordpress PHP

由 青春壹個敷衍的年華 提交于 2019-11-29 04:28:14

I adapted a function from Facebook Featured Image and Open Graph Meta Tags(http://www.ryanscowles.com) and pasted it on functions.php, it works! (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');
?>
cpilko

With Wordpress, you don't need to pass this information via $_GET or $_POST. Wordpress makes all this available to you.

I can understand your desire not to use a plugin, but some of them like Wordpress SEO or the official Facebook can add this for you and make your life a lot easier. If not, find a simple one and take it apart to see what they're doing.

If you really want to roll your own, you should be setting the title using template tags. You can retrieve a posts title via the the_title() function. There are others for the other metadata points you're looking for.

A final note: Your og:image file needs to be at least 50px on a side or Facebook won't display it. A Favicon, like you're trying to use, is almost always too small. See this page for the full image specifications.

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');

To make the og:url & og:title dynamic, try using this

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

There is also other data that is avilable via the $post object. See here for more info http://www.rlmseo.com/blog/wordpress-post-variable-quick-reference/

I ended up solving it by using the following lines of code to make the Facebook og:url tags dynamic:

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

{ picture: '<?php echo 'http://internetlols.com'.$_SERVER['REQUEST_URI']; ?>' },
标签
php
facebook
wordpress
meta-tags
易学教程内所有资源均来自网络或用户发布的内容，如有违反法律规定的内容欢迎反馈！
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!