4

I'm trying to add a tweet button to html page , I use the official code from the twitter button generator , http://twitter.com/about/resources/buttons#tweet

when I test the page on chrome and Firefox , the button doesn't appear , only an underlined text says : "Tweet"

here is the code :

  <html xmlns="http://www.w3.org/1999/xhtml">
  <head>
  </head>
  <body>
  <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://www.3eesho.com/magazine/index.html" data-text="issue2 now" data-via="3eesho" data-hashtags="ipad,health,arabicmagazine">Tweet</a>
    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
  </body>
</html>
lama
  • 53
  • 2
  • 4
  • 1
    a fiddle with that code works as expected – Fabrizio Calderan Jan 30 '12 at 08:48
  • I was dealing with a question a couple of days ago where an official twitter button was doing funky things and placing iframes amongst other weird elements to create the button. Make sure you don't have any css rules that could be messing with that, a live demo of your site would be cool... – lpd Jan 30 '12 at 08:54

5 Answers5

7

I had this same problem, and it drove me nuts until I narrowed it down to cookies possibly being blocked. I was running an Add-On called 'Disconnect' from https://disconnect.me/ . Once I disabled this addon and restarted the browser the Tweet button started working again.

So if you're using that addon or any other one to block cookies or prevent you from being tracked by social networking sites, you'll need to disable it if you want to see the tweet button.

jcaruso
  • 950
  • 11
  • 19
3

I just noticed that I duplicated @jcaruso's reply.


tl;dr;

Try disabling ad-blocking extensions. For me the problems were caused by disconnect.me extension.


How I found that out? I noticed in the chrome dev console, that request to twitter to load widgets.js gets a 307 redirect to about:blank.

about:blank for Twitter js

Thanks to that answer I figured out that it's caused by one of the extensions. Disabling the disconnect.me extension fix the problem with twitter and facebook buttons on mine and other pages.

Community
  • 1
  • 1
botchniaque
  • 4,698
  • 3
  • 35
  • 63
1

For me it was the chrome extension AdBlock that was causing the issue.

Thanks to others for pointing me in the right direction!

Zack
  • 11
  • 3
0

See your code in action here It works fine in Firefox, Chrome and IE as I just tested.

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
  </head>
  <body>
  <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://www.3eesho.com/magazine/index.html" data-text="issue2 now" data-via="3eesho" data-hashtags="ipad,health,arabicmagazine">Tweet</a>
    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
  </body>
</html>

Check out the screenshot below, your code's performance in IE 8, Firefox 9, Chrome 16. it works as expected.

Screenshot for the code above

Community
  • 1
  • 1
Bala
  • 3,576
  • 10
  • 46
  • 74
  • Thank you Bala.C , I want to use this in local html page to insert it in ipad app , but first I have to make it work in the page , – lama Jan 30 '12 at 09:38
  • Thank you , yes when I test the code in html real-time editor it works fine , but I just can't see it when I open the html page in the browser ! I just see the text "tweet" – lama Jan 30 '12 at 09:55
  • @lama Check out the screenshot above, it works fine even in browsers as i said before. If its not working for you, there might be some CSS conflicts or some problem with your browser settings. – Bala Jan 30 '12 at 10:18
0

Your code is fine. If you can't see the button, this means you don't have access to twitter.com.

Make sure you can access twitter.com normally via your browser and that your company, firewall, parental control, etc is not blocking access or interfering with it in any way.

Hossein
  • 4,097
  • 2
  • 24
  • 46
  • I can open twitter normally and send tweets as well . – lama Jan 30 '12 at 10:11
  • 1
    the problem was in this part "//platform.twitter.com/widgets.js" I added `https:` I'm not sure why this makes a difference ! but the button works now! thank you for you all ! – lama Jan 30 '12 at 11:24
  • @lama +1 for your responses and responsibility to update with your solution :) – Bala Jan 30 '12 at 12:07