Customizing the Template
Templating in Raneto is powered by Mustache. All of the template views can
be found in the themes/default/
folder. Feel free to customize the template as you wish. The template structure
is as follows:
layout.html
: The parent template. You'll probably want to customize this firsthome.html
: The homepage template. Shown if you don't have an index.mdpage.html
: The template used for single pagessearch.html
: The template used for search resultserror.html
: Shown when Raneto encounters an error or can't find a page
Remember you will need to restart the app after changing the template.
Enable Features on Pages by Altering Config Settings
Some features can be enabled on your pages by changing settings in the config.default.js
file.
Enable Table of Contents
In config.default.js
set table_of_contents
to true
. Raneto uses
markdown-toc to generate
the table of contents on pages, so you can customize the appearance of the
tables of contents by specifying values for parameters in
the table_of_contents_options
object in config.default.js
.
Display Site Menu on Pages
In config.default.js
set menu_on_pages
to true
.
To make the menu collapsible, so that category headings can be expanded or collapsed -
useful for sites with lots of pages - set menu_on_pages_collapsible
to true
.
Public Files
All static files in Raneto (images, CSS, JavaScript files, etc.) are served from the public
folder.
This is so that no one can access any other files in the install.
Only files in the public
folder are available to visitors that are not logged in.
It's worth noting that when customising Raneto you should always make your own files rather than customizing the existing Raneto files, so that your changes don't get lost when you update Raneto.
Template Variables
Below are a list of template variables available to use in their respective templates:
home.html
config
: Holds an array of values fromconfig.js
pages
: Structured list of categories and pages (used for navigation)body_class
: Class for the<body>
tag
page.html
config
: Holds an array of values fromconfig.js
pages
: Structured list of categories and pages (used for navigation)body_class
: Class for the<body>
tagmeta
: Holds an array of values taken from the page meta comment block (e.g.meta.title
)content
: The HTML content of the pagelast_modified
: The formatted date of the time the file was last modified
search.html
config
: Holds an array of values fromconfig.js
pages
: Structured list of categories and pages (used for navigation)body_class
: Class for the<body>
tagsearch
: The current search querysearchResults
: An array search results
Array Structure
The pages
array has a structure similar to the following:
slug
: The category slugtitle
: The category titleis_index
: True for the top level files (ie not in a category)class
: CSS classsort
: The sort index for this categoryfiles[]
: Array of pages in this categoryslug
: The page slugtitle
: The page titleactive
: True if the current page is "active"sort
: The sort index for this page
The searchResults
array contains items which include:
slug
: The page slugtitle
: The page titlebody
: The page contentexcerpt
: The page excerpt