A Minimalistic PicoCMS Theme centered around Tags

Guy Godfroy 6a29ae9530 add documentation about tags and athors templates %!s(int64=4) %!d(string=hai) anos
content-base 53fde24f90 necessary for PR 3 %!s(int64=4) %!d(string=hai) anos
css 8661148f24 adding timeline feature, removing one-click-selects-all %!s(int64=4) %!d(string=hai) anos
includes b4a9223951 First commit %!s(int64=5) %!d(string=hai) anos
res 54ecb60bc6 document feed/content variable in default config file %!s(int64=4) %!d(string=hai) anos
.gitignore b4a9223951 First commit %!s(int64=5) %!d(string=hai) anos
404.twig b4a9223951 First commit %!s(int64=5) %!d(string=hai) anos
LICENSE b4a9223951 First commit %!s(int64=5) %!d(string=hai) anos
README.md 6a29ae9530 add documentation about tags and athors templates %!s(int64=4) %!d(string=hai) anos
authors.twig 0e07270e00 Introducing the author page %!s(int64=4) %!d(string=hai) anos
feed.twig 0383282821 fix non defined variable in configuration %!s(int64=4) %!d(string=hai) anos
index.twig 0e07270e00 Introducing the author page %!s(int64=4) %!d(string=hai) anos
page.twig b4a9223951 First commit %!s(int64=5) %!d(string=hai) anos
post.twig 41131f951f Merge branch 'author-page' of raspbeguy/tagblog into master %!s(int64=4) %!d(string=hai) anos
search.twig b4a9223951 First commit %!s(int64=5) %!d(string=hai) anos
tags.twig b4a9223951 First commit %!s(int64=5) %!d(string=hai) anos

README.md

TagBlog Theme

This is the repository of the Pico CMS tagblog theme. It is fully centered around a tag list/cloud - other means of navigation, apart from a manually built menu, have not been taken onto account.

It is a minimal theme - no javascript, no 3rd-party resources, simple CSS design without animations or rounded corners etc.

It's also a responsive theme, a.k.a. mobile friendly.

Colors can be customised. Two example CSS are included.

It is - was - based on the NotePaper theme, but has been largely rewritten to focus on the one aspect that was most important to me. I believe that tagblog runs lighter than the original NotePaper.
Both the original NotePaper and TagBlog are licensed GPL3.

It also includes a modified version of the mcb_TableOfContent plugin, which comes with its own separate MIT License. I hope that was the correct thing to do.

Screenshots

tagblog screenshot

Dark theme; Mobile

Links

TagBlog can be found in two locations:

https://notabug.org/ohnonot/tagblog
https://framagit.org/ohnonot/tagblog

Install

  • Change to your Pico installation's themes directory:

    $ cd <your pico install>/themes
    
  • Clone this repository:

    $ git clone https://<notabug or framagit>.org/ohnonot/tagblog
    

    You can also download the .zip, but make sure extracting it does not create another folder level.
    In the end you should have this README.md and all twig templates in <your pico install>/themes/tagblog/.

  • Symlink the TableofContents plugin (it's inside the res folder) to the plugins folder:

    $ cd <your pico install>/plugins && ln -s ../themes/tagblog/res/TableOfContents
    

    Alternatively you can also copy the folder:

    $ cd <your pico install>/plugins && cp -r ../themes/tagblog/res/TableOfContents .
    
  • The folder tagblog/content-base contains important files without which tagblog cannot function (and also an example article that can be deleted). Copy them into your content folder.

  • Copy res/tagblog.yml to your Pico CMS installation's config folder:

    $ cd <your pico install>/config && cp ../themes/tagblog/res/tagblog.yml .
    
  • Add the following line to your config/config.yml:

    theme: tagblog
    

Usage

The theme is fully centered around tags.

Make sure your markdown articles include a valid tags: (case insensitive) line in their YAML headers. A valid header might look like this:

---
Title: Load bash builtin from file
Date: 27.02.2018
Tags: linux,bash
Template: post
---

Tags are separated by commas. An article that doesn't have a Tags: line (or commented out like #Tags:) will not show up in the tag cloud/list, not in search results and not in the list of all posts. It can still be accessed with its direct page URL.

My blog posts all use the post template, and are all thrown in one big folder. They can be grouped in subfolders, but the tagblog theme has no way of representing that (the page URL will represent that though).

There are two useful views to sort posts:

  • tags: list articles containing a given tag. This view is accessible by clicking on a tag, either on the sidebar taglist or in a post header.
  • authors: list articles written by a given author. This view is accessible by clicking on an author name in a post header.

Configuration

<your pico install>/config/tagblog.yml

is fairly straightforward and self-explanatory.

colors: you can create your own color schemes by copying one of the existing color-*.css files inside <your pico install>/themes/tagblog/css to something named color-custom-<yourtheme>.css and editing that. You need to define it as colors: custom-<yourtheme> (and not just <yourtheme>) in tabglog.yml. This naming convention ensures that the git project remains untouched and you can easily git pull if there are updates.

taglist and tagcloud are different designs to show the same clickable lists of tags.

The TableOfContent options are explained in mcb_TableOfContent's original README.md, except for the last one (template).

Disclaimers

You should be familiar with the concepts of PicoCMS.

For deeper understanding I recommend to get familiar with Twig templating.

Please open an issue in any of the two repositories if you think you found something that should be fixed.


Greetings,
https://notabug.org/ohnonot
https://framagit.org/ohnonot