Table of Contents
- Disqus Comments
- Google Analytics
- Social Media Icons
- Update favicon
Midan theme comes with different customizations in the
# Site settings title: Midan email: email@example.com description: Clean and Fast Jekyll Blog Theme baseurl: '' # The subpath of your site, e.g. /blog url: 'https://midan-jekyll.aspirethemes.com' # The base hostname & protocol for your site github_username: aspirethemes twitter_username: aspirethemes markdown: kramdown permalink: pretty paginate: 12 sass: style: compressed gems: - jekyll-paginate - jekyll/tagging include: - _pages exclude: - vendor - Gemfile - Gemfile.lock # Tags tag_page_dir: tag tag_page_layout: tag_page tag_permalink_style: pretty # Pages path defaults: - scope: path: '_pages' values: permalink: /:basename:output_ext # Authors authors: ahmad: name: Ahmad Ajmi bio: Author & developer of Aspire Themes gravatar: https://s.gravatar.com/avatar/f83141edd9e6339e678648596a403fd5?s=150 email: firstname.lastname@example.org website: https://aspirethemes.com github_username: ahmadajmi twitter_username: ahmadajmi
To run the theme locally, navigate to the theme directory and run
bundle install to install the dependencies, then run
bundle exec jekyll serve to start the Jekyll server.
I would recommend checking the Deployment Methods page on Jekyll website.
To create a new post, you can create a new markdown file inside the
_posts directory by following the recommended file structure.
The following is a post file with different configurations you can add as example:
--- layout: post title: Welcome to Jekyll! featured: true author: ahmad tags: [python, ruby, java] image: '/images/posts/image.jpeg' ---
You can set the author, featured or not, tags, and the post image.
featured key is to mark the post as a featured post, this will add a simple star icon (☆) to the post card.
To keep things more organized, add post images to /images/pages directory, and add page images to /images/pages directory.
To create a draft post, create the post file under the _drafts directory, and you can find more information at Working with Drafts.
For tags, try to not add space between two words, for example,
Ruby on Rails, could be something like (
To create a new page, just create a new markdown file inside the
The following is the
about.md file that you can find as an example included in the theme with the configurations you can set.
--- layout: page title: About image: '/images/pages/about.jpeg' ---
Things you can change are:
The navigation on the sidebar will automatically include all the links to the pages you have created.
Midan Theme comes with Disqus comments enabled.
_includes/disqus.html file, and change the
aspirethemes value on line 15 with your Disqus account shortname.
s.src = '//aspirethemes-demo.disqus.com/embed.js';
So, if your Disqus shortname is
exampleone, the final code above should be
s.src = '//exampleone.disqus.com/embed.js';
That’s all you need to set up Disqus from the theme side. If you get any issue 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.
To integrate Google Analytics, open
_includes/analytics.html, and add your Google Analytics code.
Social Media Icons
Social media links are placed in:
The theme is using Evil Icons, which contains very simple and clean icons. The following is a list of the social media icons to use:
Available Social Media Icons
The theme uses Evil Icons to provide simple and clean icons for other social accounts. Here you can find a list of the social media icons to use:
<span data-icon='ei-sc-facebook' data-size='s'></span>
<span data-icon='ei-sc-github' data-size='s'></span>
<span data-icon='ei-sc-instagram' data-size='s'></span>
<span data-icon='ei-sc-linkedin' data-size='s'></span>
<span data-icon='ei-sc-odnoklassniki' data-size='s'></span>
<span data-icon='ei-sc-pinterest' data-size='s'></span>
<span data-icon='ei-sc-skype' data-size='s'></span>
<span data-icon='ei-sc-soundcloud' data-size='s'></span>
<span data-icon='ei-sc-telegram' data-size='s'></span>
<span data-icon='ei-sc-tumblr' data-size='s'></span>
<span data-icon='ei-sc-twitter' data-size='s'></span>
<span data-icon='ei-sc-vimeo' data-size='s'></span>
<span data-icon='ei-sc-vk' data-size='s'></span>
<span data-icon='ei-sc-youtube' data-size='s'></span>
You can find the current favicon (favicon.ico) inside the theme root directory, just replace it with your new favicon.
Have any questions? I’m here to help.Contact Ahmad