为Twitter共享和Facebook共享使用唯一的标题标签... og:标题覆盖twitter:title

时间:2017-05-23 13:12:39

标签: html facebook twitter facebook-opengraph meta-tags

我有两个社交分享元标记我使用og:title用于Facebook,twitter:title用于Twitter。我需要每个人都不同。 Twitter总是使用开放图标题,我需要找到一种方法来为每个共享标题提供不同的内容。目前我的代码如下。

<meta content="my unique title for facebook" property="og:title" />
<meta content="a description tag here for facebook" property="og:description" />

<meta name="twitter:card" content="summary" />
<meta name="twitter:title" content="my unique title for twitter content" />

共享功能正在使用“添加此内容”https://www.addthis.com/academy/setting-the-url-title-to-share/该软件是多个网站的模板,因此编辑HTML并不容易我只想使用元标记找到解决方案。

我正在使用

<meta name="twitter:title" content="my content" />

并分享此Twitter分享仍在使用OG标记。

添加此代码看起来像

    <!-- AddThis Button BEGIN -->
    <!-- Go to www.addthis.com/dashboard to customize your tools -->
    <script type="text/javascript">

      var addthis_config = {
          services_compact: 'email, facebook, twitter, digg, reddit, linkedin, myspace, plaxo, blogger, livejournal, more',
          services_exclude: 'print'
      };
      var addthis_share = {
           url_transforms : {
                shorten: {
                     twitter: 'bitly'
                }
           }, 
           shorteners : {
                bitly : {} 
           }
      };

    </script>
    <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-56e1e3b04418084b"></script>
<!-- AddThis Button END -->

HTML

                            <a href="javascript:;" class="menuLink addthis_button"><i class="fa fa-share"></i> <span>Share</span></a>

1 个答案:

答案 0 :(得分:1)

Twitter的刮刀将始终将Twitter元标记覆盖在开放图形

根据他们的文件:

  

当Twitter卡处理器在页面上查找标签时,首先是它   检查特定于Twitter的属性,如果不存在,则会丢失   返回支持的Open Graph属性。这允许两者都是   在页面上独立定义

OP编辑了他们的问题,他们最初使用的是属性标签而不是名称标签

应该是

<meta name="twitter:title" content="blah">

而不是

<meta property="twitter:title" content="blah">

通过此更改,它可以正常工作。