Quick Modifications to Jekyllnow

Jekyllnow is a popular theme for Jekyll and GitHub pages. I like it because of its simplicity and sparse default layout. Here are the customizations I have applied.


Center an image or block of text. HTML to use inside markdown

<div class="img_center">
Item to center

Add to style.scss

  text-align: center;

Append to the existing Kramdown block of _config.yml

  parse_block_html: true

Requisite stackoverflow reference.

Embed Videos

Create a HTML file called youtube.html in your includes file.

<iframe width="560" height="315" src="https://www.youtube.com/embed/" frameborder="0" allowfullscreen></iframe>

In the page or post’s front matter:

youtubeId: 2MsN8gpT6jY

In the body where you want the video use:

  {% include youtube.html id=page.youtubeId %}  

Create another HTML file called vimeo.html in your includes file.

<iframe src="https://player.vimeo.com/video/" width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

In the page or post’s front matter:

vimeoId: 160580156

In markdown use:

 {% include vimeo.html id=page.vimeoId %} 

Credit to Adam Harris

Syntax Highlighting to a Dark theme

From Pygments CSS Themes download a css file, add it to the _sass directory, then rename it to _name.scss.

In the style.scss file, change:

@import "highlights";


@import "name";

I selected monokai, it is the closest to the One Dark theme I use for Atom.

Additional Reading

GitHub Pages Compatible Plugins