social sharing buttons for jekyll

social share

<script type="text/javascript">
	window.onload = function(){				
		var blogDomain = encodeURIComponent("{{ site.url }}");
		var pageTitleSpaces = encodeURIComponent("{{ page.title }}") + "&amp;";
		var pageID = "{{ page.id }}";
		var pageURL = encodeURIComponent(pageID) + "&amp;";
			
		var twitterPartOne = "https://twitter.com/intent/tweet?original_referer=";
		var twitterPartTwo = "text=";
		var twitterPartThree = "tw_p=tweetbutton&amp;url=";
		var twitterPartFour = "via=bigal";
		var twitterUrl = twitterPartOne + blogDomain + pageURL + twitterPartTwo + pageTitleSpaces + twitterPartThree + blogDomain +  pageURL + twitterPartFour;
		var twitterLink = document.getElementById("twitter-link");
		twitterLink.onclick = function() {popUp=window.open(twitterUrl, 'popupwindow', 'scrollbars=yes,width=600,height=400');popUp.focus();return false };
		
		var linkedinPartOne = "http://www.linkedin.com/shareArticle?mini=true&url=";
		var linkedinPartTwo = "&title=";
		var linkedinPartThree = "&summary=";
		var linkedinPartFour = "&source=";
		var linkedinUrl = linkedinPartOne + blogDomain + pageURL + linkedinPartTwo + pageTitleSpaces + linkedinPartFour + "@bigal";
		var linkedInLink = document.getElementById("linkedin-link");
		linkedInLink.onclick = function() {popUp=window.open(linkedinUrl, 'popupwindow', 'scrollbars=yes,width=600,height=400');popUp.focus();return false };
		
		var googlePlusPartOne = "https://plus.google.com/share?url=";
		var googlePlusUrl = googlePlusPartOne + blogDomain + pageID;
		var googlePlusLink = document.getElementById("googleplus-link");
		googlePlusLink.onclick = function() {popUp=window.open(googlePlusUrl, 'popupwindow', 'scrollbars=yes,width=600,height=400');popUp.focus();return false };
	};
</script>

Using the template engine for the URL and title information is unnecessary because this information is available from pure javascript. Using the native javascript functions allows putting this into a separate javascript file, like:

function loadCustomSocialButtons() {
    var twitterID = 'kcsaff';
    var linkedInID = 'kcsaff';

    var encodedTitle = encodeURIComponent(window.document.title);
    var encodedURL = encodeURIComponent(window.location.href);

    function popUpAction(url) {
        return function() {
            var popUp = window.open(url, 'popupwindow', 'scrollbars=yes,width=600,height=400');
            popUp.focus();
            return false;
        }
    }

    var twitterUrl = "https://twitter.com/intent/tweet?original_referer=" + encodedURL +
        "&text=" + encodedTitle +
        "&tw_p=tweetbutton&url=" + encodedURL +
        "&via=" + twitterID;
    var twitterLink = document.getElementById("twitter-link");
    twitterLink.onclick = popUpAction(twitterUrl);

    var linkedinUrl = "http://www.linkedin.com/shareArticle?mini=true&url=" + encodedURL +
        "&title=" + encodedTitle +
        "&source=@" + linkedInID;
    var linkedInLink = document.getElementById("linkedin-link");
    linkedInLink.onclick = popUpAction(linkedinUrl);

    var googlePlusUrl = "https://plus.google.com/share?url=" + encodedURL;
    var googlePlusLink = document.getElementById("googleplus-link");
    googlePlusLink.onclick = popUpAction(googlePlusUrl);
}