Architecture

Locales

Locales contain all your language localization settings. Taojaa theme engine supports multiple languages using the provided language settings in your theme's locales folder

They are JSON files located inside the locales folder and they supports JSON Standard syntaxes only.

Location

.
└── theme
    |   ...
    ├── configs
    |   ...
    ├── locales
    |   ├── en-US.json
    |   ├── en.default.json     // defualt language
    |   ├── fr.json     // French
    ...

Structure

All localization settings must be placed inside the "general" block in the locale JSON file and will be maded accessible inside across the theme's context.

// English en.default.json
{
    "general": {
        "auth": {
            "login_page_header": "Login with username",
        }
        ...
    }
}

// French fr.json
{
    "general": {
        "auth": {
            "login_page_header": "Connectez-vous avec votre nom d'utilisateur"
        }
        ...
    }
}

Usage

When building a storefront theme with Affluent base theme, all supported language settings would be installed inside the locales folder.

You can access your language localization settings within your theme's HTML files and display them on your storefront, using the general object provided by the Taojaa theme engine which is accessible globally in any of your theme HTML files.

<!-- Login section -->
<div class="login-section">
    <div class="login-section-header">
        <h2>{{general.auth.login_page_header}}</h2> <!-- displaying language localization for login header -->
    </div>
    <div class="login-section-body">
        {{#form 'login' 'class="login-section-form" id="login-form"'}}
            <!-- content goes here -->
        {{#/form}}
    </form>
<- Configs
Best Practices ->
ON THIS PAGE
Overview