Getting Started
v2.1Learn how to install and configure the Jekyll theme
This guide will help you get started with this Jekyll theme in just a few minutes.
Prerequisites
Before you begin, make sure you have the following installed:
- Ruby 3.0 or higher
- Bundler gem (
gem install bundler) - Git
Installation
- Clone or download this repository:
git clone https://github.com/username/repo.git
cd repo
- Install dependencies:
bundle install
- Start the development server:
bundle exec jekyll serve
- Open your browser and visit http://localhost:4000
Configuration
All theme settings are in _config.yml. Here are the main options:
Site Settings
title: "My Site"
description: "Site description"
url: "https://example.com"
Theme Configuration
theme_config:
colors:
primary: "indigo" # Primary color (Tailwind color name)
secondary: "slate" # Secondary color
accent: "amber" # Accent color
fonts:
heading: "Inter" # Font for headings
body: "Inter" # Font for body text
mono: "JetBrains Mono" # Font for code
layout:
max_width: "6xl" # Max width for containers
content_width: "3xl" # Max width for content
sidebar: true # Show sidebar in docs
components:
show_toc: true # Table of contents
show_reading_time: true # Reading time estimate
show_date: true # Post dates
show_author: true # Author names
show_tags: true # Post tags
show_categories: true # Post categories
features:
dark_mode: true # Enable dark mode toggle
Adding Content
Blog Posts
Create new blog posts in the _posts directory:
---
title: "My New Post"
description: "Post description"
date: 2024-01-15
categories: [Category]
tags: [tag1, tag2]
---
Your content here...
Documentation
Create documentation pages in the _docs directory:
---
title: "Page Title"
description: "Page description"
order: 1
---
Your documentation content...
Using Components
Cards
{% include components/card.html
title="Card Title"
description="Card description"
link="/path"
link_text="Learn more"
%}
Buttons
{% include components/button.html
text="Click me"
link="/path"
style="primary"
size="md"
%}
Alerts
{% include components/alert.html
type="info"
title="Note"
content="This is an info alert."
%}
Deployment
GitHub Pages
- Push your site to a GitHub repository
- Go to Settings > Pages
- Select the branch to deploy from
- Your site will be live at
https://username.github.io/repo
Other Platforms
This theme works with any platform that supports Jekyll:
- Netlify
- Vercel
- Cloudflare Pages
- Any static hosting
Next Steps
- Customize the colors and fonts in
_config.yml - Update the navigation in
_data/navigation.yml - Add your social links in
_data/social.yml - Start writing content!