David Hund davidhund

Share Counts

I have always struggled with getting all the various share buttons from Facebook, Twitter, Google Plus, Pinterest, etc to align correctly and to not look like a tacky explosion of buttons. Seeing a number of sites rolling their own share buttons with counts, for example The Next Web I decided to look into the various APIs on how to simply return the share count.

If you want to roll up all of these into a single jQuery plugin check out Sharrre

Many of these API calls and methods are undocumented, so anticipate that they will change in the future. Also, if you are planning on rolling these out across a site I would recommend creating a simple endpoint that periodically caches results from all of the APIs so that you are not overloading the services will requests.

Twitter

Tiny Content Framework

About the project

This is a tiny content strategy framework focused on goals, messages, and branding. This is not a checklist. Use what you need and scrap the rest. Rewrite it or add to it. These topics should help you get to the bottom of things with clients and other people you work with.

Give me feedback on Twitter (@nicoleslaw) or by email ([email protected]).

	//addEventListener polyfill 1.0 / Eirik Backer / MIT Licence
	(function(win, doc){
	if(win.addEventListener)return; //No need to polyfill

	function docHijack(p){var old = doc[p];doc[p] = function(v){return addListen(old(v))}}
	function addEvent(on, fn, self){
	return (self = this).attachEvent('on' + on, function(e){
	var e = e \|\| win.event;
	e.preventDefault = e.preventDefault \|\| function(){e.returnValue = false}
	e.stopPropagation = e.stopPropagation \|\| function(){e.cancelBubble = true}

	"""
	Zen Coding settings
	@author Sergey Chikuyonok ([email protected])
	@link http://chikuyonok.ru
	"""
	zen_settings = {

	# Variables that can be placed inside snippets or abbreviations as ${variable}
	# ${child} variable is reserved, don't use it
	'variables': {

	!('querySelectorAll' in document) && ('contains' in document.documentElement) && (function (window, document) {
	var
	documentHead = document.getElementsByTagName('head')[0],
	querySelectorElement = document.createElement('style'),
	querySelectorPrototypeElement = document.createElement('style');

	documentHead.insertBefore(querySelectorElement , documentHead.firstChild);
	documentHead.insertBefore(querySelectorPrototypeElement, documentHead.firstChild);

	function querySelectorAll(selector) {

	/*
	Make the Facebook Like box responsive (fluid width)
	https://developers.facebook.com/docs/reference/plugins/like-box/
	*/

	/* This element holds injected scripts inside iframes that in some cases may stretch layouts. So, we're just hiding it. */
	#fb-root {
	display: none;
	}

	<!doctype html>
	<html>
	<head>

	<title>CSS Media Check</title>

	<style type="text/css">
	#mediaquery{
	-webkit-transition: width .001s;
	-moz-transition: width .001s;

	var parser = document.createElement('a');
	parser.href = "http://example.com:3000/pathname/?search=test#hash";

	parser.protocol; // => "http:"
	parser.hostname; // => "example.com"
	parser.port; // => "3000"
	parser.pathname; // => "/pathname/"
	parser.search; // => "?search=test"
	parser.hash; // => "#hash"
	parser.host; // => "example.com:3000"

	# Filename-based cache busting
	# taken from https://github.com/h5bp/html5-boilerplate/

	# This rewrites file names of the form `name.123456.js` to `name.js`
	# so that the browser doesn't use the cached version when you have
	# updated (but not manually renamed) the file.

	<IfModule mod_rewrite.c>
	Options +FollowSymlinks
	RewriteEngine On

	/*!
	An experiment in getting accurate visible viewport dimensions across devices
	(c) 2012 Scott Jehl.
	MIT/GPLv2 Licence
	*/

	function viewportSize(){
	var test = document.createElement( "div" );

	test.style.cssText = "position: fixed;top: 0;left: 0;bottom: 0;right: 0;";

David Hund davidhund

Share Counts

Tiny Content Framework

About the project

Contents