Skip to content

Instantly share code, notes, and snippets.

@ColeTownsend
Created March 24, 2013 04:27
Show Gist options
  • Save ColeTownsend/5230543 to your computer and use it in GitHub Desktop.
Save ColeTownsend/5230543 to your computer and use it in GitHub Desktop.
A CodePen by Cole Townsend.
<div class="container">
<a href="https://twitter.com/share" class="twitter-share-button tweet" data-text="{PostTitle} - {PostSummary}" data-via="{Text:Twitter Username}" data-hashtags="#{BlogName}">
<span class="count">0</span>
<span class="message">Tweet</span>
</a>
</div>
<script type="text/javascript">//<![CDATA[
$(window).load(function(){
var API_URL = "http://cdn.api.twitter.com/1/urls/count.json",
TWEET_URL = "https://twitter.com/intent/tweet";
$(".tweet").each(function() {
var elem = $(this),
// Use current page URL as default link
url = encodeURIComponent(elem.attr("data-url") || document.location.href),
// Use page title as default tweet message
text = elem.attr("data-text") || document.title,
via = elem.attr("data-via") || "",
related = encodeURIComponent(elem.attr("data-related")) || "",
hashtags = encodeURIComponent(elem.attr("data-hashtags")) || "";
// Set href to tweet page
elem.attr({
href: TWEET_URL + "?hashtags=" + hashtags + "&original_referer=" +
encodeURIComponent(document.location.href) + "&related=" + related +
"&source=tweetbutton&text=" + text + "&url=" + url + "&via=" + via,
target: "_blank"
});
// Get count and set it as the inner HTML of .count
$.getJSON(API_URL + "?callback=?&url=" + url, function(data) {
elem.find(".count").html(data.count);
});
});
});//]]>
</script>
@import "compass"
*
border-sizing: border-box
html
font-size: 62.5%
body
font-size: 2rem
font-family: "Brandon Grotesque"
font-weight: bold
.container
position: relative
display: block
margin: 0 auto
.tweet
text-decoration: none
height: 2rem
background: #e0e0e0
color: #2a2a2a
line-height: 2rem
padding: 2rem
position: relative
.count, .message
line-height: 2rem
position: relative
top: 1rem
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment