apricot-jekyll-theme

apricot-jekyll-theme

A minimal, responsive, fast Jekyll blog theme. Has syntax highlighting and table of contents.

#jekyll-themes
Demo Download

permalink: apricot-jekyll/ img: https://c1.staticflickr.com/9/8675/16533077649_518a083613_o.jpg category: project tag: jekyll additional_copy_path: ~/project/otter.pro/apricot-jekyll/README.md hide_date: true title: Apricot Jekyll Theme strip_front_matter: true

Apricot is a theme for Jekyll static site generator. I created it so that I could use it for my personal blog.

Additional settings

Change site header image

Add "img" in the front matter. Images located in the local server should be placed in the "img/" directory.

img: FILENAME.JPG

img: http://example.com/image.jpg

Show page in header menu

If set to true, the page is shown in the navigation menu. By default, the page is not shown on the menu.

show_in_menu: true

Show URL in header menu

Other URL can be added to the menu items, which are shown in the navigation menu.

In _config.yml, add menu items like this: 

menu:
  -
    url: "/categories/project/"
    title: "Projects"
  -
    url: "https://github.com/otterpro/"
    title: "Github"
    target: "_blank"

target: "_blank" opens the URL in a new window

Generation of table of contents

Jekyll Table of Contents Generator

By default, table of contents are generated for all pages and posts. To disable table of contents for individual page or post, add the following front matter. 

noToc: true

Don't display dates on certain posts

hide_date: true

Additional note: category and tag doesn't work on page properly because Jekyll doesn't count them for pages, but only for posts. Since I wanted to use categories for pages and not just for posts, I've decided to not use the page. Instead, I'd prefer just hiding the dates to give it an appearance of a page.

Sitemap configuration

Sitemap.xml contains the sitemap, which are used by the the search engine to optimize its search. The sitemap.xml is based on this blog post

sitemap:
    lastmod: 2014-01-23
    priority: 1  #0.0 min -- 1.0 max
    changefreq: 'weekly'
    exclude: true  #if true, exclude from sitemap.xml

Code highlighting

I really hated embedding liquid tag "{% highlight LANG %}" for highlighting any code within the markdown text because it made the text look ugly. I also wanted the highlighter to be able to detect the language without having to specify the language. It doesn't have to be super-accurate. Just highlight it so that numbers and common keywords look different.
Highlight.js offered the best highlighting, although it is client-based javascript.

Flickr

Flickr plugin I modified it, so that it defaults to "Large" image instead of "Medium" sized image, as before.

Requires typhoeus gem.

in _config.yml

flickr:
  api_key: YOUR_FLICKR_API_KEY_HERE

Github

https://github.com/otterpro/apricot-jekyll

Additional thanks to

License and Copyright

Apricot Theme for Jekyll is free software released under the MIT License.

minimalacademicresumeportfoliodocumentationwikitailwindbootstrapdarkecommercegithub-pagesblog