CODEWITHSUNDEEP
javascriptjquerybuttontwitter
Programmer4me
Programmer4me

Reputation: 99

Tweet button looks like a normal <a> link without any JS or CSS

I am trying to embed the Tweet button in my website, I already added 

<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>

inside <head>, widgets.js gets included normally and everything looks fine when i put

<a href="https://twitter.com/share" class="twitter-share-button" data-size="large" data-count="none">Tweet</a>

But the problem is, When i use

$('.someclasses').append('<a href="https://twitter.com/share" class="twitter-share-butto ...</a>');

the button will be appended, but this time it doesn't looks fine, But looks like a normal link without any CSS or JS effects, As well as the link guide me to https://twitter.com/share

Any solutions ? Thanks :)

Upvotes: 1

Views: 244

Answers (3)

erdomester
erdomester

Reputation: 11829

I had the Disconnect extension in Chrome. I figured this out the hard way after struggling for hours. After removing it, it worked fine. Didn't even need to close Chrome windows.

Upvotes: 0

Programmer4me
Programmer4me

Reputation: 99

Thank you all, The solution for this is to put this code under the appended <a> element :

twttr.widgets.load();

Upvotes: 0

Fabrizio Calderan
Fabrizio Calderan

Reputation: 123418

you need to re-apply the twitter script. After you append your new elements try this snippet:

$('.someclasses > a.twitter-share-button').each(function() {
    var tweet_button = new twttr.TweetButton(this);
    tweet_button.render();
});

Upvotes: 1

Related Questions