This tutorial intends to teach you to Install and Configure Jekyll static site generator on Ubuntu 20.04.
Jekyll is a simple, blog-aware, and static site generator. It’s written in Ruby and runs on top of the Liquid templating engine. You can use Jekyll to create a blog, portfolio, personal website, and complex websites for your business. Jekyll includes several built-in plugins that allow you to add functionality such as pagination, tags, and categories; social sharing buttons; Disqus comments; Google Analytics tracking code; email subscription forms and more with just a few clicks of your mouse.
Steps To Install and Configure Jekyll on Ubuntu 20.04
To complete this guide, you must log in to your server as a non-root user with sudo privileges and set up a basic firewall. To do this, you can follow our guide on Initial Server Setup with Ubuntu 20.04.
Now follow the steps below to complete your Jekyll installation.
Install Ruby on Ubuntu 20.04
Jekyll is written in Ruby, so you need to have Ruby installed on your Ubuntu server.
First, update your local package index with the command below:
sudo apt update
Then, use the following command to install Ruby and the required packages:
sudo apt install make build-essential ruby ruby-dev
Verify your Ruby installation by checking its version:
Output ruby 2.7.0p0 (2019-12-25 revision 647ee6f091) [x86_64-linux-gnu]
Set up Jekyll on Ubuntu 20.04
At this point, you need to configure the Ruby Gems path and then install Jekyll on your Ubuntu server.
Configure Ruby Gems Path
Here you need to open your bashrc file with your favorite text editor, here we use vi editor:
Then, add the following content to the file:
# Install Ruby Gems to ~/.gems export GEM_HOME=$HOME/gems export PATH=$HOME/gems/bin:$PATH
When you are done, save and close the file.
Source the profile by running the command below:
Install Jekyll Site Generator on Ubuntu 20 Server
At this point, you can easily use the following gem command to install the Jekyll Website generator:
gem install jekyll bundler
Output Successfully installed bundler-2.4.4 Parsing documentation for bundler-2.4.4 Installing ri documentation for bundler-2.4.4 Done installing documentation for bundler after 0 seconds 1 gem installed
To update Ruby gems on Ubuntu 20.04, run the command below:
gem update --system
Configure Firewall for Jekyll
By default, Jekyll is listening on port 4000. So it would be best if you opened the port through your firewall. To do this, run the command below:
sudo ufw allow 4000
Reload the firewall to apply the new rules:
sudo ufw reload
Create a New Demo Site with Jekyll
At this point, we will show you how to create a new demo site by using Jekyll on Ubuntu 20.04.
To do this, switch to your home directory and run the following command to create the demo site:
# cd ~ # jekyll new demo-site
You can check the files inside your demo site directory by using the command below:
# sudo apt install tree # tree demo-site
Output demo-site ├── 404.html ├── about.md ├── _config.yml ├── Gemfile ├── index.md └── _posts └── 2023-01-07-welcome-to-jekyll.markdown 1 directory, 6 files
Run Web Server with Jekyll
Now Jekyll can monitor the files in the created directory and quickly generate a static site from them on Ubuntu 20.04. It also automatically regenerates the site when changes are made to these files.
To run the web server, use the following commands:
# cd ~/demo-site # bundle add webrick # jekyll serve --host=your-host-ip-address
Note: With no host specified, Jekyll will serve the site on localhost.
Output Auto-regeneration: enabled for '/root/demo-site' Server address: http://ip-address:4000/ Server running... press ctrl-c to stop.
When the above command is executed, Jekyll with use configurations and content in the directory
Output /root/demo-site ├── 404.html ├── about.markdown ├── _config.yml ├── Gemfile ├── Gemfile.lock ├── index.markdown ├── _posts │ └── 2023-01-07-welcome-to-jekyll.markdown └── _site ├── 404.html ├── about │ └── index.html ├── assets │ ├── main.css │ ├── main.css.map │ └── minima-social-icons.svg ├── feed.xml ├── index.html └── jekyll └── update └── 2023 └── 01 └── 07 └── welcome-to-jekyll.html 9 directories, 15 files
You can also run the Jekyll server in the background:
jekyll serve --host=host-ip > /dev/null 2>&1 &
Access Jekyll Site on Ubuntu 20.04
At this point, you can access the site by typing the following URL in your web browser:
You will see the Jekyll Welcome page.
Now we want to show you how to add a post on your Jekyll site on Ubuntu 20.04.
Create a Sample Post on Jekyll
Posts are added to the
_posts directory with the following format:
- YEAR is a four-digit number, and MONTH and DAY are both two-digit numbers example; 2023-01-07
- MARKUP is the file extension representing the format used in the file.
For example, use the command below to create a hello world post:
Add the below lines to the file.
--- layout: post title: "Hello World!" --- # Welcome **Hello world**, this is my first Jekyll blog post. I hope you like [email protected]
When you are done, save and close the file.
Finally, refresh your Jelly Site page, and you will see:
You can click on your post to see the content of the post you have added:
At this point, you have learned to Install and Configure Jekyll static site generator on Ubuntu 20.04.
Hope you enjoy it. You may be like these articles:
Install Brotli Compression on Ubuntu 20.04
Install and Configure XAMPP on Ubuntu 20.04
How To Install PHP 8.1 on Ubuntu 20.04
Hey there! I just wanted to ask if you ever have any trouble with hackers?
My last blog (wordpress) was hacked and I ended up losing a few months
of hard work due to no data backup. Do you have any methods to stop hackers?
Hi, there are so many solutions that you can do for your security. You need to increase your security site to avoid hackers’ attacks. They won’t be stopped.