Skip to content

Instantly share code, notes, and snippets.

Building for Shopify

Jonathan Moore jonathanmoore

Building for Shopify
View GitHub Profile
balupton /
Last active Dec 9, 2015
DocPad: Get Ruby, SASS and DocPad working on Heroku

DocPad: Get Ruby, SASS and DocPad working on Heroku

Getting Ruby, SASS and DocPad working on Heroku involves two steps:

  1. Ensuring all your plugins are the latest version. Open up your package.json and change all your docpad plugin dependency versions to 2.x and your docpad version to 6.x. Once done, run rm -Rf node_modules; npm install to grab the latest versions of everything.

  2. Installing Ruby and SASS on Heroku. Copy over the Gemfile, Gemfile.lock, and the .buildpacks files from to your own website. Then run heroku config:add BUILDPACK_URL= to tell heroku to use multiple buildpacks. Once done, deploy to heroku via git push heroku master and you may need to run heroku restart as sometimes the initial deploy fails.

balupton /
Last active Oct 11, 2015
DocPad: Minify your assets with Grunt

DocPad: Minify your assets with Grunt

The following will minify your assets with grunt each time a generation write completes.


  1. Install Dependencies
dannygarcia / grunt.js
Created Sep 20, 2012
Sample grunt-jekyll grunt.js
View grunt.js
// Sample grunt-jekyll grunt.js file
/*global module:false*/
module.exports = function(grunt) {
// Project configuration.
jekyll: {
marcedwards / high-dpi-media.css
Last active Jun 28, 2021
A CSS media query that captures almost all high DPI aware devices.
View high-dpi-media.css
/* ---------------------------------------------------------- */
/* */
/* A media query that captures: */
/* */
/* - Retina iOS devices */
/* - Retina Macs running Safari */
/* - High DPI Windows PCs running IE 8 and above */
/* - Low DPI Windows PCs running IE, zoomed in */
/* - Low DPI Windows PCs and Macs running Firefox, zoomed in */
/* - Android hdpi devices and above */
65 / pinterest.js
Created Feb 26, 2012
pinterest buttons on every image in a blog post using jquery
View pinterest.js
$().ready(function() {
$('.entry-body img').each(function(){
var $permalink = $(this).parents('.entry').find('.permalink').attr('href');
$(this).wrap('<div class="pinme" style="' + $(this).attr('style') + '" />').after('<a href="' + $permalink + '&media=' + $(this).attr('src') + '&description=' + $(this).attr('alt') + '" class="pin-it-button" count-layout="vertical">Pin It</a>');
$('.pinme').hover(function() {
}, function() {
coolaj86 /
Last active Sep 14, 2021
How to publish packages to NPM

Getting Started with NPM (as a developer)

If you haven't already set your NPM author info, now you should:

npm set "Your Name"
npm set ""
npm set "https:/"

npm adduser
lucasfais / gist:1207002
Created Sep 9, 2011
Sublime Text 2 - Useful Shortcuts
View gist:1207002

Sublime Text 2 – Useful Shortcuts (Mac OS X)


⌘T go to file
⌘⌃P go to project
⌘R go to methods
⌃G go to line
⌘KB toggle side bar
⌘⇧P command prompt
yconst / gist:964345
Created May 10, 2011 — forked from paulirish/
imagesLoaded() jquery plugin
View gist:964345
// $('',this).imagesLoaded(myFunction)
// execute a callback when all images have loaded.
// needed because .load() doesn't work on cached images
// Modified with a two-pass approach to changing image
// src. First, the proxy imagedata is set, which leads
// to the first callback being triggered, which resets
// imagedata to the original src, which fires the final,
// user defined callback.