CODEWITHSUNDEEP
htmljekyllgithub-pages
James Karran
James Karran

Reputation: 73

Jekyll customizing default theme

I'm building my first website using Jekyll and I quite like the default minima theme. However, I would like to change some things about theme like background color or stuff like that...how would I do that?

I tried changing the CSS file in the /_site/assets folder, but even though it does change the file and the webiste looks different with the Jekyll preview, it doesn't change it permanently because I guess it's not building the website with a new CSS file.

My directory structure is like this:

├── 404.html
├── about.md
├── assets
│   └── js
│       └── main.js
├── _config.yml
├── Gemfile
├── Gemfile.lock
├── index.md
├── _posts
│   ├── 2018-02-25-animosity.md
│   ├── 2018-02-25-test.html
│   └── main.js
└── _site
    ├── 404.html
    ├── about
    │   └── index.html
    ├── assets
    │   ├── js
    │   │   └── main.js
    │   ├── main.css
    │   └── minima-social-icons.svg
    ├── feed.xml
    ├── index.html
    └── jekyll
        └── update
            └── 2018
                └── 02
                    └── 25
                        ├── animosity.html
                        └── test.html

Upvotes: 5

Views: 3136

Answers (1)

Christian Specht
Christian Specht

Reputation: 36441

You said in a deleted answer that you are using the Minima theme as a gem.

In this case, it's possible to "override" single files by creating a modified copy of them in the right place in your folder structure.

See the Jekyll docs:
Overriding theme defaults

For example, to override main.css (shown in your directory structure under _site/assets/main.css, you would need to create a copy of that file here:

├── 404.html
├── about.md
├── assets
│   ├── js
│   │   └── main.js
│   └── main.css                 <-- HERE
├── _config.yml
├── Gemfile
├── Gemfile.lock
├── index.md
├── _posts
│   ├── 2018-02-25-animosity.md
│   ├── 2018-02-25-test.html
│   └── main.js
└── _site
    ├── ...                      <-- NOT HERE

Note: Do NOT change anything in the _site directory, because that will be deleted and re-created each time you build your page!
Any template changes have to be made in the main directory.

Upvotes: 3

Related Questions