DEV Community

dss99911
dss99911

Posted on • Originally published at dss99911.github.io

Jekyll Theme Usage - How to Find and Change Themes

Jekyll themes control the look and feel of your website. This guide explains how to locate theme files and customize your Jekyll site's appearance.

Finding Theme Files

When you want to customize a theme, you first need to find where the theme files are located.

Locate the theme directory

bundle info --path minima
Enter fullscreen mode Exit fullscreen mode

This command shows the path to the theme files. You can copy files from this directory to your project to override them.

Changing Themes

Method 1: Change in _config.yml

Edit your _config.yml file to change the theme:

theme: minima
Enter fullscreen mode Exit fullscreen mode

For remote themes (from GitHub):

remote_theme: owner/repository
Enter fullscreen mode Exit fullscreen mode

Method 2: Install a New Gem Theme

  1. Add the theme to your Gemfile:
gem "jekyll-theme-minimal"
Enter fullscreen mode Exit fullscreen mode
  1. Run bundle install:
bundle install
Enter fullscreen mode Exit fullscreen mode
  1. Update _config.yml:
theme: jekyll-theme-minimal
Enter fullscreen mode Exit fullscreen mode

Popular Jekyll Themes

  • Minima: Default Jekyll theme, clean and simple
  • Minimal Mistakes: Feature-rich, great for blogs and portfolios
  • Just the Docs: Perfect for documentation sites
  • Chirpy: Modern blog theme with dark mode

Customizing Theme Layouts

To override a theme file:

  1. Find the original file path using bundle info --path
  2. Create the same directory structure in your project
  3. Copy and modify the file

For example, to customize the header:

mkdir -p _includes
cp $(bundle info --path minima)/_includes/header.html _includes/
Enter fullscreen mode Exit fullscreen mode

Reference


Originally published at https://dss99911.github.io

Top comments (0)