Theme structure and views
Our themes are comprised of Twig view files. Each view file (like product.twig) has its own purpose. For example, product.twig renders a product page.
Also included is a settings.json file where the theme's settings are stipulated.
Themes also use regular CSS and Javascript files.
The theme structure
A theme comprises of directories for
views (including subdirectories for macros, partials and templates)
assets (including subdirectories for scripts, stylesheets and images)
In normal mode, the theme editor will display a stylised version of a theme's directory structure by organising views into directories like 'checkout pages' to make it easy to find the view you want to edit.
In advanced mode, the editor will display the true structure of a theme's directories.
Views directory
The views directory contains all of the view files for the theme.
View files are split into subdirectories. The base directory contains most of the view files but other sub-directories contain other files
macros contains html.twig and shopwired.twig
partials contains the partial files which can be referenced in other files
templates contains the blog_page, collection and master view files
Assets directory
The assets directory contains all of the assets used in the theme, including images, stylesheets and javascript files.
Assets are split into subdirectories like images and css.
You can reference an asset in your theme using the {{ asset_url('') }} tag, e.g.
JSON Files
Themes can also contain JSON files.
assets.json which provides the path for CSS and Javascript files (only used by earlier themes)
settings.json which stipulates the theme settings available to be customised by a theme's end user through the theme settings/advanced settings feature.
Views
There are many different view files available.