Middleman 3
A cheatsheet by @rstacruz|Refreshed 7 months ago.Refresh|View source on Github

NB: This is for Middleman 3, not Middleman 4+.

Compass config

Compass config

compass_config do |config|
  config.output_style = :compact
end

Config

Config

# Automatic image dimensions on image_tag helper
activate :automatic_image_sizes

Gems

Gems

# Susy grids in Compass
# First: gem install compass-susy-plugin
require 'susy'

# CodeRay syntax highlighting in Haml
# First: gem install haml-coderay
require 'haml-coderay'

# CoffeeScript filters in Haml
# First: gem install coffee-filter
require 'coffee-filter'

Page command

Page command

# With no layout
page "/path/to/file.html", :layout => false

# With alternative layout
page "/path/to/file.html", :layout => :otherlayout

# A path which all have the same layout
with_layout :admin do
  page "/admin/*"
end

# Proxy (fake) files
page "/this-page-has-no-template.html", :proxy => "/template-file.html" do
  @which_fake_page = "Rendering a fake page with a variable"
end

Helpers

Helpers

helpers do
  def some_helper
    "Helping"
  end
end

Directories

Directories

set :css_dir, "alternative_css_directory"
set :js_dir, "alternative_js_directory"
set :images_dir, "alternative_image_directory"
configure :build do
  activate :minify_css
  activate :minify_javascript

  # Enable cache buster
  activate :cache_buster

  # Use relative URLs
  activate :relative_assets

  # Compress PNGs after build
  # First: gem install middleman-smusher
  # require "middleman-smusher"
  activate :smusher

  # Or use a different image path
  set :http_path, "/Content/images/"
end