Tangible Views
Tangible Views is a minimal theme based on Bootstrap.
Its purpose is to let you build entire sites with templates.
Unlike most themes, it only provides an empty HTML document, and loads templates from a views folder based on the URL request.
Loops & Logic documentation sites, such as this one, are all built with the Tangible Views theme.
Views folder
The folder containing templates is called the "views folder".
It can be in one of the following paths.
-
Folder at
wp-content/views
-
Child theme
Define the parent theme in
style.css
with propertyTemplate
./* Theme Name: Site theme Description: Site-specific child theme Template: tangible-views Version: 0.0.1 */
An advantage of this approach is that you can switch between multiple child themes. It also allows editing templates with the theme editor in the admin.
Routing
The views folders' structure corresponds to the requested URL routes.
For example, let's say the current page is at the following URL:
https://example.com/courses/test-course/lessons/test-lesson
Everything after the site URL is the route: courses/test-course/lessons/test-lesson
.
The router searches for a matching folder, from the deepest level (most specific) up to the root.
courses/test-course/lessons/test-lesson
courses/test-course/lessons
courses/test-course
courses
- Root folder
Any of the above folders can have index.html
as the main template to render the page.
Template partials
Each page is built from a folder of one or more template partials.
The main one is index.html
, which is the page body.
-
common.html
-
header.html
-
index.html
-
footer.html