Dash Marshall



This website’s content is written in plain text. But you can format and structure the text with Markdown + YAML syntax. Additional options custom to dashmarshall.com are detailed below.

The content of the header can be modified per page with several optional YAML properties:

  • title overrides the default page title (derived from the filename) for SEO and sharing.
  • description same as the above, overriding default copy for the description.
  • featured sets the text in the upper left corner. It may be formatted with Markdown.
  • image adds a header background, scaled/cropped to fit. Also used for Facebook/Twitter.
  • video swaps an image for automatically playing video — muted. details
  • nav takes pairs of text and URLs that will override the nav links.
  • style takes a space separated list of CSS class names details


The header’s content can also be randomized per page, by defining a header property that lists sets of properties to set at random on page load.


  - image: /spaces/mss/IMG_2614.jpg
    featured: Reconfigurable coworking<br>in Brooklyn

  - image: /spaces/fla/Dash Marshall_FLA_kitchen2-3000.jpg
    featured: Building a wormhole<br>above Bond St.

  - image: /spaces/mgn/dash marshall-6624.jpg
    featured: Living with a Monolith


Add {.center} to an element to center any text or inline images therein.

Body text is set in 1.2em Arial Black by default. Use any of the following options to go bigger with Berlingske Serif Heavy at 2.4em.

  • Use h1 and h2 headings
  • Emphasize paragraph content with **
  • Add style: heavy-serif to the YAML to scale up everything on a page

+++ sidebar

Sidebars are pulled out of the main flow content, appearing to the left of any following elements. To keep everything perfectly flush, add a --- dashed rule before the sidebar to neutralize any preceding spacing.

+++ sidebar nav

Suppresses default list formatting for adding a menu of links. Heading text is converted to # anchors for in-page navigation.


Wrap content in a block demarcated with +++ and any of these options.

+++ grid two

Dolluh Dolluh

+++ grid three

Dolluh Dolluh Dolluh

+++ grid four

Dolluh Dolluh Dolluh Dolluh

+++ grid six

Dolluh Dolluh Dolluh Dolluh Dolluh Dolluh

+++ full


+++ item

Groups content together and adjusts default spacing such that everything inside is closer together while keeping each group evenly spaced apart.


An item

Dolluh The Sidebar can have images too.


Another item


Any images (JPG, PNG, SVG) found within the content folder are automatically copied into the website and resized as needed. The structure of any parent folders will also be carried over. Reference images with absolute paths like this:

![Alt text](/folder/file.jpg]

PDF files can be similarly linked to offer for download, just remove the ! prefix.

‘Loadfast’ images

By defauly, all images have double pixel density for Apple Retina displays and similar devices. This makes great looking images, but also heavy pages. For places where you want things to load quickly, like project index pages (/spaces/) you can use {.loadfast} on images like so:

[![Secluded Innovation](</strategy/offsite/buckydome.jpg>)][secluded]{.loadfast}

Auto-sized images

Add {.auto} for any images that should always be displayed at their native size.

+++ slideshow

not Dolluh not Dolluh not Dolluh not Dolluh

This will gather up all images therein into a slideshow. Speed it up or slow it down by specifying the desired milliseconds between slides like so: +++ slideshow slideshow--3000


Link to a vimeo.com-hosted video and a player will be automatically embedded in place.

Salon Eva Michelle video

Video Backgrounds

Videos can also be placed in the header as a background. Vimeo players won’t work, link to raw MPEG-4 video instead. Vimeo provides the direct URL to hosted videos as a Plus feature, but any host will work. Encode video with H.264 if IE 9 support is a concern and be sure to remove the audio track — it will be muted anyway.

Page Styles

The style property in each page’s YAML is a way to apply CSS classes to the header and main block elements. This is useful primarily for applying color palettes but can also be used for setting type differently or any other custom CSS. Styles are prefixed with header-- and --main respectively and should be defined in /browser/styles.css.