Back to templates

Template details

Jekyll Bootstrap Github Pages

A production-ready Jekyll template with Tailwind CSS v4 and Alpine.js for fast GitHub Pages deployment with zero runtime dependencies.

About this template

The Awesome Jekyll Template (also known as Jekyll Bootstrap Github Pages) is a production-ready Jekyll boilerplate that combines Tailwind CSS v4 with Alpine.js to generate a fast, dependency-light static blog deployable to GitHub Pages through a single automated pipeline.

What is the Awesome Jekyll Template?

It is a static site template built on Jekyll 3.10. As input, it takes Markdown posts in the _posts directory and site-wide settings from _config.yml; as output, it produces a minified, static HTML site with paginated blog listings, tag and category archives, and a contact form. The template runs on GitHub Pages and is developed by Douglas Medeiros. All CSS, JavaScript, and fonts are served locally with zero CDN or runtime dependencies.

Key Features

  • Tailwind CSS v4 via standalone CLI — Compiles CSS without npm or Node.js; the CLI binary is downloaded automatically inside a Docker container during build.
  • Alpine.js 3.14 — Lightweight JavaScript for interactive components such as the navbar, modals, and FAQ accordion, all served locally.
  • Zero runtime dependencies — All assets (CSS, JS, Inter font woff2) are bundled locally; no external CDN requests.
  • Scroll animations — Custom IntersectionObserver-based reveal animations in scroll-animations.js, no external library needed.
  • Automated CI/CD — GitHub Actions pipeline downloads the pinned Tailwind CLI, builds CSS with minification, runs bundle exec jekyll build, and deploys to GitHub Pages.
  • Docker + Make local development — A single make setup command detects the CPU architecture (x86 or ARM), starts a Ruby 2.7 container, and runs Jekyll with live reload.
  • Built-in blog features — Pagination, tag archives, and category archives out of the box, plus Disqus comments and a Static Forms-powered contact form.
  • Minified production output — Jekyll Minifier plugin compresses HTML, CSS, and JS for faster page loads.

Who is it for?

  • Jekyll developers — who want a modern Tailwind-based theme without fighting Node.js build tooling.
  • Bloggers and personal site owners — who need a zero-maintenance blog with tags, categories, and comments, freely deployable on GitHub Pages.
  • Developers needing a quick start — who want a ready-made portfolio or blog with Docker support and one-command setup.
  • CI/CD enthusiasts — who want to see a complete GitHub Actions pipeline for Jekyll and Tailwind.

What can you do with it?

  • Publish a blog on GitHub Pages: write Markdown posts in _posts, configure _config.yml, and push to a GitHub repository to trigger an automated build and deploy.
  • Create a portfolio or personal site: customize the layouts and styles in input.css, use Alpine.js components to build interactive sections.
  • Set up a contact page: use the provided Static Forms integration to receive form submissions by email without a backend.

How does it work?

Clone the repository, install Docker and GNU Make, then run make setup. The Makefile detects your system architecture, downloads the Tailwind standalone CLI, compiles input.css into output.css, and starts Jekyll at localhost:4000 with live reload. On push to GitHub, the deploy.yml workflow repeats the build and publishes the site to Pages.

FAQ

Does this template require Node.js?

No. Tailwind CSS is compiled using the standalone CLI, so no npm or Node.js is needed either locally (via Docker) or in the GitHub Actions pipeline.

How do I deploy to GitHub Pages?

Push the repository to GitHub. The included GitHub Actions workflow (in .github/workflows/deploy.yml) builds the Tailwind CSS and Jekyll site, then deploys to GitHub Pages. Ensure your repository settings enable Pages deployment from GitHub Actions.

Is the template free?

Yes. The template is distributed under the MIT License, so it is free to use, modify, and reuse, including for commercial projects.

What files are built?

The build produces a static HTML site from the _includes, _layouts, and _posts directories, with a minified output.css generated from assets/css/input.css. The Tailwind CLI binary and output.css are gitignored and regenerated on every build.

Can I use Bootstrap instead of Tailwind?

Although the repository name includes "Bootstrap," the template is actually built with Tailwind CSS v4. Bootstrap is not included.

screenshot of Jekyll Bootstrap Github Pages on template0.com