The seo
object provides basic data needed for search engine optimization. It automatically generates appropriate titles and descriptions based on the current page content.
Usage : Available globally - use in your <head>
section to output basic SEO meta tags for each page
The essential SEO elements that are available for each page’s <head>
section:
Basic SEO Tags
Complete Basic SEO Head
<head>
<!-- Page title -->
<title>{{seo.title}}</title>
<!-- Meta description -->
{{#seo.description}}
<meta name="description" content="{{seo.description}}">
{{/seo.description}}
</head>
Available Properties
Property Type Description seo.title
String Search title for current page seo.description
String Search description for current page
Page-Specific SEO
Different page types automatically generate appropriate SEO data using the available properties:
Product Pages
<head>
<!-- Product-specific title and description -->
<title>{{seo.title}}</title>
{{#seo.description}}
<meta name="description" content="{{seo.description}}">
{{/seo.description}}
<!-- Basic product meta using available product properties -->
{{#product.price}}
<meta name="product-price" content="{{product.price}}">
{{/product.price}}
{{#product.currency}}
<meta name="product-currency" content="{{product.currency}}">
{{/product.currency}}
</head>
Category Pages
<head>
<title>{{seo.title}}</title>
{{#seo.description}}
<meta name="description" content="{{seo.description}}">
{{/seo.description}}
<!-- Category-specific meta -->
{{#category.name}}
<meta name="category" content="{{category.name}}">
{{/category.name}}
</head>
Blog Pages
<head>
<title>{{seo.title}}</title>
{{#seo.description}}
<meta name="description" content="{{seo.description}}">
{{/seo.description}}
<!-- Blog-specific meta -->
{{#blog.title_current}}
<meta name="blog-title" content="{{blog.title_current}}">
{{/blog.title_current}}
</head>
Structured Data (JSON-LD)
Add basic structured data using available shop information:
Organization Schema
Product Schema
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Organization",
"name": "{{shop.name}}",
"url": "{{shop.url}}"
{{#shop.address}},
"address": {
"@type": "PostalAddress",
"streetAddress": "{{shop.address}}",
"addressLocality": "{{shop.city}}",
"postalCode": "{{shop.zipcode}}"
}{{/shop.address}}
{{#shop.phone}},"telephone": "{{shop.phone}}"{{/shop.phone}}
}
</script>
Breadcrumb Schema
Add breadcrumb structured data using the available breadcrumbs wrapper:
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{{#breadcrumbs}}
{
"@type": "ListItem",
"position": {{@index}},
"name": "{{title}}",
"item": "{{url}}"
}{{^last}},{{/last}}
{{/breadcrumbs}}
]
}
</script>
Multi-Language Support
If your store supports multiple languages, add language links:
<head>
<!-- Current page in different languages -->
{{#shop.languages}}
<link rel="alternate" hreflang="{{id}}" href="{{url}}">
{{/shop.languages}}
</head>
Complete SEO Template
Complete SEO Head Section
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- Primary SEO -->
<title>{{seo.title}}</title>
{{#seo.description}}
<meta name="description" content="{{seo.description}}">
{{/seo.description}}
<!-- Multi-language support -->
{{#shop.languages}}
<link rel="alternate" hreflang="{{id}}" href="{{url}}">
{{/shop.languages}}
<!-- Favicon -->
<link rel="icon" type="image/x-icon" href="/favicon.ico">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<!-- Basic organization structured data -->
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Organization",
"name": "{{shop.name}}",
"url": "{{shop.url}}"
{{#shop.address}},
"address": {
"@type": "PostalAddress",
"streetAddress": "{{shop.address}}",
"addressLocality": "{{shop.city}}",
"postalCode": "{{shop.zipcode}}"
}{{/shop.address}}
{{#shop.phone}},"telephone": "{{shop.phone}}"{{/shop.phone}}
}
</script>
</head>
Page Context Examples
Use global conditionals to add context-specific SEO:
<head>
<title>{{seo.title}}</title>
{{#seo.description}}
<meta name="description" content="{{seo.description}}">
{{/seo.description}}
{{#isProduct}}
<!-- Product page specific -->
<meta name="page-type" content="product">
{{#product.gtin}}
<meta name="product-gtin" content="{{product.gtin}}">
{{/product.gtin}}
{{/isProduct}}
{{#isCategory}}
<!-- Category page specific -->
<meta name="page-type" content="category">
{{/isCategory}}
{{#isStart}}
<!-- Homepage specific -->
<meta name="page-type" content="homepage">
{{/isStart}}
{{#isPage}}
<!-- Static page specific -->
<meta name="page-type" content="page">
{{/isPage}}
</head>
Usage Notes
Limited SEO Object : The SEO object only provides basic title and description properties. Advanced SEO features like Open Graph tags, Twitter Cards, canonical URLs, robots meta tags, and analytics integration are not available through the SEO object.
Best Practices
Title Length Keep page titles under 60 characters for optimal display in search results
Description Length Meta descriptions should be 150-160 characters for best truncation
Unique Content The system automatically generates unique titles and descriptions for each page
Structured Data Use available shop and product properties to create basic structured data
Manual SEO Enhancement
For additional SEO features, you can manually add them using available properties:
<head>
<!-- Basic SEO from system -->
<title>{{seo.title}}</title>
{{#seo.description}}
<meta name="description" content="{{seo.description}}">
{{/seo.description}}
<!-- Manual canonical URL -->
<link rel="canonical" href="{{url_current}}">
<!-- Manual Open Graph using available properties -->
<meta property="og:title" content="{{seo.title}}">
{{#seo.description}}
<meta property="og:description" content="{{seo.description}}">
{{/seo.description}}
<meta property="og:url" content="{{url_current}}">
<meta property="og:site_name" content="{{shop.name}}">
{{#isProduct}}
<meta property="og:type" content="product">
{{#product.firstimage}}
<meta property="og:image" content="{{product.firstimage}}">
{{/product.firstimage}}
{{/isProduct}}
{{^isProduct}}
<meta property="og:type" content="website">
{{/isProduct}}
</head>
Next Steps