Quick and Easy Guide To Making a Blog with Jekyll And Namecheap
Tags: jekyll, blogging, dns, beginners
Published: 2019-03-10 03:05:25

---
title: Quick and Easy Guide To Making a Blog with Jekyll And Namecheap
published: true
description: A brief guide on how to create a blog using Jekyll and configure the domain with Namecheap.
tags: jekyll, blogging, dns, beginners
canonical_url: https://www.explainhownow.com/2018/starting-a-jekyll-blog/
cover_image: https://thepracticaldev.s3.amazonaws.com/i/a8hct5evacmy44sdzfjx.png
---

Install Ruby if you don't have it yet.
```
sudo apt update
sudo apt install ruby-full
```
Now install Jekyll.
```
sudo gem install jekyll
```
Create a new Jekyll project.
```
jekyll new blogname
```
(note: if you want to use a template, instead of using the above command, just git clone the template you want)

Now, just cd into the folder Jekyll just made and check out the __config.yml_ file. Change all the applicable stuff, like name, email, and whatever else if you're using a template. _url_ can be changed later once you've bought your domain.

To make a post, create a markdown file in the __posts_ directory, in the naming convention of _yyyy-mm-dd-name-of-post.md_, for example _2019-03-10-how-to-jekyll.md_. The format of the file should look like this:
```
---
layout: post
title: Welcome to Jekyll!
categories: jekyll
---
Post content goes here.
```

If you're using a template, check the sample posts to see what other parameters you should add in the top section.

You may need to run the following to make sure you have all the required dependencies:
```
bundle install
```

After all this, you run this to see your website in action:
```
bundle exec jekyll serve
```

Now your website should be online at _http://127.0.0.1:4000/_. Make a repo for it in Github, so that we can set it up with Github Pages later. Push the project to your new repo.
```
git add .
git commit -m "hello world"
git remote add origin [repo_url]
git push origin master
```

Next, we want to vomit this onto the internet. I'll be using Namecheap in this guide, but any other domain provider should work.<br><br>

![domain_purchase](https://www.explainhownow.com/assets/images/jekyll2.png)<br>

Once you buy the domain, you'll need to change the DNS settings so that it can be reached. In Namecheap, you can go to the Dashboard, select "Manage" next to the domain name, then "Advanced DNS", and add the following records, changing my Github username to yours.<br><br>

![dns](https://www.explainhownow.com/assets/images/jekyll3.png)<br>
```
A Record 	@	185.199.108.153
A Record 	@	185.199.109.153
A Record 	@	185.199.110.153
A Record 	@	185.199.111.153
CNAME Record 	www		you.github.io.		30 min
```

Now go to the settings page of your blog repo, which should be _https://github.com/[yourgitname]/[yourblogname]/settings_. 

Under the "Github Pages" headline, add your custom domain (should be in a form similar to _www.blogname.com_) and hit save. Don't forget to change _url_ in __config.yml_ to your domain in the form _https://www.blogname.com_. It could take an hour or so for the DNS to resolve, but eventually, you should be able to see your site at the domain name you bought. Yay! Great job. Note: actual blog content sold separately.<br><br>

### Additional Tips<br>

#### Templates
The above should work, but you're cool so you want a cool blog. Like mentioned above, the steps for getting your blog to work on a custom template should be exactly the same, but instead of _jekyll new blogname_ you just git clone the template and cd into it, doing everything else from there. You can find a wide variety of Jekyll templates from these sites:<br>
* http://jekyllthemes.org/
* https://jekyllthemes.io/
* http://themes.jekyllrc.org/<br><br>

#### SSL
Next, you'll want your blog to have SSL, to save your readers the embarrassment of anyone potentially finding out they're on your site. And from content defacement as well, I guess. Fortunately, Github Pages does this easily for you - under your git repo settings, just tick the "Enforce HTTPS" box under "Github Pages". Don't buy Namecheap's SSL certificate, you don't need it.<br>

#### Images
In your root project folder, create a folder named _assets_, and within assets, make an _images_. Put images there. Then, in your post content, add something like this:
```
![alt_text]({{static.static_files}}/assets/images/image.png)
```
<br><br>
#### Automatic Sitemap
You can make Jekyll automatically generate a sitemap for you! Add the [Jekyll Sitemap Plugin](https://github.com/jekyll/jekyll-sitemap) to your project (instructions are in the readme).

If you're using _bundle exec jekyll serve_ to build your site, you may encounter an issue with your sitemap listing your urls in localhost terms instead of using your domain name. Instead, try building your site files with _bundle exec jekyll build_. If you find that this still doesn't work, enter the following command: _JEKYLL_ENV=prod jekyll serve_
<br>

_This post was originally published on [explainhownow.com](https://www.explainhownow.com/)_