Shop Object

The shop object contains your store’s fundamental settings and configuration. It’s available globally across all pages and templates, making it perfect for headers, footers, and any store-wide functionality.

Usage: Available globally - use anywhere in your templates to access store information

Basic Store Information

Access your store’s core details that you’ve configured in the Control Panel:

<!-- Store name and URL -->
<header>
    <h1><a href="{{shop.url}}">{{shop.name}}</a></h1>
</header>

<!-- Contact information -->
<footer>
    <div class="contact-info">
        <h3>Contact Us</h3>
        <p>{{shop.address}}</p>
        <p>{{shop.zipcode}} {{shop.city}}</p>
        <p>Phone: {{shop.phone}}</p>
    </div>
</footer>

<!-- Contact page content -->
<div class="contact-content">
    {{&shop.contact_text}}
</div>

Available Properties

Property	Description	Example
`shop.name`	Your store’s name	`"My Awesome Store"`
`shop.url`	Your store’s URL	`"https://mystore.com"`
`shop.address`	Street address	`"123 Main Street"`
`shop.zipcode`	Postal code	`"12345"`
`shop.city`	City name	`"Stockholm"`
`shop.phone`	Phone number	`"+46 123 456 789"`
`shop.contact_text`	Contact page content	HTML content

Currency Conversion

If you have multiple currencies enabled, display a currency picker:

{{#shop.cconverter_active}}
<form method="get" action="{{url_current}}" class="currency-selector">
    <label for="currency">{{#lang}}Currency{{/lang}}:</label>
    <select name="currency" id="currency" onchange="this.form.submit()">
        {{#shop.cconverter_currencies}}
        <option value="{{currency}}" {{#current}}selected{{/current}}>
            {{currency}}
        </option>
        {{/shop.cconverter_currencies}}
    </select>
</form>
{{/shop.cconverter_active}}

{{#shop.cconverter_active}}
<div class="currency-dropdown">
    <button class="currency-toggle">
        {{#shop.cconverter_currencies}}
            {{#current}}{{currency}}{{/current}}
        {{/shop.cconverter_currencies}}
        <span class="arrow">▼</span>
    </button>
    
    <div class="currency-options">
        {{#shop.cconverter_currencies}}
        <a href="{{url_current}}?currency={{currency}}" 
           class="currency-option {{#current}}active{{/current}}">
            {{currency}}
        </a>
        {{/shop.cconverter_currencies}}
    </div>
</div>
{{/shop.cconverter_active}}

Currency Object Properties

When looping through shop.cconverter_currencies:

Property	Description
`currency`	Currency code (e.g., “SEK”, “EUR”, “USD”)
`current`	Boolean - true if this is the currently selected currency

Multi-Language Support

Display language options when multiple languages are configured:

{{#shop.app.languages}}
<div class="language-selector">
    <h4>{{#lang}}Choose Language{{/lang}}</h4>
    {{#shop.languages}}
    <a href="{{url}}" class="language-option">
        <img src="{{#asset_flags}}{{id}}{{/asset_flags}}" 
             alt="{{id}}" 
             class="flag">
        {{id}}
    </a>
    {{/shop.languages}}
</div>
{{/shop.app.languages}}

{{#shop.app.languages}}
<div class="lang-switcher">
    {{#shop.languages}}
    <a href="{{url}}" class="lang-link" title="{{id}}">
        <img src="{{#asset_flags}}{{id}}{{/asset_flags}}" alt="{{id}}">
    </a>
    {{/shop.languages}}
</div>
{{/shop.app.languages}}

Language Object Properties

When looping through shop.languages:

Property	Description
`id`	Language identifier (e.g., “en”, “sv”, “no”)
`url`	URL to switch to this language
`asset_flags`	Helper to get flag image for this language

Tax Toggle

If tax toggling is enabled, allow customers to switch between prices including/excluding tax:

{{#shop.taxtoggle_active}}
<div class="tax-toggle">
    {{#shop.exclude_tax}}
    <a href="{{shop.incl_tax_url}}" 
       class="tax-link"
       title="{{#lang}}Prices are excluding tax. Click to toggle{{/lang}}">
        {{#lang}}Tax Excl.{{/lang}}
    </a>
    {{/shop.exclude_tax}}
    
    {{^shop.exclude_tax}}
    <a href="{{shop.excl_tax_url}}" 
       class="tax-link"
       title="{{#lang}}Prices are including tax. Click to toggle{{/lang}}">
        {{#lang}}Tax Incl.{{/lang}}
    </a>
    {{/shop.exclude_tax}}
</div>
{{/shop.taxtoggle_active}}

<div class="price-info">
    {{#shop.exclude_tax}}
        <small>{{#lang}}Prices excluding tax{{/lang}}</small>
    {{/shop.exclude_tax}}
    {{^shop.exclude_tax}}
        <small>{{#lang}}Prices including tax{{/lang}}</small>
    {{/shop.exclude_tax}}
</div>

Property	Description
`shop.taxtoggle_active`	Boolean - true if tax toggle is enabled
`shop.exclude_tax`	Boolean - true if currently showing prices excluding tax
`shop.incl_tax_url`	URL to switch to prices including tax
`shop.excl_tax_url`	URL to switch to prices excluding tax

Display login/account links when customer accounts are enabled:

{{#shop.login_active}}
<div class="account-links">
    {{#user.logged_in}}
    <a href="{{user.login_url}}" class="account-link">
        <i class="icon-user"></i>
        {{#lang}}My Account{{/lang}}
    </a>
    {{/user.logged_in}}
    
    {{^user.logged_in}}
    <a href="{{user.login_url}}" class="login-link">
        <i class="icon-login"></i>
        {{#lang}}Log In{{/lang}}
    </a>
    {{/user.logged_in}}
</div>
{{/shop.login_active}}

{{#shop.login_active}}
<nav class="account-nav">
    {{#user.logged_in}}
    <div class="dropdown">
        <button class="account-toggle">
            <i class="icon-user"></i>
            {{#lang}}Account{{/lang}}
        </button>
        <div class="dropdown-menu">
            <a href="{{user.login_url}}">{{#lang}}My Orders{{/lang}}</a>
            <a href="{{user.login_url}}">{{#lang}}Settings{{/lang}}</a>
            <a href="/logout">{{#lang}}Log Out{{/lang}}</a>
        </div>
    </div>
    {{/user.logged_in}}
    
    {{^user.logged_in}}
    <a href="{{user.login_url}}" class="login-btn">
        {{#lang}}Log In{{/lang}}
    </a>
    {{/user.logged_in}}
</nav>
{{/shop.login_active}}

Stock Messages

Display custom out-of-stock messages:

<!-- Use custom sold out message if available -->
{{#product.soldOut}}
    <div class="sold-out-notice">
        {{#shop.soldout_text}}
            {{shop.soldout_text}}
        {{/shop.soldout_text}}
        {{^shop.soldout_text}}
            {{#lang}}Sorry, this item is currently out of stock{{/lang}}
        {{/shop.soldout_text}}
    </div>
{{/product.soldOut}}

Complete Examples

Store Header with All Features

<header class="store-header">
    <!-- Main branding -->
    <div class="brand">
        <h1><a href="{{shop.url}}">{{shop.name}}</a></h1>
    </div>
    
    <!-- Utility navigation -->
    <div class="header-utils">
        <!-- Currency selector -->
        {{#shop.cconverter_active}}
        <div class="currency-selector">
            <select name="currency" onchange="window.location=this.value">
                {{#shop.cconverter_currencies}}
                <option value="{{url_current}}?currency={{currency}}" 
                        {{#current}}selected{{/current}}>
                    {{currency}}
                </option>
                {{/shop.cconverter_currencies}}
            </select>
        </div>
        {{/shop.cconverter_active}}
        
        <!-- Language selector -->
        {{#shop.app.languages}}
        <div class="language-selector">
            {{#shop.languages}}
            <a href="{{url}}" class="lang-link">
                <img src="{{#asset_flags}}{{id}}{{/asset_flags}}" alt="{{id}}">
            </a>
            {{/shop.languages}}
        </div>
        {{/shop.app.languages}}
        
        <!-- Tax toggle -->
        {{#shop.taxtoggle_active}}
        <div class="tax-toggle">
            {{#shop.exclude_tax}}
            <a href="{{shop.incl_tax_url}}">{{#lang}}Incl. Tax{{/lang}}</a>
            {{/shop.exclude_tax}}
            {{^shop.exclude_tax}}
            <a href="{{shop.excl_tax_url}}">{{#lang}}Excl. Tax{{/lang}}</a>
            {{/shop.exclude_tax}}
        </div>
        {{/shop.taxtoggle_active}}
        
        <!-- Account links -->
        {{#shop.login_active}}
        <div class="account-links">
            {{#user.logged_in}}
            <a href="{{user.login_url}}">{{#lang}}Account{{/lang}}</a>
            {{/user.logged_in}}
            {{^user.logged_in}}
            <a href="{{user.login_url}}">{{#lang}}Log In{{/lang}}</a>
            {{/user.logged_in}}
        </div>
        {{/shop.login_active}}
    </div>
</header>

<footer class="store-footer">
    <div class="footer-content">
        <!-- Store information -->
        <div class="footer-section">
            <h3>{{shop.name}}</h3>
            {{#shop.address}}
            <div class="address">
                <p>{{shop.address}}</p>
                <p>{{shop.zipcode}} {{shop.city}}</p>
            </div>
            {{/shop.address}}
            
            {{#shop.phone}}
            <div class="contact">
                <p>{{#lang}}Phone{{/lang}}: {{shop.phone}}</p>
            </div>
            {{/shop.phone}}
        </div>
        
        <!-- Contact text -->
        {{#shop.contact_text}}
        <div class="footer-section">
            <h3>{{#lang}}Contact{{/lang}}</h3>
            <div class="contact-text">
                {{&shop.contact_text}}
            </div>
        </div>
        {{/shop.contact_text}}
        
        <!-- Currency and language options -->
        <div class="footer-section">
            {{#shop.cconverter_active}}
            <div class="footer-currencies">
                <h4>{{#lang}}Currency{{/lang}}</h4>
                {{#shop.cconverter_currencies}}
                <a href="{{url_current}}?currency={{currency}}" 
                   {{#current}}class="current"{{/current}}>
                    {{currency}}
                </a>
                {{/shop.cconverter_currencies}}
            </div>
            {{/shop.cconverter_active}}
            
            {{#shop.app.languages}}
            <div class="footer-languages">
                <h4>{{#lang}}Language{{/lang}}</h4>
                {{#shop.languages}}
                <a href="{{url}}">{{id}}</a>
                {{/shop.languages}}
            </div>
            {{/shop.app.languages}}
        </div>
    </div>
</footer>

Best Practices

Check Before Using

Always check if features are enabled before displaying related UI elements (e.g., {{#shop.cconverter_active}})

Provide Fallbacks

Provide fallback content when optional settings aren’t configured

Use Semantic HTML

Structure your shop information with proper semantic HTML elements

Cache Considerations

Shop data is cached and updates when you change store settings in the Control Panel

Next Steps

User Object

Learn about customer account and authentication data

Settings Object

Explore theme-specific customizable settings

Basket Object

Work with shopping cart data and functionality

Navigation Object

Build dynamic navigation menus

Getting Started

Template Language

Global Objects

Page Objects

Basic Store Information

Available Properties

Currency Conversion

Currency Object Properties

Multi-Language Support

Language Object Properties

Tax Toggle

Stock Messages

Complete Examples

Store Header with All Features

Store Footer with Contact Information

Best Practices

Check Before Using

Provide Fallbacks

Use Semantic HTML

Cache Considerations

Next Steps

User Object

Settings Object

Basket Object

Navigation Object

​Basic Store Information

​Available Properties

​Currency Conversion

​Currency Object Properties

​Multi-Language Support

​Language Object Properties

​Tax Toggle

​Tax-Related Properties

​Customer Login Integration

​Stock Messages

​Complete Examples

​Store Header with All Features

​Store Footer with Contact Information

​Best Practices

Check Before Using

Provide Fallbacks

Use Semantic HTML

Cache Considerations

​Next Steps

User Object

Settings Object

Basket Object

Navigation Object

Basic Store Information

Available Properties

Currency Conversion

Currency Object Properties

Multi-Language Support

Language Object Properties

Tax Toggle

Tax-Related Properties

Customer Login Integration

Stock Messages

Complete Examples

Store Header with All Features

Store Footer with Contact Information

Best Practices

Next Steps