This post demonstrate my fork of Yihui’s knitr-jekyll which tweaks the default layout to resemble tufte-jekyll. As Yihui mentions in his knitr-jekyll blog post (which I highly recommend reading), GitHub Pages does not support arbitrary Jekyll plugins, but I’ve managed to remove tufte-jekyll’s dependency on custom plugins via custom knitr output hooks. Not only does this allow GitHub Pages to build and host this template automagically, but it also fixes tufte-jekyll’s problem with figure paths.

The rest of this post shows you how to use these custom hooks and some other useful things specific to this template (at some point, you might also want the source for this post)

### Figures

By default, the fig.width chunk option is equal to 7 inches. Assuming the zoom of your browser window is at 100%, that translates to about 3/4 of the textwidth.

Figure 1: A nice plot that is not quite wide enough. Note that this figure caption was created using the fig.cap chunk option

If we increase fig.width to a ridiculous number, say 20 inches, it will still be constrained to the text width by default.

Figure 2: The fig.height for this chunk is same as Figure 1, but the fig.width is now 20. Since the width is constrained by the text width, the figure is shrunken quite a bit.

By constraining the figure width, it will ensure that figure captions (set via fig.cap) appear correctly in the side margin. If you don’t want to restrict the final figure width, set the fig.fullwidth chunk option equal to TRUE. In this case, the figure caption is placed in the side margin below the figure.

Figure 3: Full width plot

To place figures in the margin, set the fig.margin chunk option equal to TRUE.

Figure 4: useR logo

## Sizing terminal output

The default R terminal output width is 80, which is a bit too big for the styling of this blog, but a width of 55 works pretty well:

## Mathjax

If you want inline math rendering, put $$math$$ inline. For example, $\Gamma(\alpha) = (\alpha - 1)!$. If you want it on it’s own line, do something like:

which results in

## Margin notes

Much margin. So excite.

Put stuff in the side margin using the <span> HTML tag with a class of ‘marginnote’:

Another (less cute) example of margin notes is to add a table caption. In fact, the figure captions above are just margin notes.

Table 1: Output from a simple linear regression in tabular form.

term estimate std.error statistic p.value
(Intercept) 1.357 0.263 5.17 0.000
wt -0.286 0.078 -3.65 0.001

## Sidenotes

Similar to a ‘marginnote’ is a ‘sidenote’ 1 which works like this

1 Sidenotes are kind of like footnotes that appear in the side margin.

Unfortunately, this is a lot of HTML markup, but of course1, you can also do footnotes, so that might be a better option.

## Contact me

If you find any issues or want to help improve the implementation, please let me know!

## Session Information

1. I hate it when people say “of course” as though this is obvious everyone.