Creating a Blog with Jekyll and Markdown Syntax Highlighting

Creating a blog with Jekyll and Markdown syntax highlighting is a popular choice for developers and writers who want a simple, customizable, and efficient platform. Jekyll is a static site generator that transforms plain text files into a complete website, while Markdown provides an easy way to format content. When combined with syntax highlighting, they create a professional-looking blog suitable for technical content.

Getting Started with Jekyll

First, you need to install Jekyll on your computer. Jekyll requires Ruby, so ensure Ruby and RubyGems are installed. Then, run the following command to install Jekyll:

gem install jekyll

Once installed, create a new Jekyll site with:

jekyll new myblog

Navigate into your new site directory:

cd myblog

Writing Posts with Markdown

Jekyll uses Markdown files stored in the _posts directory. Each post starts with a filename in the format YYYY-MM-DD-title.md. Inside, you include front matter and content:

---
layout: post
title: "My First Post"
date: 2024-04-27
---

Write your content using Markdown syntax. To include code blocks with syntax highlighting, use triple backticks and specify the language:

```python
def hello_world():
print("Hello, world!")
```

Enabling Syntax Highlighting

Jekyll supports syntax highlighting through the Rouge library by default. To activate it, add the following to your _config.yml file:

highlighter: rouge

You can also specify the theme for syntax highlighting by adding:

markdown: kramdown
kramdown:
syntax_highlighter: rouge
syntax_highlighter_opts:
css_class: 'highlight'

Preview and Deployment

After writing your posts, build your site with:

bundle exec jekyll serve

This command starts a local server at http://localhost:4000 where you can preview your blog. When ready, deploy your site to a hosting platform like GitHub Pages or Netlify.

Conclusion

Using Jekyll with Markdown and syntax highlighting provides a powerful and flexible way to create a technical blog. It allows easy content management, beautiful code display, and simple deployment. Start experimenting with your own site today!