# I want to make my own theme with Jekylll **URL:** \ **Category:** Help\ **Created:** [December 2, 2021, 11:11pm UTC](https://talk.jekyllrb.com/t/i-want-to-make-my-own-theme-with-jekylll/6766 "2021-12-02T23:11:36Z")\ **Posts on this page:** 5\ **Page:** 1
**Author:** ![rubymuby](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/rubymuby/32/4161_2.png) [@rubymuby](https://talk.jekyllrb.com/u/rubymuby)\ **Post date:** [December 2, 2021, 11:11pm UTC](https://talk.jekyllrb.com/t/i-want-to-make-my-own-theme-with-jekylll/6766/1 "2021-12-02T23:11:36Z")
I want to make my own theme with Jekylll but I can’t change anything because of config.yml settings. How can I make my own theme from scratch? ---
**Author:** ![ashmaroli](https://avatars.discourse-cdn.com/v4/letter/a/df705f/32.png) [@ashmaroli](https://talk.jekyllrb.com/u/ashmaroli)\ **Post date:** [December 3, 2021, 6:57am UTC](https://talk.jekyllrb.com/t/i-want-to-make-my-own-theme-with-jekylll/6766/2 "2021-12-03T06:57:59Z")
The very first step is deciding two things: - Is the theme intended to be used only on one site or have it available for use by multiple sites or for public consumption. - Is _your site_ going to be _built_ by GitHub Pages (which uses Jekyll with restrictions) or by yourselves using Jekyll directly. If the theme is intended for single use only, the process is less cumbersome. Refer [Setup | Jekyll • Simple, blog-aware, static sites](https://jekyllrb.com/docs/step-by-step/01-setup/) and complete all steps. The process is better if you’re starting with a blank site altogether but if you are with a directory containing (your own) existing posts and pages or some third-party pages: - First delete any mention of `theme` or `remote_theme` from your config file. - Now instruct Jekyll to _build_ your site. If it succeeds without any hard errors, you’re good to start creating a theme from scratch. There may be some warnings about missing layouts, you may ignore that for now. However, if there was an error regarding Liquid tags, you’d need to go to the file concerned and remove the offending tags. Repeat until you get a successful Jekyll build. _Here on, the steps are similar to the tutorial…_ - For learning purposes, delete everything in your config file and just have the following: ```auto title: My Blog ``` - The first step to theme-ing in Jekyll is to create a layout. Open your `index.md` or `index.html` file. Does it have `layout: ` in the front matter? If yes, create an empty HTML file of that name in a `_layouts` directory. For example, if was `layout: home`, create `_layouts/home.html`. If not, add or edit to have `layout: home` in the block enclosed by triple dashes. This block of content is known as front matter. - Add `

Welcome to {{ site.title }}

` to the layout file you just created. - Start Jekyll’s dev server by running `jekyll serve --livereload` (or `bundle exec jekyll serve --livereload` if there’s a Gemfile.) - Point your browser to the address printed in the terminal. You should now see the welcome message from your layout in the home page. - Now add `Hello {{ page.author }}` to your index file after the front matter block. Once the file is saved, Jekyll will automatically regenerate the site and refresh your browser window. - Don’t panic because you don’t see the greeting in the browser. The reason is because the `home` layout hasn’t accepted the index file’s contents yet. Edit the `_layouts/home.html` file to contain `{{ content }}` in the line above `

Welcome to {{ site.title }}

`. - Save your layout file and see a greeting render in your browser. - Go back to the index file and add `author: Jane Doe` to the _front matter_. Save the file and see the complete greeting render on your blog’s home page. You’ve successfully learnt to start the dev process of a Jekyll site. To proceed and refine remember to refer [Setup | Jekyll • Simple, blog-aware, static sites](https://jekyllrb.com/docs/step-by-step/01-setup/) ---
**Author:** ![MichaelCurrin](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/michaelcurrin/32/2340_2.png) [@MichaelCurrin](https://talk.jekyllrb.com/u/MichaelCurrin)\ **Post date:** [December 3, 2021, 8:44am UTC](https://talk.jekyllrb.com/t/i-want-to-make-my-own-theme-with-jekylll/6766/3 "2021-12-03T08:44:45Z")
There is a command to set up a new theme Use global install of Jekyll or Jekyll in an existing project and target a directory for your new project ```auto $ jekyll new-theme my-site-name ``` You are also welcome to click the Use this Template button on my repo, which is based on the output of the command above. > **[GitHub - MichaelCurrin/jekyll-theme-quickstart: Scaffold for a basic Jekyll...](https://github.com/MichaelCurrin/jekyll-theme-quickstart)** > > Scaffold for a basic Jekyll theme for use as a reference or template - GitHub - MichaelCurrin/jekyll-theme-quickstart: Scaffold for a basic Jekyll theme for use as a reference or template That includes docs to help you, it uses Jekyll 3. …and it works as a demo site on GH Pages. [https://michaelcurrin.github.io/jekyll-theme-quickstart/](https://michaelcurrin.github.io/jekyll-theme-quickstart/) I’ve set up a minimal site on gh-pages branch which deploys from the code on master. In practice this would usually be a separate repo pulling in the theme from another repo. Here documentation there will you with configuration > **[GitHub - MichaelCurrin/jekyll-theme-quickstart at gh-pages](https://github.com/MichaelCurrin/jekyll-theme-quickstart/tree/gh-pages)** > > gh-pages ---
**Author:** ![pippim](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/pippim/32/4089_2.png) [@pippim](https://talk.jekyllrb.com/u/pippim)\ **Post date:** [December 5, 2021, 7:58pm UTC](https://talk.jekyllrb.com/t/i-want-to-make-my-own-theme-with-jekylll/6766/4 "2021-12-05T19:58:30Z")
Someday I’d like to make my own theme from scratch too. Therefore I find your question quite interesting. However, I found just using someone else’s theme and modifying it a few times more than enough education for a month! Another consideration is there are a limited amount of GitHub Pages approved Jekyll Themes and getting added to that list might prove difficult. Still you can quite easily copy someone else’s theme and modify it so much that it becomes your own. That said I like the thought of using Jekyll’s Cayman Theme because they do all the heavy lifting to ensure compatibility with different screen sizes, devices and browser manufacturers / versions. Or at least their thousand lines of code suggest that to me. Users with problems on the Cayman Theme means they get it fixed and I get to benefit from it. I add my own styling to my website with navigation bars, table of contents, copy code to clipboard and custom front matter. So in the end it almost **IS** my own theme. Good luck with your theme! Thanks for asking this question so I can follow the answers posted here 🙂 ---
**Author:** ![MichaelCurrin](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/michaelcurrin/32/2340_2.png) [@MichaelCurrin](https://talk.jekyllrb.com/u/MichaelCurrin)\ **Post date:** [December 5, 2021, 8:07pm UTC](https://talk.jekyllrb.com/t/i-want-to-make-my-own-theme-with-jekylll/6766/5 "2021-12-05T20:07:09Z")
You don’t have to get onto the list of supported themes. If you use the Remote Theme plugin which is built into the environment, you can use any theme which is a public repo. ```auto remote_theme: username/repo-name ``` > **[GitHub - benbalter/jekyll-remote-theme: Jekyll plugin for building Jekyll...](https://github.com/benbalter/jekyll-remote-theme#usage)** > > Jekyll plugin for building Jekyll sites with any GitHub-hosted theme - GitHub - benbalter/jekyll-remote-theme: Jekyll plugin for building Jekyll sites with any GitHub-hosted theme There are a ton of themes to choose from and you can pick one as a starting point if you like the look and want different colors or your own menu or whatever. > **[Resources](https://jekyllrb.com/resources/#themes)** > > Transform your plain text into static websites and blogs