Table of Contents
Something looks broken? We accept bounties to fix them faster.
This extension activates the tagging feature by utilizing the
kind property on the page. This extension will also add several new routes such as
https://mecha-cms.com/blog/tag/slug on every page to allow users to list all pages in the current folder by a tag.
The official control panel extension can help you to automate everything. But, if you have to, you can still make this extension work even without the GUI feature. Before we start, you need to understand how this extension works.
First, get to know that this extension adds
tags properties to the page only if the page contains
kind property that is not empty:
$page = Page::__set_state([ … … 'kind' => [1, 2, 3], // [^1] 'query' => ['foo', 'bar', 'baz'], // [^2] 'tags' => Tags::__set_state([ // [^3] 'foo' => Tag::__set_state([ … … 'id' => 1, 'name' => 'foo', 'url' => 'https://mecha-cms.com/tag/foo' ]), 'bar' => Tag::__set_state([ … … 'id' => 2, 'name' => 'bar', 'url' => 'https://mecha-cms.com/tag/bar' ]), 'baz' => Tag::__set_state([ … … 'id' => 3, 'name' => 'baz', 'url' => 'https://mecha-cms.com/tag/baz' ]) ]) ]); // [^1]: These numbers will be used as the tag ID. // [^2]: These queries are generated automatically based on the available tags. // [^3]: These rich tags data are also generated based on the available tags.
Second, writing a tag file is the same as writing a page file. The only difference is that you must write the
id property separately from the page:
.\ └── lot\ └── tag\ ├── bar\ │ └── id.data ├── baz\ │ └── id.data ├── foo\ │ └── id.data ├── bar.page ├── baz.page └── foo.page
Third, make sure to specify a unique number for each
id.data file. These numbers, then will be used to connect the tag file with the
kind property on every page.
Here’s an example of a tag file content:
title: Tag Name description: Short description about this tag. ... Long description about this tag.
Fourth, to connect between tags with the current page, create a
kind.data file in the corresponding folder, containing a list of tag’s ID written in a valid JSON format:
.\ └── lot\ └── page\ ├── test-page\ │ └── kind.data └── test-page.page
Example content of
[1, 2, 3]
You can actually insert the
kind property on the page header, but this method is a little inefficient in terms of performance:
title: Page Title description: Page description. author: Taufik Nurrohman type: Markdown kind: [1, 2, 3] ... Page content goes here.
These page conditional statements are available:
Returntrue` if current items view is a tags view and is not empty.
These HTML classes will be added to the
<html> element that has a
is:tags→ Will be added if current items view is a tags view and is not empty.