Question

为了在每次我在Facebook上分享时拥有正确的图像和正确的链接，这就是我在Wordpress / Woocommerce标题上所做的：

    <meta property="og:image" content="<?php the_post_thumbnail_url(); ?>" />
    <meta property="og:title" content="<?php echo the_title(); ?> by Pixel Komando" />
    <meta property="og:url" content="<?php echo get_permalink(); ?>" />

在我的woocommerce产品页面中一切正常，但是当我想分享Shop Page时，FB调试器会向我显示：

网址：https://www.pixelkomando.com/shop

Meta tag og：url https://www.pixelkomando.com/shop/CATEGORY/PRODUCT/

除了商店页面本身外，它似乎无处不在。它不是检索商店页面URL，而是提供随机产品的URL。

我真的不知道出了什么问题。

此致 FERO

Answer 1

由于它是一个存档页面，因此每当您致电get_permalink()时，它都会选择最后一个或第一个产品网址，因此我建议您从header.php删除您的代码并添加关注functions.php

中的代码

function wh_doctype_opengraph($output) {
    return $output . '
xmlns:og="http://opengraphprotocol.org/schema/"
xmlns:fb="http://www.facebook.com/2008/fbml"';
}

add_filter('language_attributes', 'wh_doctype_opengraph');


function wh_fb_opengraph()
{
    global $post;
    if (is_home() && is_front_page())
    {
        ?>
        <meta property="og:type" content="website" />
        <meta property="og:title" content="<?= get_bloginfo('name') ?>"/>
        <meta property="og:url" content="<?= get_site_url() ?>"/>
        <meta property="og:image" content="<?= get_site_url() . '/wp-content/uploads/myhome.jpg' ?>"/> <!-- replace it with your static image-->
        <?php
    }
    //for singles post page
    else if (is_single() && !is_product())
    {
        if (has_post_thumbnail($post->ID))
        {
            $img_src = wp_get_attachment_url(get_post_thumbnail_id($post->ID), 'medium');
        }
        //if featured image not present
        else
        {
            $img_src = get_site_url() . '/wp-content/uploads/post.jpg'; //replace it with your static image
        }
        ?>
        <meta property="og:type" content="article" />
        <meta property="og:title" content="<?= get_the_title($post->ID); ?>"/>
        <meta property="og:url" content="<?= get_the_permalink($post->ID); ?>"/>
        <meta property="og:image" content="<?= $img_src; ?>"/>
        <?php
    }
    //for singles product page only
    elseif (is_product())
    {
        $img_url = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'woocommerce_single_image_width'); //replace it with your desired size
        ?>
        <meta property="og:type" content="product" />
        <meta property="og:title" content="<?= get_the_title($post->ID); ?> by Pixel Komando"/>
        <meta property="og:url" content="<?= get_the_permalink($post->ID); ?>" />
        <meta property="og:image" content="<?= $img_url[0]; ?>"/>
        <?php
    }
    //for product cat page
    else if (is_product_category())
    {
        $term = get_queried_object();
        $img_src = wp_get_attachment_url(get_woocommerce_term_meta($term->term_id, 'thumbnail_id', true));
        if (empty($img_src))
        {
            $img_src = get_site_url() . '/wp-content/uploads/myproductcat.jpg'; //replace it with your static image
        }
        ?>
        <meta property="og:type" content="object" />
        <meta property="og:title" content="<?= $term->name; ?>" />
        <meta property="og:url" content="<?= get_term_link($term->term_id, 'product_cat'); ?>" />
        <meta property="og:image" content="<?= $img_src; ?>" />
        <?php
    }
    //for shop page
    elseif (is_shop())
    {
        ?>
        <meta property="og:title" content="<?= $term->name; ?>" />
        <meta property="og:url" content="<?= get_permalink(woocommerce_get_page_id('shop')); ?>" />
        <meta property="og:image" content="<?= get_site_url(); ?>/wp-content/uploads/myshop.jpg" /> <!-- replace it with your static image-->
        <?php
    }
    else
    {
        return;
    }
}

add_action('wp_head', 'wh_fb_opengraph', 5);

代码经过测试并有效。

希望这有帮助！

Answer 2

似乎问题出在你的og：url标签上。每次我重新使用sharing debugger时都会有所不同。对我而言，这表明get_permalink()方法没有返回一致的结果。

仅供参考，og:url元标记不是必需的，因此这里的简单解决方法就是将其关闭。如果您有多个URL来访问相同的资源，并且您希望让FB的爬虫（即URL）是规范的，那么您才真正需要它。

在Woocommerce中制作动态Facebook OG

2 个答案: