Themes

Creating themes is the goal of Surikata.io's frontend programming. This is where the website design and UI/UX is created.

Each theme is split into following logical parts:

Introduction

Page - Layouts - Sections - Templates (or "How the rendering works")
Theme folder structure
Working with assets

Default themes

There are following default themes available in Surikata.io's package:

HelloWorld Theme
Basic Theme

Layouts

Each page (accessible over a certain URL) must have its layout attached. Read following chapters to understand how layouts work.

Understanding layouts

Templates

Each plugin must have its template written in TWIG. Template is a "front-end counterpart" of the plugin. Read following chapters to understand how you can create your templates or what variables you can use there.

Understanding templates
List of default variables available in TWIG templates

Javascript API

You will definitely need to do some Javascript coding to make your themes work. For example when adding a product to the shopping cart, you will need to call a certain Surikata.io's Javascript API method and most probably create (or re-use from the Basic theme) some wrapper around it.

Javascript programming in themes

Translations

You can prepare your theme to be used in multi-language projects.

Translations

Tutorials

Create the first empty theme
Add a homepage to your theme
Customize the theme

Surikata
E-commerce development framework