Skip to content

Directory Structure

Understanding the file layout is the first step to building a theme. See Template Setup for metadata, versioning, packaging, and UI deployment.

Where Theme Files Live

Each theme is a self-contained directory:

my-theme/
├── config/
│   ├── settings.json       ← Required metadata and settings schema
│   └── values.json         ← Saved/default values
├── layout/
│   ├── layout.blade.php   ← Required outer HTML shell
│   ├── header.blade.php
│   └── footer.blade.php
├── template/
│   ├── index.blade.php    ← Homepage
│   ├── product_details.blade.php
│   └── productlist.blade.php
├── partial/
│   ├── homepageproduct.blade.php
│   ├── productslider.blade.php
│   └── paginator.blade.php
├── public/
│   ├── css/
│   ├── js/
│   └── images/
└── README.md

Deploy the complete directory as a ZIP through the administration UI. The installer manages template storage and publishes the contents of public/ for the current site.

Key Directories

config/

settings.json contains the required theme metadata and defines options shown in the admin customizer. values.json contains current/default values. See Theme Configuration.

layout/

The master layout lives at layout/layout.blade.php. Page templates use @extends('layout.layout'). Header, footer, style, and script fragments can also live here.

template/

Page-specific templates live here. Common examples include:

  • index.blade.php — homepage
  • login.blade.php — customer login
  • register.blade.php — customer registration
  • product_details.blade.php — product page
  • productlist.blade.php — category/product listing

Use the Pages Reference for the full URL-to-template mapping.

partial/

Reusable components included by layouts and page templates live here. Examples include product cards, sliders, and pagination controls.

public/

Put CSS, JavaScript, images, fonts, and other browser-facing files here. Always generate their URLs with theme_asset():

<link rel="stylesheet" href="{{ theme_asset('css/style.css') }}">
<script src="{{ theme_asset('js/app.js') }}"></script>
<img src="{{ theme_asset('images/logo.svg') }}" alt="Store logo">

The helper selects the current site and active/preview theme and uses S3/CDN URLs when enabled.

Template Resolution

For a storefront request, the application resolves the current site and selected theme, then prepends the installed theme to Laravel's view locations. Application and module views remain fallbacks for views the theme does not own.

Use dot notation without the .blade.php extension when extending or including theme views:

@extends('layout.layout')
@include('partial.homepageproduct', ['product' => $product])