Twitter 分享按钮未显示在网站中答案

【问题标题】：Twitter Share Button not showing up in WebsiteTwitter 分享按钮未显示在网站中
【发布时间】：2021-04-08 13:45:37
【问题描述】：

我一直在遵循 Twitter 的官方说明 here 关于如何在我的网站中嵌入推文按钮 - 但它不起作用。他们的按钮只是没有显示出来。

我的浏览器中没有安装任何类型的广告拦截器，所以我知道这不是问题。

这是我的代码：

<div id="congratsDIV">
    
    <h2 style="color: blue;">Congratulations!</h2>
    <br/>
    <br/>
    Tell the World!
    <br/>

    <a class="twitter-share-button" href="https://twitter.com/intent/tweet?text=This%20is%20awesome" data-size="large">Tweet this!</a>

    <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

    <br/>
</div>

请注意，我最初将<script async src= ... > 代码放在了HTML 文件的<head> 部分中——但这也不起作用。

接下来，我手动下载了他们的一个 Tweet 按钮，并尝试在 <a href=" ..." 标记之后将其强制硬编码到文档中 - 如下：

    <a href="https://twitter.com/intent/tweet?text=Very%20Cool%20Indeed&ref_src=twsrc%5Etfw"  class="twitter-mention-button" data-show-count="false">
      <img src="/images/TweetButton-93x30.png" width="93" height="30" />
      Tweet about this moment!
    </a>

...但即使这样也没有用。无论我做什么，按钮都不会显示。

这里发生了什么？有关如何解决此问题的任何想法？

【问题讨论】：

标签： html twitter

【解决方案1】：

试试这个

<script type="text/javascript" async src="//platform.twitter.com/widgets.js"></script>

【讨论】：

我不确定我是否理解：您是说从<script> 标记中的src 属性中取出 "https://"？并且只是让src 属性以"//platform.twitter.com/" 和没有 "https://" 开头？因为它不起作用。我刚试过 - 没用。

【解决方案2】：

我能够使用此代码获得一个推文按钮：

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<a class="twitter-share-button" href="https://twitter.com/intent/tweet?text=Hello%20world" data-size="large">Tweet</a>


<script>window.twttr = (function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0],
    t = window.twttr || {};
  if (d.getElementById(id)) return t;
  js = d.createElement(s);
  js.id = id;
  js.src = "https://platform.twitter.com/widgets.js";
  fjs.parentNode.insertBefore(js, fjs);

  t._e = [];
  t.ready = function(f) {
    t._e.push(f);
  };

  return t;
}(document, "script", "twitter-wjs"));
</script>

</body>
</html>

仅仅通过链接来创建按钮是不够的，所以我能够从here 获取他们的javascript。

【讨论】：

我已经试过了。我忘了在我原来的问题中提到它，但我和你的想法完全一样：将他们的小部件代码直接复制粘贴到我的 html 页面中，看看是否会这样做。仍然没有工作：没有按钮，完全空白。这真的没有任何意义。一定有其他东西以某种方式阻止了按钮或代码......
嗯...我不太清楚发生了什么。我还复制了您的原始代码，然后出现了一个按钮。