Criollo is a clean hugo theme for technical blogs started as a fork of Cocoa Enhanced (cocoa-eh).
Clone or download
Pull request Compare This branch is 91 commits ahead of mtn:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
archetypes
layouts
static/js
.gitignore
CONTRIBUTING.md
LICENSE
README.md
theme.toml

README.md

Criollo

Criollo is a theme started as a fork of Cocoa Enhanced cocoa-eh. I do not aim to maintain it for a wider audience yet, but I share it anyway. My aim was to make a very clean theme, with some specific features fine tuned for a technical blog.

I use and maintain it for my website, metebalci.com.

Criollo is one of the three varieties of cocoa plant.

Features

  • Homepage with latest posts.
  • Accessible.
  • iubenda for compliance, privacy and cookie policies and cookie consent.
  • Disqus for commenting.
  • MathJax for mathematical formulas.
  • Graphviz with viz.js.
  • Mailchimp integration.
  • Share posts on Twitter and Linkedin.
  • RSS feed.
  • SEO friendly with title, description and keywords.
    • description is derived from front matter description or if not exists page's Summary variable. It is plainified.
    • keywords are taken from front matter keywords list.
  • applause button, modified from applause-button, using Firestore as a backend.

Template Structure for Home, Single and List (Section) Pages

  • Home page: layouts/_default/home.html
  • Pages not under any section (about etc.): layouts/_default/single.html
  • Blog listing: layouts/blog/section.html
  • Blog post: layouts/blog/single.html
  • 404 page: layouts/404.html

Partials

  • Headers

    • header.html: opens html, includes head.html, opens body, renders navigation
    • head.html: opens head, includes 3rd party partials below, includes meta.html, includes head_includes.html, includes applause.html
    • meta.html: sets meta tags, tags important for SEO, twitter card tags, opengraph tags
    • head_includes.html: includes non-script resources such as css, font, favicon, RSS link
    • applause.html: applause support, requires firebase firestore
  • Body

    • body_home.html: no page_heading, includes li.html (used as blog section partial as well)
    • body_base_single.html: renders content, includes page_heading.html
    • body_blog_single.html: renders content, includes page_heading.html
    • page_heading.html: renders page heading
    • li_html: renders a single list item
  • Footer

    • footer.html: renders copyright and RSS link, includes footer_scripts.html
    • footer_scripts.html: any scripts that needs to be included at the end of body
  • 3rd party:

    • google-analytics.html: included if page is marked with gaTrackingID
    • iubenda-cookie-solution.html: included always
    • mathjax.html: included only if page is marked with math: true

Shortcodes

  • Git Abbreviated Hash: layouts/shortcodes/githash.html

Compliance and Cookie Consent

The theme is fully integrated with iubenda, meaning some of the javascripts -setting cookies- are disabled until cookie consent is accepted/cookie consent popup is closed. This is accomplished according to iubenda's cookie solution guidelines. If you want to remove iubenda from the theme, you have to modify the script tags also.

Typography

The theme only uses Inconsolata monospace.

Speed

I aim the theme to be very fast, but to be honest it is not my first priority. However, I regularly check my site (metebalci.com) and it always hits green (if not 100%) on Pagespeed.

Site Params

  • gaTrackingID: Google Analytics tracking ID
  • share: true/false
  • share_[twitter|linkedin]: true/false
  • applause: true/false, also requires firebase_api_key, firebase_auth_domain and firestore_project_id

License

Licensed under the MIT License. See the LICENSE for more.