Make Marked.App Work with Pandoc and TufteCSS
Update! The next version of Marked.app will replace the old Antique theme with Tufte styling in the next update!
This comes in really handy when you want to see what your document will look like, references and all.
Things you'll need:
First, install the ET-Book fonts locally. They're very pretty.
- Unzip the ET-book zip file
- Go into each subfolder
- Double click on each
.ttffont and install using Font Book.
Configure Marked to work use Pandoc as the markdown processor.
- Open Marked.app
- Open Preferences (Marked.app → Preferences)
- Click Advanced
- In the "Path" field, add
- In the "Args" field, add
-f markdown -t html5 -s -S --normalize --bibliography /users/username/dropbox/refs/bibliography.bib --csl /Users/username/src/Pandoc/apa.cslReplace these with your BibTeX bibliography and whatever CSL you prefer.
Next, let Marked.app know about
- Open Marked.app's preferences
- Click "Style"
- Under "Custom Styles" click "Custom CSS Example"
- Click the "Reveal" button
- In a new Finder window, unzip the
tufte-csszip file and open that folder.
README.md, and the
- Copy the remaining files to the folder Marked.app opened when you revealed the location of the "Custom CSS Example."
- In Marked.app's preferences, click the "+" button and drag the
tufte.cssfile into that dialog box so you don't have to find it manually.
- Change your "Default style" to
Now when you drag a markdown document onto Marked.app for it to watch, it'll reference your bibliography, apply the CSL, and compile the document with Pandoc, and refresh every time you save.
Make sure the green dot in the lower right-hand corner is on. This indicates Marked.app is using Pandoc.
If the text column is too thin, resize the window. The
tufte.css theme likes it a little smaller. I'm sure there's some way to turn off it's dynamic resizing in CSS, but I haven't messed with it.
Please let me know if I left anything out or if this didn't work for you.