Getting Started
Introduction
This theme supplies the user some simple starter templates to get started with October's Tailor Feature. It uses Bootstrap 5 to generate menus, general HTML content, and more.
Prerequisites
To get started with this theme, you'll need the following
October CMS v3.x
A knowledge of Tailor
Some knowledge of PHP
Some Knowledge of Bootstrap 5
Plugin Dependencies
This theme depends on the following plugins:
Artistro08.TailorStarterCompanion
For Order Email management with the Shop Feature
For Email Notifications with the Form Feature
Get Started
Install the theme and dependencies via artisan
(From the October CMS Marketplace):
All theme dependencies should be installed automatically
Once installed, run the seeding function for the theme:
This will initialize the Tailor structure, so you can add content.
Note
This theme automatically creates a child theme. The directory name is
artistro08-tailorstarter-child
. Use that theme to make edits to the code. To learn more info about child themes, check here. Whenever you make changes to the theme in the editor, it copies the data and puts it in the child theme.
Once you've seeded the theme, head over to the content settings in the backend and select the Homepage. Optionally, fill out the Site Name field as well. Find this at /[backend_url]/tailor/globals/content_settings
where [backend_url]
is your backend URI set in your .env
General Structure of Theme
The theme is structured in a way where you can edit almost any file independently. Below are the the main files that give a general structure of the theme.
Top Level Files in the partials
folder
partials
folderheader.htm
header.htm
This file contains the Bootstrap 5 Navbar and navigation generated by the theme. It uses the pagefinder
form widget to display menu items. It also does the followinShows the website name and logo.
Shows the cart button (When an item is in the cart)
Sets the locale if there are any available sites
The menu depth is only 2 levels, defined in the main_menu.yaml
partial.
head.htm
head.htm
The head partial is used to display general meta tags and a bunch of other stuff including the following:
Includes assets from the
assets.htm
filePulls the following information from the
settings.yaml
Favicons
Global Header Code
Pulls in the following information from the current page
Meta Info (title, keywords, description)
OG Tags (Facebook, Twitter, LinkedIn, etc.)
Robots Info
Current Page Header Code
assets.htm
assets.htm
This file is used to include assets throughout the site, mainly the core Bootstrap files. You can use it to include assets in your site via the [resources]
component. You can also include CDN assets here as well. It's a good idea to wrap your CDN assets in a {% put styles %}
placeholder to ensure files are included correctly.
If you plan on including assets conditionally, it's a good idea to use the CMS page ID to display that content on the page like so:
footer.htm
footer.htm
This file is used to display the Secondary Menu & Social Menu throughout the site. It also uses the settings.yaml
file to display the site name. It includes a Copyright Line with the current year automatically generated.
foot.htm
foot.htm
This file is used to display {% scripts %}
before the closing </body>
tag. Additionally, this also includes the following content:
Cart AJAX Functions using the OctoberCMS Javascrpt API
Global Footer Code
Footer Code from the current page
Other Files
Other files are explained in the respected areas of the documentation.
Last updated