Jekyll-TailwindCSS-Starter-Template

Jekyll-TailwindCSS-Starter-Template

Jekyll TailwindCSS initialization

Simple Jekyll + Tailwind CSS Starter Template

This is a simple starter template for creating a Jekyll site with Tailwind CSS. It includes basic setup and configuration for Jekyll, a static site generator, and Tailwind CSS, a utility-first CSS framework.

Getting Started

Follow these steps to get your Jekyll + Tailwind CSS site up and running:

  1. Clone this repository to your local machine.
  2. Navigate to the project directory.
  3. Run npm install tailwindcss @tailwindcss/typography cssnano postcss postcss-cli daisyui postcss-import autoprefixer to install the necessary Node.js packages.
  4. Run bundle update to update the Ruby dependencies.
  5. Run bundle install to install the necessary Ruby gems.
  6. Run bundle exec jekyll serve -l -o to start the Jekyll server.

Your site should now be running at http://localhost:4000.

Deploying to GitHub Pages

To deploy your site to GitHub Pages, follow these steps:

  1. Open _config.yml.
  2. Update url: 'https://your-name.github.io' with your GitHub Pages URL.
  3. Update baseurl: 'your-repo-name' with the name of your GitHub repository.
  4. Run bundle exec jekyll build
  5. Run npx gh-pages -d _site
  6. Once published, go to the GitHub Pages settings and deploy from the gh-pages branch.

Your site should be live at https://your-name.github.io/your-repo-name.

Credits

This template uses configurations and tweaks inspired by the following sources:

jekyll logo

Want a Jekyll website built?

Hire a Jekyll developer