balupton

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 https://github.com/docpad/sass-heroku-test to your own website. Then run heroku config:add BUILDPACK_URL=https://github.com/ddollar/heroku-buildpack-multi.git 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

DocPad: Minify your assets with Grunt

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

Installation

1. Install Dependencies

dannygarcia

// Sample grunt-jekyll grunt.js file
// https://github.com/dannygarcia/grunt-jekyll

/*global module:false*/
module.exports = function(grunt) {

	// Project configuration.
	grunt.initConfig({

		jekyll: {

marcedwards

/* ---------------------------------------------------------- */
/*                                                            */
/* 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

$().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="http://pinterest.com/pin/create/button/?url=' + $permalink + '&media=' + $(this).attr('src') + '&description=' + $(this).attr('alt') + '" class="pin-it-button" count-layout="vertical">Pin It</a>');
	});
	$('.pinme').hover(function() {
	      $(this).children('iframe').css('display','block');
	}, function() {
	      $(this).children('iframe').css('display','none');

coolaj86

Getting Started with NPM (as a developer)

As easy as 1, 2, 3!

Updated:

• Aug, 08, 2022 update config docs for npm 8+
• Jul 27, 2021 add private scopes
• Jul 22, 2021 add dist tags
• Jun 20, 2021 update for --access=public
• Sep 07, 2020 update docs for npm version

lucasfais

Sublime Text 2 – Useful Shortcuts (Mac OS X)

General

⌘T	go to file
⌘⌃P	go to project
⌘R	go to methods
⌃G	go to line
⌘KB	toggle side bar
⌘⇧P	command prompt

yconst

// $('img.photo',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.