【问题标题】:Styling social sharing buttons设计社交分享按钮
【发布时间】:2014-02-26 17:48:04
【问题描述】:

通过引用 Facebook、twitter 和 google plus 等社交分享按钮 api,我创建了一个简单的小提琴来分享链接(例如:http://www.google.com)。

Fiddle

我的小提琴工作正常,但特别是 twitters 的链接带有我不想拥有的默认样式。

我实际上打算将非样式纯文本用作社交分享按钮。

我尝试更改样式或使用备用锚元素触发共享按钮,但意识到这是不可能的,因为共享按钮链接是在 IFRAME 中生成的。

对如何更改这些按钮的样式有任何帮助吗?

【问题讨论】:

    标签: javascript css facebook twitter google-plus


    【解决方案1】:

    因此,这些网站对您的身份有特定的规则,并且不允许对其进行品牌推广,例如共享链接、带有徽标的按钮等。

    https://www.facebookbrand.com/

    https://about.twitter.com/press/brand-assets

    https://developers.google.com/+/branding-guidelines

    话虽如此,您的问题是您正在引入twitter-share-button 类,该类将元素变为按钮。摆脱它,你只会看到文字。

    【讨论】:

      【解决方案2】:

      您可以使用在 twitter 链接中传递的数据属性。喜欢

      http://jsfiddle.net/UL6XB/6/

      <a href="https://twitter.com/share" class="" data-url="http://www.google.com" data-via="your_screen_name" data-text="Checking out this page about Tweet Buttons" data-count="none">
      

      【讨论】:

      • 感谢您的回复...但是.. 如果我单击 twitter,则新页面将在同一页面中打开。我不愿意更改默认功能,而只是更改默认样式..
      • 将属性 target="_blank" 添加到 twitter "a" 标签
      • 这不是这里唯一的问题.. 传递给 twitter 共享链接的数据属性不会传递到新窗口/选项卡。
      • 更好的选择是使用intent/tweet 而不是/share。更新小提琴jsfiddle.net/UL6XB/8 这将打开一个单独的窗口而不是一个选项卡。
      • 谢谢.. 我在这里试试 :)
      猜你喜欢
      • 1970-01-01
      • 2012-01-29
      • 1970-01-01
      • 1970-01-01
      • 2021-09-26
      • 2012-08-19
      • 2023-02-08
      • 2022-01-19
      • 1970-01-01
      相关资源
      最近更新 更多