Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
Pin it button centered below the first image of every post in Blogger. Requires jQuery (1.7.1 earliest version tested). Only recommended for blogs that center the first image. This code skips images under 300px wide. Change the 300 in line 9 to another number if you'd like to change that.
$(document).ready(function() {
$('.entry-content').each(function() {
var image = $(this).find('img').first();
var permalink = image.parents('.post-outer').find('.timestamp-link').attr('href') || $(location).attr('href');
var title = image.parents('.post-outer').find('.entry-title').text();
var width = image.width();
if (width >= 300) {
$('.separator a').removeAttr('imageanchor style');
$('<div class=\'pinit-button\'><a href="' + permalink + '&media=' + image.attr('src') + '&description=' + title + '" class="pin-it-button" count-layout="none"></a></div>').insertAfter(image);
(function() {
window.PinIt = window.PinIt || { loaded:false };
if (window.PinIt.loaded) return;
window.PinIt.loaded = true;
function async_load(){
var s = document.createElement("script");
s.type = "text/javascript";
s.async = true;
s.src = "";
var x = document.getElementsByTagName("script")[0];
x.parentNode.insertBefore(s, x);
if (window.attachEvent)
window.attachEvent("onload", async_load);
window.addEventListener("load", async_load, false);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.