N-archive/hacks-guide-minimal-mistakes-theme
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Add theme setup instructions

Browse source
This commit is contained in:
Michael Rose 2013-05-24 15:26:50 -04:00
parent 5bc1988f7c
commit 580267e671
2 changed files with 5 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
README.md
View file

@ -10,6 +10,8 @@ Jekyll is pretty rad and figured releasing a cleaned up version of [my setup](ht
* Large feature images for posts and pages.
* Simple and clear permalink structure *(ie: domain.com/category/post-title)*
![screenshot of Minimal Mistakes theme](http://mmistakes.github.io/minimal-mistakes/images/mm-theme-post-600.jpg)
General notes and suggestions for customizing Minimal Mistakes.
## Basic Setup
@ -50,7 +52,7 @@ minimal-mistakes/
### _config.yml
Variables you want to update are: site name, description, url[^1], owner info, and your Google Anayltics tracking id and webmaster tool verifications. Most of these variables are used in the .html files found in *_includes* if you need to add or remove anything.
Variables you want to update are: site name, description, url, owner info, and your Google Anayltics tracking id and webmaster tool verifications. Most of these variables are used in the .html files found in *_includes* if you need to add or remove anything.
### Adding Posts and Pages
@ -58,7 +60,7 @@ There are two main content layouts: *post.html* (for posts) and *page.html* (for
#### Feature Images
A good rule of thumb is to keep feature images[^2] nice and wide so you don't push the body text too far down. An image cropped around around 1024 x 512 pixels will keep file size down with an acceptable resolution for most devices. On my personal site I use [Picturefill](https://github.com/scottjehl/picturefill) to serve the same image responsively in four different flavors (small, medium, large, and extra large). In the interest of keeping things simple with this theme I left that script out, but you can certainly [add it back in](https://github.com/mmistakes/made-mistakes#articles-and-pages) or give [Adaptive Images](http://adaptive-images.com/) a try.
A good rule of thumb is to keep feature images nice and wide so you don't push the body text too far down. An image cropped around around 1024 x 512 pixels will keep file size down with an acceptable resolution for most devices. On my personal site I use [Picturefill](https://github.com/scottjehl/picturefill) to serve the same image responsively in four different flavors (small, medium, large, and extra large). In the interest of keeping things simple with this theme I left that script out, but you can certainly [add it back in](https://github.com/mmistakes/made-mistakes#articles-and-pages) or give [Adaptive Images](http://adaptive-images.com/) a try.
The two layouts make the assumption that the feature images live in the *images* folder. To add a feature image to a post or page just include the filename in the front matter like so.
@ -98,8 +100,4 @@ Not sure if this only effects Kramdown or if it's an issue with Markdown in gene
``` html
<iframe width="560" height="315" src="http://www.youtube.com/embed/PWf4WUoMXwg" frameborder="0"> </iframe>
```
[^1]: Used to generate absolute urls in *sitemap.xml*, *feed.xml*, and for canonical urls in *head.html*. Don't include a trailing `\` in your base url ie: http://mademistakes.com. When developing locally remove or comment out this line so local css, js, and images are used.
[^2]: Feature images supplied by [Love Textures](http://www.lovetextures.com/)
```

BIN
images/mm-theme-post-600.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 88 KiB