Zolan - Modern & Minimal Theme for Jekyll

Zolan is a minimal blog theme for Jekyll.

---

Table of Contents

• Features
• Demo
• Deployment
• Posts
• Disqus Comments
• Instagram
• Google Analytics
• Update favicon
• Credits
• Support

---

Features

• 100% responsive and clean theme

• Optimized for mobile devices

• Minimal design

• Valid HTML5 code

• Post sharing

• Subscription form

• Supports Disqus Comments

• Instagram Feed

• Ionicons Icons

• Google Fonts

---

Deployment

To run the theme locally, navigate to the theme directory and run bundle install to install the dependencies, then run jekyll serve or bundle exec jekyll serve to start the Jekyll server.

Posts

To create a new post, you can create a new markdown file inside the _posts directory by following the recommended file structure.

  ---
  layout: post
  title: Time to give gifts to everyone
  date: 2018-08-23 16:04:00 +0300
  image: 03.jpg
  tags: Life
  author: Name
  ---

You can set the tags and the post image.

Add post images to /images/ directory.

For tags, try to not add space between two words, for example, Ruby on Rails, could be something like (ruby-on-rails, Ruby_on_Rails, or Ruby-on-Rails).

---

Disqus Comments

Zolan Theme comes with Disqus comments enabled.

Open _data/settings.yml file, and change the mr-brown value on line 26 with your Disqus account shortname.

  Comment Section (Disqus)
  disqus-identifier: mr-brown # Add your shortname for Disqus Comment. For example mr-brown

That’s all you need to setup Disqus from the theme side. If you get any issue regarding that comments are unable to load. First, make sure you have registered your website with Disqus (Step 1).

And also check Disqus troubleshooting guide if you still have issues.

---

Instagram

The Instagram feed is working using Instafeed.js to show the photos.

First, you will need to get your account userId and accessToken from the following URLs:

• userId: http://codeofaninja.com/tools/find-instagram-user-id/
• accessToken: instagram.pixelunion.net

Second, open the js/common.js file and replace the userId and accessToken values.

var instagramFeed = new Instafeed({
      get: 'user',
      limit: 6,
      resolution: 'standard_resolution',
      userId: '8987997106',
      accessToken: '8987997106.924f677.8555ecbd52584f41b9b22ec1a16dafb9',
      template: ''
});

Third, open the _data/settings.yml file and replace the instafeed: false on instafeed: true value.

# Instagram Feed
instafeed: false # To enable the instafeed, use the value true. To turn off use the value false.

---

Credits

I have used the following scripts, fonts or other files as listed.

• Google Fonts (Roboto, Sans Serif).
• Ionicons Icons
• FitVids.js
• Medium’s Image Zoom
• Instafeed.js
• jQuery.com
• Preview Images form unsplash.com, pexels.com

---

License

Mit License

---