How to Create a Static Website Using Ubuntu 22.04 LTS

Introduction

In this article, I will help you to configure Jekyll on Ubuntu 22.04 LTS. My previous article showed how to install and run Jekyll on your Ubuntu machine. Jekyll is an amazing static site generator by developers for developers to publish artistic static websites. Instructions in this guide are exclusive to Ubuntu operating systems only. Do not try to use them on Debian or other distributions as packages might break them.

Prerequisites

You would need the following setup running already on your system.

• Ruby stack
• Gcc
• Make
• Bundler Gem
• Jekyll Gem

Here is how to install them right away.

$ sudo apt-get install ruby-full build-essential zlib1g-dev

$ gem install jekyll bundler

Now your system is ready to run Jekyll.

Configure Jekyll

Step 1. Create a new project

Now I will need a simple command as stated below to create a new project and install the required gems and dependencies.

$ jekyll new jSite

All required gems and dependencies are now installed. The new website has been created.

Step 2. Launch Jekyll Server

It is launch time. You need to apply the following command to launch the Jekyll server in your browser as you can see below.

$ bundle exec jekyll serve

Step 3. Confirm the launch using a browser

Launch your favorite browser to see if everything is working fine.

Step 4. Working with _config.yml File

Now I will guide you to work with _config.yml file which keeps all of the configurations.

You are noticing that there are some critical settings to finish in the above screenshot. Here I will explain each of them.

I will also add some extra variables to improve it further. Any of the data added in _config.yml file is considered a global variable.

title: Here you are supposed to add your website’s title. Let’s be it LinuxWays.Net

email: A global email for many reasons. Change it to [email protected]

description: This is the place where you introduce yourself globally. This can be used anywhere on the site then.

Next, you will provide your domain name linked to your hosting.

url: “yourdomain.com”

Now I will update social links as “linuxways” for both Github and Twitter.

You can see the updated file now.

I used nano to edit _config.yml file. You can use any available editor to use it.

Step 5. Run Jekyll Server Again

Now I am going to run the Jekyll server again to publish the site. First, save the file, and close the editor. You are good to serve the new website.

$ bundle exec jekyll serve

Our static website is ready now and running with max power. You are ready to edit HTML files and CSS to make it the best as desired.

Conclusion

In this guide, I walked you through with advanced configurations of Jekyll to customize it. You can add new CSS, HTML, and JavaScript to improve the website further or simply take an HTML template to improvise it. Ruby gems are not installable on Windows. Users often break their system while using ruby-full on Windows. It is best to avoid it.