如何从 twitter 小部件中获取徽标

Question

我正在使用 Twitter 本身的 Twitter 小部件。 你可以在http://twitter.com/about/resources/widgets/widget_profile下载它

现在我得到了这个代码：

<script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 4,
  interval: 6000,
  width: 180,
  height: 320,
  theme: {
    shell: {
      background: '#6e6e6e',
      color: '#ffffff'
    },
    tweets: {
      background: '#fefefe',
      color: '#545454',
      links: '#b05c5c'
    }
  },
  features: {
    scrollbar: false,
    loop: false,
    live: false,
    hashtags: true,
    timestamp: true,
    avatars: false,
    behavior: 'all'
  }
}).render().setUser('SchmidtGlobal').start();
</script>

当我将它嵌入我的网站时，我的徽标位于左上角。 有没有办法把它弄出来？

引用这个脚本：http://widgets.twimg.com/j/2/widget.js

任何帮助将不胜感激。

谢谢

Answer 1

最简单的方法是使用 CSS。创建一个 CSS 文档并将其链接到您的网页。在 css 中粘贴：

.twtr-hd, .twtr-ft{display: none;}

这将删除页眉和页脚。希望这会有所帮助！

Answer 2

在full source 中，徽标的位置在此处定义：

var logo = isHttps ? 'https://twitter-widgets.s3.amazonaws.com/i/widget-logo.png' : 'http://widgets.twimg.com/i/widget-logo.png';

并在此处嵌入 HTML：

<a target="_blank" href="http://twitter.com"><img alt="" src="' + logo + '"></a>

所以你应该放下那部分就完成了。

也就是说，我想知道这是否违反许可协议。

---

更新： 如 OP 所怀疑的那样，上述方法确实删除了 Twitter 徽标，但删除个人资料图片并不难。查看生成的小部件（使用“测试设置”）显示图像的标记是

<a class="twtr-profile-img-anchor" href="http://twitter.com/***" target="_blank">
    <img src="http://a1.twimg.com/profile_images/***/***.jpg" class="twtr-profile-img" alt="profile">
</a>

所以只需找到在source code 中设置类twtr-profile-img-anchor 的代码即可。看，它就在那里：

/**
  * @public
  * @param {string}
  * sets the profile image source to display in the widget
  * @return self
  */
setProfileImage: function(url) {
  this._profileImage = url;
  this.byClass('twtr-profile-img', 'img').src = isHttps ? url.replace(httpsImageRegex, httpsImageReplace) : url;
  this.byClass('twtr-profile-img-anchor', 'a').href = 'http://twitter.com/' + this.username;
  return this;
}

我高度怀疑删除调用setProfileImage 的行就足够了：

this.setProfileImage(resp[0].user.profile_image_url);

您会注意到的唯一一件事是，标题现在会太靠右了。您必须覆盖此 CSS 规则：

.twtr-widget-profile h3, .twtr-widget-profile h4 {
    margin: 0 0 0 40px !important;
}

Answer 3

在脚本中找到twtr-hd，添加

style="display:none"

在脚本中找到twtr-ft，添加

style="display:none"

应该这样做。

_{灵感来自Queen of Nerds' solution}