Tech Note: Creating Tweet Buttons Dynamically

LGF • Views: 7,278

As I mentioned yesterday, I’ve integrated Twitter’s new official “Tweet Button” into the LGF Blog code to see how it compares to our previous Tweet button/retweet count feature, which calls the API at bit.ly to get the count statistics.

But I ran into a problem with the Twitter code: it’s intended to work only on page load, and there’s no documented way to dynamically add Tweet Buttons to content generated via Ajax. This meant I couldn’t add Tweet Buttons to the articles that appear when you click the “Show More Articles” button at the bottom of the LGF front page.

So I took a look at Twitter’s Javascript code for generating the buttons, which is located here. It’s “minified,” so I ran it through the Javascript unpacker and beautifier first, then read through the code (it’s pretty short) and discovered that installing a Tweet Button is a simple matter of instantiating a “TweetButton” object (passing it the DOM object — not the jQuery object — for the link that will be turned into a button), then calling the TweetButton’s “render” method.

The code to do this dynamically via jQuery is surprisingly simple. (The variable “thediv” is the container for the newly loaded articles.)

$(thediv).find('a.twitter-share-button').each(function(i) {
	var thisTweetButton = new twttr.TweetButton($(this).get(0));
	thisTweetButton.render();
});

A sidenote: I’ve noticed that the official Tweet Button is reporting lower numbers for the retweet count than bit.ly’s API does. It’s not immediately apparent why there’s a discrepancy.

Jump to top

Create a PageThis is the LGF Pages posting bookmarklet. To use it, drag this button to your browser's bookmark bar, and title it 'LGF Pages' (or whatever you like). Then browse to a site you want to post, select some text on the page to use for a quote, click the bookmarklet, and the Pages posting window will appear with the title, text, and any embedded video or audio files already filled in, ready to go.
Or... you can just click this button to open the Pages posting window right away.
Last updated: 2016-01-01 10:29 am PST
LGF User's Guide RSS Feeds Tweet

Help support Little Green Footballs!

Subscribe now for ad-free access!Register and sign in to a free LGF account before subscribing, and your ad-free access will be automatically enabled.

Donate with
PayPal
Square Cash Shop at amazon
as an LGF Associate!
Recent PagesClick to refresh
E-Cig Co. Put Viagra, Cialis in Vape Liquids—the FDA Is Throbbing Mad The US Food and Drug Administration made clear on Thursday, October 11 that it has a major bone to pick with an electronic-cigarette vendor that illegally pumped prescription erectile dysfunction drugs into unapproved e-liquid products intended for vaping. The ...
Thanos
1 day, 2 hours ago
Views: 109 • Comments: 0 • Rating: 0
Tweets: 2 • Share to Facebook
Shares: 0
Comments: 0
: 0
Answering Voter Guide Questions as a Candidate So, my county newspaper, the Bridgeport, NE News-Blade sent me a questionnaire to create a voter guide for village voters asking my positions on issues in my town. I suppose I could expound on those for many pages, but ...
Anymouse 🌹
1 week ago
Views: 483 • Comments: 0 • Rating: 0
Tweets: 0 • Share to Facebook
Shares: 0
Comments: 0
: 0
Marvel’s Daredevil: Season 3 - Meet BullsEye See the origin story of Bullseye in Marvel's Daredevil Season 3, premiering exclusively on Netflix October 19, 2018. Watch Marvel's Daredevil on Netflix: netflix.com #Netflix #MarvelsDaredevil #CharlieCoxSUBSCRIBE: bit.ly About Netflix:Netflix is the world's leading internet entertainment service with 130 ...
Thanos
1 week, 2 days ago
Views: 554 • Comments: 0 • Rating: 0
Tweets: 1 • Share to Facebook
Shares: 0
Comments: 0
: 0
St. Vincent - Slow Slow Disco (Audio)Songs are living things. They grow, they evolve, they change their moods and personalities over time. The latest version of 'Slow Disco' originally found on MASSEDUCTION. Upcoming Live Shows: ilovestvincent.com Connect with St. Vincent:instagram.com@st_vincentfacebook.com
Thanos
1 week, 6 days ago
Views: 678 • Comments: 0 • Rating: 0
Tweets: 1 • Share to Facebook
Shares: 0
Comments: 0
: 0
Sarah Palin’s Son Arrested on Domestic Violence Charges Sarah Palin's oldest son, Track Palin, was arrested Friday on domestic violence charges, Alaska State Troopers said. Troopers responded to his home in Wasilla at 10:37 p.m. after a report of a disturbance. Palin allegedly assaulted an acquaintance, then ...
Thanos
2 weeks, 1 day ago
Views: 688 • Comments: 1 • Rating: 0
Tweets: 2 • Share to Facebook
Shares: 0
Comments: 0
: 0
Elvis Costello & the Imposters - Suspect My Tears (Audio) "Suspect My Tears" from the forthcoming album Look NowPre-order the new album Look Now:Official Store (signed + exclusive merch): found.eeAmazon (CD + vinyl): found.eeiTunes (digital download): found.eeSpotify (pre-save): found.eeApple Music (pre-add): found.ee Listen to “Suspect My Tears”:iTunes: found.eeSpotify: found.eeApple ...
Thanos
2 weeks, 2 days ago
Views: 679 • Comments: 0 • Rating: 0
Tweets: 1 • Share to Facebook
Shares: 0
Comments: 0
: 0
Dark Phoenix In DARK PHOENIX, the X-MEN face their most formidable and powerful foe: one of their own, Jean Grey. During a rescue mission in space, Jean is nearly killed when she is hit by a mysterious cosmic force. Once she ...
Thanos
2 weeks, 4 days ago
Views: 706 • Comments: 1 • Rating: 1
Tweets: 1 • Share to Facebook
Shares: 0
Comments: 0
: 0