` | `blog`, `article` | `templates/blog.json`, `templates/article.json` | | `/search` | `search` | `templates/search.json` | | `/cart` | `cart` | `templates/cart.json` | | `/custom/` | `custom_page` | `custom_pages/.liquid` | | `/password` | `password` | `templates/password.json` | | anything else | `404` | `templates/404.json` | A product, collection or page can use an **alternate template**: `templates/product.gift.json` is used by products whose template is set to "gift" in admin. Products also take `?view=gift`, which is how quick-view popups load a lighter template. Pages in a language other than the store's primary one have a prefix: `/ar/products/…`. The prefix is handled for you: `routes`, `url` properties and the [`url`](/docs/settings/input-settings/url) setting all include it. ## 2. The template lists sections A JSON template is data the visual editor writes: which sections the page has, their settings and blocks, and their order. ```json title="templates/product.json" { "sections": { "main": { "type": "main-product", "blocks": { "title": { "type": "product-title" } }, "block_order": ["title"] }, "related": { "type": "related-products", "settings": { "limit": 4 } } }, "order": ["main", "related"] } ``` Each entry renders `sections/.liquid` with a [`section`](/docs/liquid/objects/section) object holding its settings and blocks, wrapped in an element: ```html

…

``` A Liquid template (`templates/page.faq.liquid`) is rendered as is, without sections the merchant can arrange. ## 3. Sections render blocks A section loops over `section.blocks`, or outputs its [theme blocks](/docs/architecture/blocks) with `{% content_for 'blocks' %}`. Blocks can hold blocks, up to 8 levels deep. ## 4. The layout wraps the result The template's output becomes `content_for_layout` inside `layout/theme.liquid` (or the layout the template names). The layout draws the ``, renders the header and footer [section groups](/docs/architecture/sections#section-groups) with `{% sections 'header-group' %}`, and must output: - `{{ content_for_header }}` in ``: meta tags, hreflang links, analytics and the editor bridge. - `{{ content_for_layout }}` in ``. ## 5. The HTML is sent, and cached Pages of the live theme are cached and refreshed when the merchant changes something that appears on them. Previews and the visual editor are never cached. ## When something goes wrong A Liquid error doesn't break the page. In previews and the editor the error is shown where it happened (`Liquid error (sections/hero.liquid): …`); on the live store it becomes an HTML comment. The code editor won't save a syntax error to the live theme. A page also has [limits](/docs/liquid/limits): 2 seconds to render, 10,000 iterations per loop and 200 sections. --- # Quick start: edit Sahil URL: https://sooquna.com/docs/getting-started/quick-start > Make your first change to a Sooquna theme in the code editor and preview it before it goes live. **Goal:** add a "Free delivery" line under the product price, safely, on a copy of the live theme. **You need:** a Sooquna store, and permission to edit theme code and publish themes (owners have both). 1. **Make a copy.** In admin, go to **Storefront › Themes**. On the live theme, open the actions menu and choose **Duplicate**. You'll edit the copy, so shoppers see nothing until you publish. 2. **Open the code editor.** On the copy, choose **Edit code**. The file tree on the left has the theme's folders: `layout`, `templates`, `sections`, `blocks`, `snippets`, `custom_pages`, `assets`, `config` and `locales`. 3. **Find the price block.** Press Ctrl + P (⌘ + P on a Mac) and open `blocks/product-price.liquid`. This is the theme block that shows the price on product pages. 4. **Add a line after the price.** Paste this at the end of the block's markup, before `{% schema %}`: ```liquid {%- if product.price >= 20000 -%}

Free delivery on this item

{%- endif -%} ``` Prices are in minor units, so `20000` is 200.00 in the store currency. 5. **Save.** Press Ctrl + S. The theme check runs on every save: problems appear under the editor with the file and line. 6. **Preview.** Choose **Preview** in the editor's top bar, pick a product that costs 200 or more as the page to preview, and check the new line. The preview reloads after each save. 7. **Translate the text.** Hard-coded English won't do on Arabic pages. Open `locales/en.default.json` and add a `free_delivery` key inside the existing `"products"` object: ```json title="locales/en.default.json" "products": { "free_delivery": "Free delivery on this item", ``` Add the same key to `locales/ar.json` with `"توصيل مجاني لهذا المنتج"`, then use it in the block: ```liquid

``` 8. **Publish.** Back in **Storefront › Themes**, choose **Publish** on the copy. The old live theme stays in your library, so you can switch back. ## What you learned - Theme edits are safest on a copy; the live theme refuses saves with Liquid syntax errors. - Blocks live in `blocks/`; the visual editor arranges them, the code editor changes what they draw. - Storefront text belongs in `locales/`, read with the [`t`](/docs/liquid/filters/t) filter. ## Next - [Create your first section](/docs/getting-started/first-section) - [Directory structure](/docs/architecture/directory-structure) --- # Development workflow URL: https://sooquna.com/docs/getting-started/workflow > How to develop a theme today with the code editor, and what's coming for local development. ## Today: the code editor Themes are edited in the browser, in **Storefront › Themes › Edit code**. The editor gives you: - **Liquid, JSON, CSS and JavaScript** highlighting, with autocomplete and hover docs for every tag, filter and object (from the [same reference](/docs/liquid/filters) as these docs). - **Theme check on save**: syntax errors, invalid schemas and unknown setting types are shown with the file and line. The live theme refuses a save with errors; a copy keeps it and flags it. - **Preview** beside the code, reloaded after each save, on any page of the store. - **History**: every save is kept. Compare a file with an older version and restore it. - **Restore points**: a snapshot of every file. The live theme gets one each day it changes; make your own before a big change. - **Conflict handling**: if a teammate saves the same file while you edit it, you get their version to merge instead of overwriting it. - **References**: before you rename or delete a file, the editor lists the templates, sections and store pages that use it. ### A safe routine 1. **Duplicate** the live theme and work on the copy. 2. Make a **restore point** before large changes. 3. Check the copy with **Preview** in English and Arabic, on a phone width. 4. **Publish** the copy. The previous live theme stays in your library (up to 20 themes per store). ## Upload and download A theme can be uploaded or downloaded as a `.zip` in **Storefront › Themes**. Uploads are checked: allowed folders and file types only, at most 2,000 files, 5 MB per text file and 20 MB per asset, valid JSON and schemas, no links or executables. ## Coming next: CLI and local development A command-line tool, `sooquna theme dev`, will serve a theme from your computer against a store's real data with live reload, and push and pull files. It's planned for phase 2. Until then, keep your theme in Git and download a copy after each change. --- # Auto-escaping URL: https://sooquna.com/docs/liquid/autoescape > Sooquna escapes every output by default. What's escaped, what isn't, and how to port Shopify code. :::caution[The biggest difference from Shopify] In Sooquna, `{{ }}` output is **HTML-escaped by default**. Shopify prints values as they are. Read this page before porting a theme. ::: ## What it means ```liquid {{ customer.first_name }} ``` If a shopper signs up as ``, Shopify would print a script into your page; Sooquna prints `<script>alert(1)</script>`, which shows as text. You get protection from cross-site scripting without remembering `| escape` everywhere. ## What isn't escaped Values Sooquna knows are safe HTML are printed as HTML: - **Rich text the merchant wrote**, cleaned of scripts when saved: `product.description`, `page.content`, `article.content`, `collection.description`, and `richtext`, `inline_richtext` and `html` settings. - **HTML built by filters**: `image_tag`, `stylesheet_tag`, `script_tag`, `link_to`, `time_tag`, `placeholder_svg_tag`, `payment_type_svg_tag`, `format_address`, `default_pagination`, `highlight`, `structured_data`, `newline_to_br`, and the text of `escape` and `json`. - **Translations whose key ends in `_html`**, with their variables escaped. - **Theme output**: `content_for_header`, `content_for_layout`, sections, blocks and snippets. ## Changing trusted HTML makes it text A filter that works on text turns trusted HTML into text, and the text is escaped: ```liquid {{ product.description }} {%- comment -%} HTML {%- endcomment -%} {{ product.description | replace: 'Soft', 'Very soft' }} {%- comment -%} escaped: tags show as text {%- endcomment -%} {{ product.description | strip_html | truncate: 120 }} {%- comment -%} plain text: correct {%- endcomment -%} ``` So: strip the HTML before you shorten or change rich text, or keep the HTML as it is. ## There's no way to print untrusted HTML There's no `raw` filter, and `safe` exists only for compatibility: neither turns text into HTML. (The [`raw`](/docs/liquid/tags/raw) *tag* is different: it prints Liquid code without running it.) If you need markup from data, build it from parts: ```liquid {{ product.title }} ``` Each value is escaped for its place, and the markup is your own. ## Porting checklist | Shopify code | In Sooquna | | --- | --- | | `{{ title \| escape }}` | Works (escaped once). `{{ title }}` does the same. | | `{{ product.description }}` | Works. | | `{{ settings.text \| append: '
' }}` | The `
` shows as text. Put markup outside the output: `{{ settings.text }}
`. | | `{{ product.description \| truncatewords: 30 }}` | Shows tags as text. Use `{{ product.description \| strip_html \| truncatewords: 30 }}`. | | `{{ 'x' \| t }}` with HTML in the value | Rename the key to end in `_html`. | | `` | Works: `json` is safe inside ` ``` ## Related - [`asset_url`](/docs/liquid/filters/asset_url) ## Compatibility :::caution[Differs from Shopify] Adds defer, so scripts never block rendering. ::: Since theme platform 1.0. --- # sha1 URL: https://sooquna.com/docs/liquid/filters/sha1 > SHA-1 hash (hex). SHA-1 hash (hex). ## Syntax ```liquid string | sha1 ``` ## Returns string ## Example ```liquid title="Liquid" {{ 'sooquna' | sha1 }} ``` ```html title="Output" 1abaaea056670cd9434837ab693e09522de84bcc ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # sha256 URL: https://sooquna.com/docs/liquid/filters/sha256 > SHA-256 hash (hex). SHA-256 hash (hex). ## Syntax ```liquid string | sha256 ``` ## Returns string ## Example ```liquid title="Liquid" {{ 'sooquna' | sha256 }} ``` ```html title="Output" 1e896b5ff7ac6755f5eed1650502770f17b0e7e069526942a5ff110c106daf4f ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # shopify_asset_url URL: https://sooquna.com/docs/liquid/filters/shopify_asset_url > Platform asset URL (compatibility alias). :::caution[Deprecated] Use [`asset_url`](/docs/liquid/filters/asset_url) instead. ::: Platform asset URL (compatibility alias). ## Syntax ```liquid 'file' | shopify_asset_url ``` ## Returns string ## Compatibility :::caution[Differs from Shopify] Resolves to the theme's assets/ folder. ::: Since theme platform 1.0. --- # size URL: https://sooquna.com/docs/liquid/filters/size > Number of characters in a string or items in an array. Number of characters in a string or items in an array. ## Syntax ```liquid value | size ``` ## Returns number ## Example ```liquid title="Liquid" {{ 'Sooquna' | size }} · {{ product.variants | size }} ``` ```html title="Output" 7 · 3 ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # slice URL: https://sooquna.com/docs/liquid/filters/slice > Part of a string or array, from an index and a length. Part of a string or array, from an index and a length. Negative indexes count from the end. The length defaults to 1. ## Syntax ```liquid string | slice: start, length ``` ## Parameters | Name | Type | Description | | --- | --- | --- | | `start` (required) | number | First index (0-based; negative from the end). | | `length` | number | How many characters or items (default 1). | ## Returns string or array ## Example ```liquid title="Liquid" {{ 'Sooquna' | slice: 0, 4 }} {{ 'Sooquna' | slice: -3, 3 }} ``` ```html title="Output" Sooq una ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # sort URL: https://sooquna.com/docs/liquid/filters/sort > Sorts an array, case-sensitively; by a property when given. Sorts an array, case-sensitively; by a property when given. ## Syntax ```liquid array | sort: property ``` ## Returns array ## Example ```liquid title="Liquid" {{ 'b,C,a' | split: ',' | sort | join: '' }} ``` ```html title="Output" Cab ``` ## Related - [`sort_natural`](/docs/liquid/filters/sort_natural) - [`reverse`](/docs/liquid/filters/reverse) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # sort_by URL: https://sooquna.com/docs/liquid/filters/sort_by > A collection URL with a sort order. A collection URL with a sort order. ## Syntax ```liquid url | sort_by: order ``` ## Returns string ## Example ```liquid title="Liquid" {{ collection.url | sort_by: 'price-ascending' }} ``` ```html title="Output" /collections/abayas?sort_by=price-ascending ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # sort_natural URL: https://sooquna.com/docs/liquid/filters/sort_natural > Sorts an array case-insensitively; by a property when given. Sorts an array case-insensitively; by a property when given. ## Syntax ```liquid array | sort_natural: property ``` ## Returns array ## Example ```liquid title="Liquid" {{ 'b,C,a' | split: ',' | sort_natural | join: '' }} ``` ```html title="Output" abC ``` ## Related - [`sort`](/docs/liquid/filters/sort) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # split URL: https://sooquna.com/docs/liquid/filters/split > Splits a string into an array. Splits a string into an array. ## Syntax ```liquid string | split: separator ``` ## Returns array ## Example ```liquid title="Liquid" {% assign sizes = 'S,M,L' | split: ',' %}{{ sizes | size }} sizes, first {{ sizes | first }} ``` ```html title="Output" 3 sizes, first S ``` ## Related - [`join`](/docs/liquid/filters/join) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # strip URL: https://sooquna.com/docs/liquid/filters/strip > Removes whitespace at both ends. Removes whitespace at both ends. ## Syntax ```liquid string | strip ``` ## Returns string ## Example ```liquid title="Liquid" [{{ ' Oud ' | strip }}] ``` ```html title="Output" [Oud] ``` ## Related - [`lstrip`](/docs/liquid/filters/lstrip) - [`rstrip`](/docs/liquid/filters/rstrip) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # strip_html URL: https://sooquna.com/docs/liquid/filters/strip_html > Removes HTML tags. Removes HTML tags. ## Syntax ```liquid string | strip_html ``` ## Returns string ## Example ```liquid title="Liquid" {{ product.description | strip_html }} ``` ```html title="Output" Soft linen, hand-embroidered in Doha. ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # strip_newlines URL: https://sooquna.com/docs/liquid/filters/strip_newlines > Removes line breaks. Removes line breaks. ## Syntax ```liquid string | strip_newlines ``` ## Returns string ## Example ```liquid title="Liquid" {% capture text %}One Two{% endcapture %}{{ text | strip_newlines }} ``` ```html title="Output" OneTwo ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # structured_data URL: https://sooquna.com/docs/liquid/filters/structured_data > JSON-LD for a product or article. JSON-LD for a product or article. Products include offers per variant with price, currency and availability, and review ratings while the reviews feature is on. Output it in a <script type="application/ld+json"> tag. ## Syntax ```liquid product | structured_data ``` ## Returns html ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # stylesheet_tag URL: https://sooquna.com/docs/liquid/filters/stylesheet_tag > A for a URL. A <link rel="stylesheet"> for a URL. ## Syntax ```liquid url | stylesheet_tag: media: 'print' ``` ## Returns html ## Example ```liquid title="Liquid" {{ 'base.css' | asset_url | stylesheet_tag }} ``` ```html title="Output" ``` ## Related - [`asset_url`](/docs/liquid/filters/asset_url) - [`preload_tag`](/docs/liquid/filters/preload_tag) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # sum URL: https://sooquna.com/docs/liquid/filters/sum > Adds up numbers in an array, or a property of its items. Adds up numbers in an array, or a property of its items. ## Syntax ```liquid array | sum: property ``` ## Returns number ## Example ```liquid title="Liquid" {{ cart.items | sum: 'quantity' }} ``` ```html title="Output" 3 ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # t URL: https://sooquna.com/docs/liquid/filters/t > A translation from the theme's locale files. A translation from the theme's locale files. Keys are dotted paths in locales/<language>.json. Pass variables as key: value; count picks the plural form (Arabic has zero, one, two, few, many and other). Keys ending in _html may contain markup; other values are escaped. Missing keys fall back to the default locale, then to the key itself. ## Syntax ```liquid 'section.key' | t: name: value, count: n ``` ## Returns string ## Examples ```json title="locales/en.default.json" {"cart":{"count":{"one":"{{ count }} item","other":"{{ count }} items"}}} ``` ```json title="locales/ar.json" {"cart":{"count":{"zero":"لا منتجات","one":"منتج واحد","two":"منتجان","few":"{{ count }} منتجات","many":"{{ count }} منتجاً","other":"{{ count }} منتج"}}} ``` ```liquid title="Liquid" {{ 'cart.count' | t: count: 3 }} ``` ```html title="Output" 3 items ``` ### Arabic plural forms ```json title="locales/en.default.json" {"cart":{"count":{"one":"{{ count }} item","other":"{{ count }} items"}}} ``` ```json title="locales/ar.json" {"cart":{"count":{"zero":"لا منتجات","one":"منتج واحد","two":"منتجان","few":"{{ count }} منتجات","many":"{{ count }} منتجاً","other":"{{ count }} منتج"}}} ``` ```liquid title="Liquid (Arabic page)" {{ 'cart.count' | t: count: 2 }} · {{ 'cart.count' | t: count: 3 }} · {{ 'cart.count' | t: count: 11 }} ``` ```html title="Output" منتجان · 3 منتجات · 11 منتجاً ``` ## Related - [`pluralize`](/docs/liquid/filters/pluralize) ## Compatibility :::caution[Differs from Shopify] Adds CLDR plural forms beyond one/other, which Arabic needs. ::: Since theme platform 1.0. --- # time_tag URL: https://sooquna.com/docs/liquid/filters/time_tag > A tag with a formatted date. A <time> tag with a formatted date. ## Syntax ```liquid date | time_tag: format ``` ## Parameters | Name | Type | Description | | --- | --- | --- | | `format` | string | strftime format (default "%b %d, %Y"). | ## Returns html ## Examples ```liquid title="Liquid" {{ article.published_at | time_tag: '%d %B %Y' }} ``` ```html title="Output" 14 March 2026 ``` ```liquid title="Liquid (Arabic page)" {{ article.published_at | time_tag: '%d %B %Y' }} ``` ```html title="Output" 14 مارس 2026 ``` ## Related - [`date`](/docs/liquid/filters/date) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # times URL: https://sooquna.com/docs/liquid/filters/times > Multiplies by a number. Multiplies by a number. ## Syntax ```liquid number | times: number ``` ## Returns number ## Example ```liquid title="Liquid" {{ 3 | times: 4 }} ``` ```html title="Output" 12 ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # truncate URL: https://sooquna.com/docs/liquid/filters/truncate > Shortens a string to a number of characters. Shortens a string to a number of characters. The ellipsis (default "...") counts towards the length. ## Syntax ```liquid string | truncate: length, ellipsis ``` ## Parameters | Name | Type | Description | | --- | --- | --- | | `length` (required) | number | Maximum length. | | `ellipsis` | string | Text added at the end (default "..."). | ## Returns string ## Example ```liquid title="Liquid" {{ 'Hand-embroidered linen abaya' | truncate: 15 }} · {{ 'Hand-embroidered linen abaya' | truncate: 15, '…' }} ``` ```html title="Output" Hand-embroid... · Hand-embroider… ``` ## Related - [`truncatewords`](/docs/liquid/filters/truncatewords) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # truncatewords URL: https://sooquna.com/docs/liquid/filters/truncatewords > Shortens a string to a number of words. Shortens a string to a number of words. ## Syntax ```liquid string | truncatewords: words, ellipsis ``` ## Returns string ## Example ```liquid title="Liquid" {{ 'Soft linen for warm evenings in Doha' | truncatewords: 3 }} ``` ```html title="Output" Soft linen for... ``` ## Related - [`truncate`](/docs/liquid/filters/truncate) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # type URL: https://sooquna.com/docs/liquid/filters/type > The type of a value (string, int, array…), for debugging. The type of a value (string, int, array…), for debugging. ## Syntax ```liquid value | type ``` ## Returns string ## Example ```liquid title="Liquid" {{ 'abc' | type }} {{ 3 | type }} ``` ```html title="Output" string int ``` ## Compatibility :::tip[Sooquna only] Not in Shopify Liquid. ::: Since theme platform 1.0. --- # uniq URL: https://sooquna.com/docs/liquid/filters/uniq > Removes duplicate items. Removes duplicate items. ## Syntax ```liquid array | uniq ``` ## Returns array ## Example ```liquid title="Liquid" {{ 'a,b,a' | split: ',' | uniq | join: ',' }} ``` ```html title="Output" a,b ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # upcase URL: https://sooquna.com/docs/liquid/filters/upcase > Upper-cases a string. Upper-cases a string. ## Syntax ```liquid string | upcase ``` ## Returns string ## Example ```liquid title="Liquid" {{ 'new in' | upcase }} ``` ```html title="Output" NEW IN ``` ## Related - [`downcase`](/docs/liquid/filters/downcase) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # url_decode URL: https://sooquna.com/docs/liquid/filters/url_decode > Decodes a URL-encoded string. Decodes a URL-encoded string. ## Syntax ```liquid string | url_decode ``` ## Returns string ## Example ```liquid title="Liquid" {{ 'oud+%26+musk' | url_decode }} ``` ```html title="Output" oud & musk ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # url_encode URL: https://sooquna.com/docs/liquid/filters/url_encode > Encodes a string for a URL (spaces become +). Encodes a string for a URL (spaces become +). ## Syntax ```liquid string | url_encode ``` ## Returns string ## Example ```liquid title="Liquid" {{ 'oud & musk' | url_encode }} ``` ```html title="Output" oud+%26+musk ``` ## Related - [`url_decode`](/docs/liquid/filters/url_decode) - [`url_param_escape`](/docs/liquid/filters/url_param_escape) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # url_escape URL: https://sooquna.com/docs/liquid/filters/url_escape > Escapes a string for a URL path (keeps /). Escapes a string for a URL path (keeps /). ## Syntax ```liquid string | url_escape ``` ## Returns string ## Example ```liquid title="Liquid" {{ 'gift sets/oud' | url_escape }} ``` ```html title="Output" gift%20sets/oud ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # url_for_type URL: https://sooquna.com/docs/liquid/filters/url_for_type > URL of the collection of a product type. URL of the collection of a product type. ## Syntax ```liquid type | url_for_type ``` ## Returns string ## Example ```liquid title="Liquid" {{ 'Abayas' | url_for_type }} ``` ```html title="Output" /collections/types?q=Abayas ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # url_for_vendor URL: https://sooquna.com/docs/liquid/filters/url_for_vendor > URL of the collection of a vendor. URL of the collection of a vendor. ## Syntax ```liquid vendor | url_for_vendor ``` ## Returns string ## Example ```liquid title="Liquid" {{ 'Layla' | url_for_vendor }} ``` ```html title="Output" /collections/vendors?q=Layla ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # url_param_escape URL: https://sooquna.com/docs/liquid/filters/url_param_escape > Escapes a string for a query parameter. Escapes a string for a query parameter. ## Syntax ```liquid string | url_param_escape ``` ## Returns string ## Example ```liquid title="Liquid" /search?q={{ 'oud & musk' | url_param_escape }} ``` ```html title="Output" /search?q=oud+%26+musk ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # weight_with_unit URL: https://sooquna.com/docs/liquid/filters/weight_with_unit > A weight in grams, shown in kg (default), g, lb or oz. A weight in grams, shown in kg (default), g, lb or oz. ## Syntax ```liquid grams | weight_with_unit: unit ``` ## Returns string ## Example ```liquid title="Liquid" {{ 1250 | weight_with_unit }} · {{ 1250 | weight_with_unit: 'lb' }} ``` ```html title="Output" 1.25 kg · 2.76 lb ``` ## Compatibility :::caution[Differs from Shopify] Takes the unit as an argument instead of the store's setting. ::: Since theme platform 1.0. --- # where URL: https://sooquna.com/docs/liquid/filters/where > Items whose property equals a value (or is truthy, without a value). Items whose property equals a value (or is truthy, without a value). ## Syntax ```liquid array | where: property, value ``` ## Returns array ## Example ```liquid title="Liquid" {{ product.variants | where: 'available' | map: 'title' | join: ', ' }} ``` ```html title="Output" S / Sand, M / Sand ``` ## Related - [`map`](/docs/liquid/filters/map) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # within URL: https://sooquna.com/docs/liquid/filters/within > A product URL inside a collection (/collections/x/products/y). A product URL inside a collection (/collections/x/products/y). ## Syntax ```liquid product.url | within: collection ``` ## Returns string ## Example ```liquid title="Liquid" {{ product.url | within: collection }} ``` ```html title="Output" /collections/abayas/products/embroidered-linen-abaya ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # Limits URL: https://sooquna.com/docs/liquid/limits > How long a page may take to render, and the limits on loops, sections and nesting. Limits keep every storefront fast, and stop one theme's mistake from slowing down a store. | Limit | Value | When it's reached | | --- | --- | --- | | Render time per page | 2 seconds | The page fails with "This page can't be shown right now." | | Iterations per loop | 10,000 | The loop stops early. | | Iterations per page, all loops | 100,000 | Further loops don't run. | | Sections per page | 200 | Further sections show an error in previews. | | Nesting of render, section and layout | 10 levels | An error in previews. | | Block nesting | 8 levels | The theme check refuses the template. | | Items per paginated page | 250 | Larger sizes are capped. | | Sections per section rendering request | 5 | Extra IDs are ignored. | | Predictive search results per type | 10 | Capped. | | Product recommendations | 10 | Capped. | ## Staying fast - Keep loops short: `limit:` on `for`, and paginate long lists. - Don't loop over `collections` or `all_products` to find one item: look it up by handle, `collections['sale']`. - Render images with [`image_url`](/docs/liquid/filters/image_url) and [`image_tag`](/docs/liquid/filters/image_tag) so they come resized from the CDN. See [Performance](/docs/best-practices/performance). --- # Objects URL: https://sooquna.com/docs/liquid/objects > The global variables and the types of value Sooquna themes read. The global variables and the types of value Sooquna themes read. ## Global | Name | Summary | | --- | --- | | [`all_products`](/docs/liquid/objects/all_products) | Products by handle: all_products['linen-abaya']. | | [`blogs`](/docs/liquid/objects/blogs) | Blogs by handle: blogs['news'].articles. | | [`canonical_url`](/docs/liquid/objects/canonical_url) | Canonical URL of the current page (includes ?page= after page 1). | | [`cart`](/docs/liquid/objects/cart) | The shopper's cart. | | [`collections`](/docs/liquid/objects/collections) | Collections by handle: collections['sale'], collections.all. | | [`content_for_header`](/docs/liquid/objects/content_for_header) | Required in the layout's <head>: meta, scripts and styles the platform adds. | | [`content_for_layout`](/docs/liquid/objects/content_for_layout) | Required in the layout's <body>: the template's content. | | [`current_page`](/docs/liquid/objects/current_page) | The ?page= number (1 by default). | | [`customer`](/docs/liquid/objects/customer) | The signed-in customer, nil for guests. | | [`features`](/docs/liquid/objects/features) | Store features that are on (Features in admin): features.wishlist, features.reviews… | | [`linklists`](/docs/liquid/objects/linklists) | Navigation menus by handle: linklists['main-menu'].links. | | [`localization`](/docs/liquid/objects/localization) | Languages and countries, for the language selector. | | [`page_description`](/docs/liquid/objects/page_description) | SEO description of the current page (empty when none). | | [`page_image`](/docs/liquid/objects/page_image) | Share image of the current page (the store's share image by default). | | [`page_title`](/docs/liquid/objects/page_title) | SEO title of the current page. | | [`pages`](/docs/liquid/objects/pages) | Pages by handle: pages['about'].content. | | [`powered_by_link`](/docs/liquid/objects/powered_by_link) | A "Powered by Sooquna" link. | | [`recently_viewed`](/docs/liquid/objects/recently_viewed) | Products the shopper viewed (from ?recent_ids=, sent by a recently-viewed section). | | [`request`](/docs/liquid/objects/request) | The current request. | | [`routes`](/docs/liquid/objects/routes) | Storefront URLs, with the language prefix where needed. | | [`settings`](/docs/liquid/objects/settings) | Theme settings (config/settings_schema.json). | | [`shop`](/docs/liquid/objects/shop) | The store. | | [`template`](/docs/liquid/objects/template) | The current template. | | [`theme`](/docs/liquid/objects/theme) | The theme being rendered. | ## Template | Name | Summary | | --- | --- | | [`article`](/docs/liquid/objects/article) | A blog post. | | [`blog`](/docs/liquid/objects/blog) | A blog. | | [`collection`](/docs/liquid/objects/collection) | A collection. | | [`current_tags`](/docs/liquid/objects/current_tags) | Tags filtering a blog (/blogs/news/tagged/x). | | [`custom_page`](/docs/liquid/objects/custom_page) | A custom landing page (custom_pages/<name>.liquid, at /custom/<name>). | | [`form_error`](/docs/liquid/objects/form_error) | The wrong-password message on the password page. | | [`metaobject`](/docs/liquid/objects/metaobject) | An entry of a custom content type, on its own page. | | [`page`](/docs/liquid/objects/page) | A content page. | | [`predictive_search`](/docs/liquid/objects/predictive_search) | Suggestions for a predictive-search section (rendered with section_id=). | | [`product`](/docs/liquid/objects/product) | A product. | | [`recommendations`](/docs/liquid/objects/recommendations) | Product recommendations for a section (rendered with product_id= and section_id=). | | [`robots`](/docs/liquid/objects/robots) | Default robots.txt rules, for templates/robots.txt.liquid. | | [`search`](/docs/liquid/objects/search) | Search results. | | [`wishlist`](/docs/liquid/objects/wishlist) | The wishlist page (/wishlist). | ## Resource | Name | Summary | | --- | --- | | [`comment`](/docs/liquid/objects/comment) | A blog comment. | | [`external_video`](/docs/liquid/objects/external_video) | A YouTube or Vimeo video among a product's media. | | [`filter`](/docs/liquid/objects/filter) | A storefront filter of a collection or search page (collection.filters, search.filters). | | [`filter_value`](/docs/liquid/objects/filter_value) | One value of a filter. | | [`image`](/docs/liquid/objects/image) | An image. | | [`line_item`](/docs/liquid/objects/line_item) | A cart line. | | [`link`](/docs/liquid/objects/link) | A menu link. | | [`linklist`](/docs/liquid/objects/linklist) | A navigation menu. | | [`metafield`](/docs/liquid/objects/metafield) | A custom field. | | [`metaobject_field`](/docs/liquid/objects/metaobject_field) | A field of a metaobject entry. | | [`policy`](/docs/liquid/objects/policy) | A store policy. | | [`product_option`](/docs/liquid/objects/product_option) | An option with its values (product.options_with_values). | | [`product_option_value`](/docs/liquid/objects/product_option_value) | One value of an option. | | [`review`](/docs/liquid/objects/review) | A product review. | | [`reviews`](/docs/liquid/objects/reviews) | A product's reviews (reviews feature). | | [`variant`](/docs/liquid/objects/variant) | A product variant. | ## Sections and blocks | Name | Summary | | --- | --- | | [`block`](/docs/liquid/objects/block) | The current block. | | [`closest`](/docs/liquid/objects/closest) | Objects a section hands down to every theme block inside it. | | [`section`](/docs/liquid/objects/section) | The current section. | ## Loops and forms | Name | Summary | | --- | --- | | [`forloop`](/docs/liquid/objects/forloop) | Loop state inside for. | | [`form`](/docs/liquid/objects/form) | Form state inside form. | | [`paginate`](/docs/liquid/objects/paginate) | Pagination state inside paginate. | | [`tablerowloop`](/docs/liquid/objects/tablerowloop) | Loop state inside tablerow. | --- # all_products URL: https://sooquna.com/docs/liquid/objects/all_products > Products by handle: all_products['linen-abaya']. Products by handle: all_products['linen-abaya']. **Available in:** Every template. ## Related - [`product`](/docs/liquid/objects/product) ## Compatibility :::caution[Differs from Shopify] Lookup only: it can't be looped. ::: Since theme platform 1.0. --- # article URL: https://sooquna.com/docs/liquid/objects/article > A blog post. A blog post. **Available in:** Article template; blog.articles. ## Properties | Property | Type | Description | | --- | --- | --- | | `article.id` | string | ID. | | `article.title` | string | Title. | | `article.handle` | string | Handle. | | `article.url` | string | URL. | | `article.content` | html | Content. | | `article.excerpt` | html | Summary. | | `article.excerpt_or_content` | html | Summary | | `article.author` | string | Author. | | `article.image` | image | Image. | | `article.tags` | array | Tags. | | `article.published_at` | date | Publish date. | | `article.comments` | array of comment | Published comments. | | `article.comments_count` | number | Number of comments. | | `article.comment_post_url` | string | Comment form URL. | ## Example ```liquid title="Liquid" {{ article.title }} · {{ article.published_at | date: '%d %b %Y' }} ``` ```html title="Output" Dressing for Eid · 14 Mar 2026 ``` ## Related - [`blog`](/docs/liquid/objects/blog) - [`comment`](/docs/liquid/objects/comment) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # block URL: https://sooquna.com/docs/liquid/objects/block > The current block. The current block. **Available in:** Section files (loops over section.blocks) and blocks/. ## Properties | Property | Type | Description | | --- | --- | --- | | `block.id` | string | Block ID. | | `block.type` | string | Block type. | | `block.settings` | object | Block settings. | | `block.shopify_attributes` | string | Attributes the editor needs; output them on the block's wrapper. | ## Example ```liquid title="Liquid" {% for block in section.blocks %}

{% endfor %} ``` ```html title="Output"

Free delivery in Doha

``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # blog URL: https://sooquna.com/docs/liquid/objects/blog > A blog. A blog. **Available in:** Blog and article templates; also blogs['handle']. ## Properties | Property | Type | Description | | --- | --- | --- | | `blog.id` | string | ID. | | `blog.title` | string | Title. | | `blog.handle` | string | Handle. | | `blog.url` | string | URL. | | `blog.articles` | array of article | Articles on this page. | | `blog.articles_count` | number | Number of articles. | | `blog.all_tags` | array | Tags its articles use. | | `blog.comments_enabled?` | boolean | Comments allowed. | ## Related - [`article`](/docs/liquid/objects/article) - [`current_tags`](/docs/liquid/objects/current_tags) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # blogs URL: https://sooquna.com/docs/liquid/objects/blogs > Blogs by handle: blogs['news'].articles. Blogs by handle: blogs['news'].articles. **Available in:** Every template. ## Related - [`blog`](/docs/liquid/objects/blog) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # canonical_url URL: https://sooquna.com/docs/liquid/objects/canonical_url > Canonical URL of the current page (includes ?page= after page 1). Canonical URL of the current page (includes ?page= after page 1). **Available in:** Every template. ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # cart URL: https://sooquna.com/docs/liquid/objects/cart > The shopper's cart. The shopper's cart. **Available in:** Every template. ## Properties | Property | Type | Description | | --- | --- | --- | | `cart.item_count` | number | Number of items. | | `cart.items` | array of line_item | Lines. | | `cart.total_price` | number | Total after discounts (minor units). | | `cart.items_subtotal_price` | number | Items total. | | `cart.original_total_price` | number | Total before discounts. | | `cart.total_discount` | number | Discounts. | | `cart.total_weight` | number | Weight in grams. | | `cart.note` | string | Order note. | | `cart.attributes` | object | Cart attributes. | | `cart.currency` | object | Currency. | | `cart.requires_shipping` | boolean | Has items that ship. | | `cart.cart_level_discount_applications` | array | Order discounts. | | `cart.discount_codes` | array | Codes entered (code, applicable). | | `cart.free_shipping_threshold` | number | Order total for free shipping, nil when none (Sooquna). | | `cart.empty?` | boolean | True when empty. | ## Example ```liquid title="Liquid" {{ cart.item_count }} · {{ cart.total_price | money }} ``` ```html title="Output" 3 · QAR 1,220.00 ``` ## Related - [`line_item`](/docs/liquid/objects/line_item) ## Compatibility :::caution[Differs from Shopify] Adds free_shipping_threshold for progress bars. ::: Since theme platform 1.0. --- # closest URL: https://sooquna.com/docs/liquid/objects/closest > Objects a section hands down to every theme block inside it. Objects a section hands down to every theme block inside it. A section passes them with {% content_for 'blocks', closest.product: product %}; any block below, however deep, reads closest.product. Use it so one block (a price, a buy button) works in every section that shows a product. **Available in:** Theme blocks. ## Properties | Property | Type | Description | | --- | --- | --- | | `closest.product` | product | The product the section is about (when it passes one). | ## Example ```liquid title="Liquid" {{ closest.product.title | default: 'No product here' }} ``` ```html title="Output" No product here ``` ## Related - [`block`](/docs/liquid/objects/block) - [`content_for`](/docs/liquid/tags/content_for) ## Compatibility :::caution[Differs from Shopify] Set explicitly with content_for 'blocks', closest.<name>: …; Shopify also infers it from the template. ::: Since theme platform 1.0. --- # collection URL: https://sooquna.com/docs/liquid/objects/collection > A collection. A collection. **Available in:** Collection template; also collections['handle']. ## Properties | Property | Type | Description | | --- | --- | --- | | `collection.id` | string | ID. | | `collection.title` | string | Title. | | `collection.handle` | string | Handle. | | `collection.url` | string | URL. | | `collection.description` | html | Description. | | `collection.image` | image | Image. | | `collection.products` | array of product | Products (use paginate for more than 50). | | `collection.products_count` | number | Products after filters. | | `collection.all_products_count` | number | All products. | | `collection.filters` | array | Storefront filters. | | `collection.sort_by` | string | Current sort order. | | `collection.sort_options` | array | Sort orders (name, value). | | `collection.default_sort_by` | string | Default sort order. | | `collection.current_type` | string | Type, on /collections/types?q=. | | `collection.current_vendor` | string | Vendor, on /collections/vendors?q=. | | `collection.template_suffix` | string | Alternate template. | ## Example ```liquid title="Liquid" {{ collection.title }}: {% for p in collection.products limit: 2 %}{{ p.title }}{% unless forloop.last %}, {% endunless %}{% endfor %} ``` ```html title="Output" Abayas: Embroidered linen abaya, Royal oud gift set ``` ## Related - [`product`](/docs/liquid/objects/product) - [`paginate`](/docs/liquid/objects/paginate) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # collections URL: https://sooquna.com/docs/liquid/objects/collections > Collections by handle: collections['sale'], collections.all. Collections by handle: collections['sale'], collections.all. Looping gives up to 250 collections. **Available in:** Every template. ## Example ```liquid title="Liquid" {{ collections.all.products_count }} products ``` ```html title="Output" 24 products ``` ## Related - [`collection`](/docs/liquid/objects/collection) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # comment URL: https://sooquna.com/docs/liquid/objects/comment > A blog comment. A blog comment. **Available in:** article.comments. ## Properties | Property | Type | Description | | --- | --- | --- | | `comment.id` | string | ID. | | `comment.author` | string | Author. | | `comment.content` | string | Comment. | | `comment.created_at` | date | Posted. | | `comment.status` | string | published. | ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # content_for_header URL: https://sooquna.com/docs/liquid/objects/content_for_header > Required in the layout's : meta, scripts and styles the platform adds. Required in the layout's <head>: meta, scripts and styles the platform adds. **Available in:** Layouts. ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # content_for_layout URL: https://sooquna.com/docs/liquid/objects/content_for_layout > Required in the layout's : the template's content. Required in the layout's <body>: the template's content. **Available in:** Layouts. ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # current_page URL: https://sooquna.com/docs/liquid/objects/current_page > The ?page= number (1 by default). The ?page= number (1 by default). **Available in:** Every template. ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # current_tags URL: https://sooquna.com/docs/liquid/objects/current_tags > Tags filtering a blog (/blogs/news/tagged/x). Tags filtering a blog (/blogs/news/tagged/x). **Available in:** Blog template. ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # custom_page URL: https://sooquna.com/docs/liquid/objects/custom_page > A custom landing page (custom_pages/.liquid, at /custom/). A custom landing page (custom_pages/<name>.liquid, at /custom/<name>). **Available in:** Custom page templates. ## Properties | Property | Type | Description | | --- | --- | --- | | `custom_page.name` | string | File name. | | `custom_page.title` | string | Title. | | `custom_page.url` | string | URL. | | `custom_page.settings` | object | Settings from the file's {% schema %}. | ## Compatibility :::tip[Sooquna only] Sooquna only; see the custom page tutorial. ::: Since theme platform 1.0. --- # customer URL: https://sooquna.com/docs/liquid/objects/customer > The signed-in customer, nil for guests. The signed-in customer, nil for guests. Order history and addresses are on the account pages, which Sooquna draws for the theme. **Available in:** Every template. ## Properties | Property | Type | Description | | --- | --- | --- | | `customer.id` | string | ID. | | `customer.name` | string | Full name. | | `customer.first_name` | string | First name. | | `customer.last_name` | string | Last name. | | `customer.email` | string | Email. | | `customer.orders_count` | number | Number of orders. | | `customer.has_account` | boolean | Always true when signed in. | ## Example ```liquid title="Liquid" {% if customer %}Hi {{ customer.first_name }}{% else %}Sign in{% endif %} ``` ```html title="Output" Sign in ``` ## Compatibility :::caution[Differs from Shopify] No orders, addresses or tags: customer account pages are drawn by Sooquna, not by templates/customers. ::: Since theme platform 1.0. --- # external_video URL: https://sooquna.com/docs/liquid/objects/external_video > A YouTube or Vimeo video among a product's media. A YouTube or Vimeo video among a product's media. **Available in:** product.media. ## Properties | Property | Type | Description | | --- | --- | --- | | `external_video.id` | string | ID. | | `external_video.media_type` | string | external_video. | | `external_video.host` | string | youtube or vimeo. | | `external_video.external_id` | string | Video ID on the host. | | `external_video.alt` | string | Alt text. | | `external_video.position` | number | Position. | ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # features URL: https://sooquna.com/docs/liquid/objects/features > Store features that are on (Features in admin): features.wishlist, features.reviews… Store features that are on (Features in admin): features.wishlist, features.reviews… Every feature key in admin works (unknown keys are nil); the common ones are below. Sections, blocks and settings groups with "capability" in their schema render only while that feature is on, so a theme can ship them all. **Available in:** Every template. ## Properties | Property | Type | Description | | --- | --- | --- | | `features.wishlist` | boolean | Wishlist. | | `features.reviews` | boolean | Product reviews. | | `features.back_in_stock` | boolean | Back-in-stock alerts. | | `features.back_in_stock_whatsapp` | boolean | Back-in-stock alerts can go to WhatsApp. | | `features.quick_view` | boolean | Quick view. | | `features.image_zoom` | boolean | Image zoom. | | `features.product_badges` | boolean | Product badges. | | `features.stock_status` | boolean | Stock status. | | `features.order_tracking` | boolean | Order lookup (/orders/lookup). | | `features.size_guide` | boolean | Size guide. | | `features.related_products` | boolean | Related products. | | `features.whatsapp_share` | boolean | Share on WhatsApp. | | `features.announcement_bar` | boolean | Announcement bar. | | `features.newsletter_capture` | boolean | Newsletter sign-up. | | `features.gift_message` | boolean | Gift message at checkout. | ## Example ```liquid title="Liquid" {% if features.wishlist %}Saved{% endif %} ``` ```html title="Output" Saved ``` ## Compatibility :::tip[Sooquna only] Sooquna's built-in storefront features; Shopify uses apps. ::: Since theme platform 1.0. --- # filter URL: https://sooquna.com/docs/liquid/objects/filter > A storefront filter of a collection or search page (collection.filters, search.filters). A storefront filter of a collection or search page (collection.filters, search.filters). Merchants choose the filters in Storefront › Search & discovery. Each filter adds its param_name to the URL; the page reloads (or re-renders the section) with the filtered products. **Available in:** collection.filters, search.filters. ## Properties | Property | Type | Description | | --- | --- | --- | | `filter.label` | string | Name, in the visitor's language. | | `filter.type` | string | list, price_range or boolean. | | `filter.param_name` | string | URL parameter (filter.v.price, filter.p.vendor, filter.v.option.color…). | | `filter.presentation` | string | swatch for colour options, else text. | | `filter.values` | array of filter_value | Values (list and boolean filters). | | `filter.active_values` | array of filter_value | Values in use. | | `filter.inactive_values` | array of filter_value | Values not in use. | | `filter.min_value` | object | price_range: param_name and value of the minimum. | | `filter.max_value` | object | price_range: param_name and value of the maximum. | | `filter.range_min` | number | price_range: lowest price in the list. | | `filter.range_max` | number | price_range: highest price in the list. | | `filter.url_to_remove` | string | The current URL without this filter. | ## Related - [`filter_value`](/docs/liquid/objects/filter_value) - [`collection`](/docs/liquid/objects/collection) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # filter_value URL: https://sooquna.com/docs/liquid/objects/filter_value > One value of a filter. One value of a filter. **Available in:** filter.values. ## Properties | Property | Type | Description | | --- | --- | --- | | `filter_value.label` | string | Label. | | `filter_value.value` | string | Value in the URL. | | `filter_value.count` | number | Products with it. | | `filter_value.active` | boolean | In use. | | `filter_value.param_name` | string | The filter's URL parameter. | | `filter_value.url_to_add` | string | The current URL with this value added. | | `filter_value.url_to_remove` | string | The current URL without it. | | `filter_value.swatch` | object | swatch.color for colour values. | ## Related - [`filter`](/docs/liquid/objects/filter) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # forloop URL: https://sooquna.com/docs/liquid/objects/forloop > Loop state inside for. Loop state inside for. **Available in:** Inside for. ## Properties | Property | Type | Description | | --- | --- | --- | | `forloop.index` | number | 1-based index. | | `forloop.index0` | number | 0-based index. | | `forloop.rindex` | number | Index from the end (1-based). | | `forloop.rindex0` | number | Index from the end (0-based). | | `forloop.first` | boolean | First iteration. | | `forloop.last` | boolean | Last iteration. | | `forloop.length` | number | Number of iterations. | ## Example ```liquid title="Liquid" {% for i in (1..3) %}{{ forloop.index }}{% if forloop.last %}!{% endif %}{% endfor %} ``` ```html title="Output" 123! ``` ## Compatibility :::caution[Differs from Shopify] forloop.parentloop isn't available. ::: Since theme platform 1.0. --- # form URL: https://sooquna.com/docs/liquid/objects/form > Form state inside form. Form state inside form. **Available in:** Inside form. ## Properties | Property | Type | Description | | --- | --- | --- | | `form.posted_successfully?` | boolean | Submitted without errors. | | `form.errors` | array | Errors. | | `form.email` | string | Submitted email. | | `form.body` | string | Submitted message. | ## Related - [`form`](/docs/liquid/objects/form) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # form_error URL: https://sooquna.com/docs/liquid/objects/form_error > The wrong-password message on the password page. The wrong-password message on the password page. **Available in:** Password template. ## Compatibility :::tip[Sooquna only] Shopify uses form.errors. ::: Since theme platform 1.0. --- # image URL: https://sooquna.com/docs/liquid/objects/image > An image. An image. Pass it to image_url to get a resized URL. **Available in:** product.images, collection.image, image_picker settings… ## Properties | Property | Type | Description | | --- | --- | --- | | `image.id` | string | ID. | | `image.src` | string | Original URL. | | `image.url` | string | Same as src. | | `image.alt` | string | Alt text. | | `image.width` | number | Width. | | `image.height` | number | Height. | | `image.aspect_ratio` | number | Width ÷ height. | | `image.position` | number | Position among the product's media. | | `image.media_type` | string | image. | | `image.presentation` | object | presentation.focal_point, as CSS object-position. | ## Example ```liquid title="Liquid" {{ product.featured_image.alt }} {{ product.featured_image.width }}×{{ product.featured_image.height }} ``` ```html title="Output" Linen abaya 1600×2000 ``` ## Related - [`image_url`](/docs/liquid/filters/image_url) - [`image_tag`](/docs/liquid/filters/image_tag) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # line_item URL: https://sooquna.com/docs/liquid/objects/line_item > A cart line. A cart line. **Available in:** cart.items. ## Properties | Property | Type | Description | | --- | --- | --- | | `line_item.id` | string | Line key. | | `line_item.key` | string | Line key (for /cart/change). | | `line_item.title` | string | Product and variant title. | | `line_item.product_title` | string | Product title. | | `line_item.variant_title` | string | Variant title. | | `line_item.quantity` | number | Quantity. | | `line_item.sku` | string | SKU. | | `line_item.vendor` | string | Vendor. | | `line_item.price` | number | Unit price. | | `line_item.original_price` | number | Unit price before discounts. | | `line_item.final_price` | number | Unit price after discounts. | | `line_item.line_price` | number | Line total. | | `line_item.original_line_price` | number | Line total before discounts. | | `line_item.final_line_price` | number | Line total after discounts. | | `line_item.total_discount` | number | Discount on the line. | | `line_item.line_level_discount_allocations` | array | Discounts on the line. | | `line_item.product` | object | Product (id, title, url, handle, vendor, featured_image). | | `line_item.variant` | object | Variant (id, title, image). | | `line_item.image` | image | Image. | | `line_item.url` | string | Variant URL. | | `line_item.properties` | object | Line properties. | | `line_item.requires_shipping` | boolean | Ships. | | `line_item.gift_card` | boolean | A gift card. | ## Example ```liquid title="Liquid" {% for item in cart.items %}{{ item.quantity }} × {{ item.title }} = {{ item.final_line_price | money }}{% endfor %} ``` ```html title="Output" 2 × Embroidered linen abaya - M / Sand = QAR 900.001 × Royal oud gift set = QAR 320.00 ``` ## Compatibility :::caution[Differs from Shopify] product and variant carry a few fields only; look up all_products[item.product.handle] for more. ::: Since theme platform 1.0. --- # link URL: https://sooquna.com/docs/liquid/objects/link > A menu link. A menu link. **Available in:** linklist.links, link.links. ## Properties | Property | Type | Description | | --- | --- | --- | | `link.title` | string | Title. | | `link.url` | string | URL. | | `link.active` | boolean | Current page. | | `link.child_active` | boolean | A child is the current page. | | `link.current` | boolean | Same as active. | | `link.links` | array of link | Child links. | | `link.type` | string | Link type (collection_link, http_link…). | | `link.handle` | string | Handle of the title. | | `link.object` | object | Linked resource. | ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # linklist URL: https://sooquna.com/docs/liquid/objects/linklist > A navigation menu. A navigation menu. **Available in:** linklists, link_list settings. ## Properties | Property | Type | Description | | --- | --- | --- | | `linklist.handle` | string | Handle. | | `linklist.title` | string | Title. | | `linklist.links` | array of link | Top-level links. | | `linklist.levels` | number | Nesting depth. | ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # linklists URL: https://sooquna.com/docs/liquid/objects/linklists > Navigation menus by handle: linklists['main-menu'].links. Navigation menus by handle: linklists['main-menu'].links. **Available in:** Every template. ## Example ```liquid title="Liquid" {% for link in linklists.main-menu.links %}{{ link.title }} {% endfor %} ``` ```html title="Output" Abayas Oud ``` ## Related - [`linklist`](/docs/liquid/objects/linklist) - [`link`](/docs/liquid/objects/link) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # localization URL: https://sooquna.com/docs/liquid/objects/localization > Languages and countries, for the language selector. Languages and countries, for the language selector. **Available in:** Every template. ## Properties | Property | Type | Description | | --- | --- | --- | | `localization.language` | object | Current language (iso_code, name, endonym_name, primary, root_url, direction). | | `localization.available_languages` | array | Published languages. | | `localization.country` | object | Store country (iso_code, name, currency.iso_code). | | `localization.available_countries` | array | Countries. | ## Example ```liquid title="Liquid" {% for l in localization.available_languages %}{{ l.endonym_name }} {% endfor %} ``` ```html title="Output" English العربية ``` ## Related - [`form`](/docs/liquid/objects/form) ## Compatibility :::caution[Differs from Shopify] One country, the store's: prices are in its currency. ::: Since theme platform 1.0. --- # metafield URL: https://sooquna.com/docs/liquid/objects/metafield > A custom field. A custom field. Reach one as resource.metafields.namespace.key; output it directly, or read .value. **Available in:** product.metafields, collection.metafields, shop.metafields… ## Properties | Property | Type | Description | | --- | --- | --- | | `metafield.value` | any | The value | | `metafield.type` | string | Type (single_line_text_field, rating…). | | `metafield.namespace` | string | Namespace. | | `metafield.key` | string | Key. | ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # metaobject URL: https://sooquna.com/docs/liquid/objects/metaobject > An entry of a custom content type, on its own page. An entry of a custom content type, on its own page. Fields are read by key (metaobject.author.value). **Available in:** Metaobject templates (templates/metaobject/<type>.json). ## Properties | Property | Type | Description | | --- | --- | --- | | `metaobject.id` | string | ID. | | `metaobject.handle` | string | Handle. | | `metaobject.type` | string | Type. | | `metaobject.url` | string | URL. | ## Related - [`metaobject_field`](/docs/liquid/objects/metaobject_field) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # metaobject_field URL: https://sooquna.com/docs/liquid/objects/metaobject_field > A field of a metaobject entry. A field of a metaobject entry. **Available in:** metaobject.<field>. ## Properties | Property | Type | Description | | --- | --- | --- | | `metaobject_field.value` | any | The value. | | `metaobject_field.type` | string | Type. | ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # page URL: https://sooquna.com/docs/liquid/objects/page > A content page. A content page. **Available in:** Page template; also pages['handle']. ## Properties | Property | Type | Description | | --- | --- | --- | | `page.id` | string | ID. | | `page.title` | string | Title. | | `page.handle` | string | Handle. | | `page.url` | string | URL. | | `page.content` | html | Content. | | `page.author` | string | Author. | | `page.published_at` | date | Publish date. | | `page.template_suffix` | string | Alternate template. | ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # page_description URL: https://sooquna.com/docs/liquid/objects/page_description > SEO description of the current page (empty when none). SEO description of the current page (empty when none). **Available in:** Every template. ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # page_image URL: https://sooquna.com/docs/liquid/objects/page_image > Share image of the current page (the store's share image by default). Share image of the current page (the store's share image by default). **Available in:** Every template. ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # page_title URL: https://sooquna.com/docs/liquid/objects/page_title > SEO title of the current page. SEO title of the current page. **Available in:** Every template. ## Example ```liquid title="Liquid" {{ page_title }} – {{ shop.name }} ``` ```html title="Output" Embroidered linen abaya – Layla Boutique ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # pages URL: https://sooquna.com/docs/liquid/objects/pages > Pages by handle: pages['about'].content. Pages by handle: pages['about'].content. **Available in:** Every template. ## Related - [`page`](/docs/liquid/objects/page) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # paginate URL: https://sooquna.com/docs/liquid/objects/paginate > Pagination state inside paginate. Pagination state inside paginate. **Available in:** Inside paginate. ## Properties | Property | Type | Description | | --- | --- | --- | | `paginate.current_page` | number | Current page. | | `paginate.current_offset` | number | Items before this page. | | `paginate.pages` | number | Number of pages. | | `paginate.items` | number | Number of items. | | `paginate.page_size` | number | Items per page. | | `paginate.page_param` | string | Query parameter (page). | | `paginate.previous` | object | Previous page link (title, url, is_link). | | `paginate.next` | object | Next page link. | | `paginate.parts` | array | Page links. | ## Related - [`paginate`](/docs/liquid/objects/paginate) - [`default_pagination`](/docs/liquid/filters/default_pagination) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # policy URL: https://sooquna.com/docs/liquid/objects/policy > A store policy. A store policy. **Available in:** shop.policies, shop.refund_policy… ## Properties | Property | Type | Description | | --- | --- | --- | | `policy.title` | string | Title. | | `policy.body` | html | Content. | | `policy.url` | string | URL. | | `policy.handle` | string | Handle. | | `policy.kind` | string | refund, privacy, terms, shipping, contact or legal. | ## Example ```liquid title="Liquid" {% for p in shop.policies %}{{ p.title }} {% endfor %} ``` ```html title="Output" Refund policy Privacy policy ``` ## Compatibility :::caution[Differs from Shopify] kind is Sooquna's. ::: Since theme platform 1.0. --- # powered_by_link URL: https://sooquna.com/docs/liquid/objects/powered_by_link > A "Powered by Sooquna" link. A "Powered by Sooquna" link. **Available in:** Every template. ## Compatibility :::caution[Differs from Shopify] Links to Sooquna. ::: Since theme platform 1.0. --- # predictive_search URL: https://sooquna.com/docs/liquid/objects/predictive_search > Suggestions for a predictive-search section (rendered with section_id=). Suggestions for a predictive-search section (rendered with section_id=). **Available in:** Sections rendered by routes.predictive_search_url. ## Properties | Property | Type | Description | | --- | --- | --- | | `predictive_search.performed` | boolean | A query was given. | | `predictive_search.terms` | string | Query. | | `predictive_search.resources` | object | products, collections, pages, articles and queries. | ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # product URL: https://sooquna.com/docs/liquid/objects/product > A product. A product. **Available in:** Product template; also loops (collection.products, search results) and all_products. ## Properties | Property | Type | Description | | --- | --- | --- | | `product.id` | string | ID. | | `product.title` | string | Title (in the current language). | | `product.handle` | string | Handle. | | `product.url` | string | URL. | | `product.description` | html | Description. | | `product.content` | html | Same as description. | | `product.vendor` | string | Vendor. | | `product.type` | string | Product type. | | `product.tags` | array | Tags. | | `product.price` | number | Lowest variant price (minor units). | | `product.price_min` | number | Lowest price. | | `product.price_max` | number | Highest price. | | `product.price_varies` | boolean | Variants differ in price. | | `product.compare_at_price` | number | Compare-at price. | | `product.compare_at_price_max` | number | Highest compare-at price. | | `product.available` | boolean | A variant can be bought. | | `product.featured_image` | image | First image. | | `product.featured_media` | image | First media. | | `product.images` | array of image | Images. | | `product.media` | array | Images and external videos. | | `product.options` | array | Option names. | | `product.options_with_values` | array of product_option | Options with values. | | `product.variants` | array of variant | Variants. | | `product.selected_variant` | variant | Variant from ?variant=. | | `product.selected_or_first_available_variant` | variant | Selected | | `product.first_available_variant` | variant | First available variant. | | `product.has_only_default_variant` | boolean | No options. | | `product.collections` | array of collection | Collections it's in. | | `product.metafields` | object | Custom fields (product.metafields.custom.key). | | `product.gift_card?` | boolean | A gift card product. | | `product.published_at` | date | Publish date. | | `product.created_at` | date | Created. | | `product.updated_at` | date | Updated. | | `product.template_suffix` | string | Alternate template. | | `product.rating` | number | Average published review rating to 1 decimal (reviews feature; nil without reviews). | | `product.rating_count` | number | Published reviews. | | `product.reviews` | reviews | Reviews (reviews feature). | | `product.bestseller` | boolean | One of the store's top sellers (product_badges feature). | ## Examples ```liquid title="Liquid" {{ product.title }} – {{ product.price | money }}{% if product.compare_at_price > product.price %} (was {{ product.compare_at_price | money }}){% endif %} ``` ```html title="Output" Embroidered linen abaya – QAR 450.00 (was QAR 520.00) ``` ### Arabic page ```liquid title="Liquid (Arabic page)" {{ product.title }} – {{ product.price | money }} ``` ```html title="Output" عباية كتان مطرزة – 450.00 ر.ق ``` ## Related - [`variant`](/docs/liquid/objects/variant) - [`image`](/docs/liquid/objects/image) - [`product_option`](/docs/liquid/objects/product_option) - [`reviews`](/docs/liquid/objects/reviews) ## Compatibility :::caution[Differs from Shopify] Adds rating, reviews and bestseller; selling plans are empty. ::: Since theme platform 1.0. --- # product_option URL: https://sooquna.com/docs/liquid/objects/product_option > An option with its values (product.options_with_values). An option with its values (product.options_with_values). **Available in:** product.options_with_values. ## Properties | Property | Type | Description | | --- | --- | --- | | `product_option.name` | string | Name. | | `product_option.position` | number | 1-based position. | | `product_option.selected_value` | string | Value of the selected variant. | | `product_option.values` | array of product_option_value | Values. | ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # product_option_value URL: https://sooquna.com/docs/liquid/objects/product_option_value > One value of an option. One value of an option. **Available in:** product_option.values. ## Properties | Property | Type | Description | | --- | --- | --- | | `product_option_value.id` | string | ID. | | `product_option_value.name` | string | Value. | | `product_option_value.available` | boolean | A variant with it can be bought. | | `product_option_value.selected` | boolean | The selected variant has it. | ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # recently_viewed URL: https://sooquna.com/docs/liquid/objects/recently_viewed > Products the shopper viewed (from ?recent_ids=, sent by a recently-viewed section). Products the shopper viewed (from ?recent_ids=, sent by a recently-viewed section). **Available in:** Every template. ## Properties | Property | Type | Description | | --- | --- | --- | | `recently_viewed.products` | array of product | Products. | | `recently_viewed.size` | number | How many. | ## Compatibility :::tip[Sooquna only] Sooquna only. ::: Since theme platform 1.0. --- # recommendations URL: https://sooquna.com/docs/liquid/objects/recommendations > Product recommendations for a section (rendered with product_id= and section_id=). Product recommendations for a section (rendered with product_id= and section_id=). **Available in:** Product template, and sections rendered by routes.product_recommendations_url. ## Properties | Property | Type | Description | | --- | --- | --- | | `recommendations.performed` | boolean | Recommendations were computed. | | `recommendations.intent` | string | related or complementary. | | `recommendations.products` | array of product | Recommended products. | | `recommendations.products_count` | number | How many. | ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # request URL: https://sooquna.com/docs/liquid/objects/request > The current request. The current request. **Available in:** Every template. ## Properties | Property | Type | Description | | --- | --- | --- | | `request.host` | string | Host name. | | `request.path` | string | Path. | | `request.origin` | string | Scheme and host (https://…). | | `request.locale` | object | Current language: iso_code, name, endonym_name, primary, root_url, direction (ltr or rtl). | | `request.page_type` | string | Template type (index, product, collection…). | | `request.design_mode` | boolean | True in the theme editor. | | `request.visual_preview_mode` | boolean | True in an editor preview. | ## Example ```liquid title="Liquid" ``` ```html title="Output" ``` ## Compatibility :::caution[Differs from Shopify] request.locale.direction is Sooquna's: use it for dir= on RTL languages. ::: Since theme platform 1.0. --- # review URL: https://sooquna.com/docs/liquid/objects/review > A product review. A product review. **Available in:** product.reviews.items. ## Properties | Property | Type | Description | | --- | --- | --- | | `review.id` | string | ID. | | `review.author` | string | Reviewer's display name. | | `review.rating` | number | 1–5. | | `review.title` | string | Title. | | `review.body` | string | Review. | | `review.verified_buyer` | boolean | Bought the product. | | `review.created_at` | date | Posted. | | `review.reply` | string | The store's reply. | | `review.replied_at` | date | Replied. | | `review.helpful_count` | number | Helpful votes. | | `review.vote_url` | string | POST here to vote helpful. | ## Compatibility :::tip[Sooquna only] Sooquna's built-in reviews. ::: Since theme platform 1.0. --- # reviews URL: https://sooquna.com/docs/liquid/objects/reviews > A product's reviews (reviews feature). A product's reviews (reviews feature). **Available in:** product.reviews. ## Properties | Property | Type | Description | | --- | --- | --- | | `reviews.count` | number | Published reviews. | | `reviews.summary` | object | average, count and histogram (5 → count). | | `reviews.items` | array of review | Reviews on this page (?reviews_page=, ?reviews_sort=). | | `reviews.page` | number | Current page. | | `reviews.pages` | number | Number of pages. | | `reviews.per_page` | number | Reviews per page. | | `reviews.sort` | string | newest, highest, lowest or helpful. | | `reviews.form_url` | string | Where the review form posts. | ## Related - [`review`](/docs/liquid/objects/review) ## Compatibility :::tip[Sooquna only] Sooquna's built-in reviews. ::: Since theme platform 1.0. --- # robots URL: https://sooquna.com/docs/liquid/objects/robots > Default robots.txt rules, for templates/robots.txt.liquid. Default robots.txt rules, for templates/robots.txt.liquid. **Available in:** robots.txt.liquid. ## Properties | Property | Type | Description | | --- | --- | --- | | `robots.default` | string | The default rules. | | `robots.sitemap` | string | Sitemap URL. | ## Example ```liquid title="Liquid" {{ robots.sitemap }} ``` ```html title="Output" https://layla.sooquna.store/sitemap.xml ``` ## Compatibility :::caution[Differs from Shopify] default is the rules as text, not groups. ::: Since theme platform 1.0. --- # routes URL: https://sooquna.com/docs/liquid/objects/routes > Storefront URLs, with the language prefix where needed. Storefront URLs, with the language prefix where needed. **Available in:** Every template. ## Properties | Property | Type | Description | | --- | --- | --- | | `routes.root_url` | string | Home. | | `routes.cart_url` | string | Cart page. | | `routes.cart_add_url` | string | Add to cart (POST, or /cart/add.js). | | `routes.cart_change_url` | string | Change a line. | | `routes.cart_update_url` | string | Update quantities | | `routes.cart_clear_url` | string | Empty the cart. | | `routes.account_url` | string | Customer account. | | `routes.account_login_url` | string | Sign in. | | `routes.account_logout_url` | string | Sign out. | | `routes.account_register_url` | string | Create an account. | | `routes.account_addresses_url` | string | Addresses. | | `routes.account_recover_url` | string | Reset password. | | `routes.collections_url` | string | All collections. | | `routes.all_products_collection_url` | string | All products. | | `routes.search_url` | string | Search. | | `routes.predictive_search_url` | string | Predictive search (JSON with ?q=, or HTML with section_id=). | | `routes.product_recommendations_url` | string | Product recommendations. | ## Example ```liquid title="Liquid" Cart ``` ```html title="Output" Cart ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # search URL: https://sooquna.com/docs/liquid/objects/search > Search results. Search results. **Available in:** Search template. ## Properties | Property | Type | Description | | --- | --- | --- | | `search.performed` | boolean | A search ran. | | `search.terms` | string | Query. | | `search.results` | array | Results (products, pages, articles); check item.object_type. | | `search.results_count` | number | Number of results. | | `search.filters` | array | Filters. | | `search.sort_by` | string | Sort order. | | `search.sort_options` | array | Sort orders. | | `search.types` | array | Resource types searched. | ## Related - [`predictive_search`](/docs/liquid/objects/predictive_search) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # section URL: https://sooquna.com/docs/liquid/objects/section > The current section. The current section. **Available in:** Section files. ## Properties | Property | Type | Description | | --- | --- | --- | | `section.id` | string | Section ID (unique on the page; use in element IDs). | | `section.settings` | object | Settings from its {% schema %}. | | `section.blocks` | array of block | Blocks. | | `section.index` | number | 1-based position on the page (lazy-load from 3 on). | | `section.location` | string | Section group or template. | ## Example ```liquid title="Liquid" {{ section.settings.heading }} ``` ```html title="Output" New in ``` ## Related - [`block`](/docs/liquid/objects/block) - [`schema`](/docs/liquid/tags/schema) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # settings URL: https://sooquna.com/docs/liquid/objects/settings > Theme settings (config/settings_schema.json). Theme settings (config/settings_schema.json). Values follow each setting's type; see Settings. Section and block settings are on section.settings and block.settings. **Available in:** Every template. ## Example ```liquid title="Liquid" {{ settings.brand_color }} ``` ```html title="Output" #8A1538 ``` ## Related - [`section`](/docs/liquid/objects/section) - [`block`](/docs/liquid/objects/block) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # shop URL: https://sooquna.com/docs/liquid/objects/shop > The store. The store. **Available in:** Every template. ## Properties | Property | Type | Description | | --- | --- | --- | | `shop.name` | string | Store name. | | `shop.id` | string | Store ID. | | `shop.email` | string | Contact email. | | `shop.phone` | string | Support phone. | | `shop.url` | string | Storefront origin (https://…). | | `shop.secure_url` | string | Same as url. | | `shop.domain` | string | Host of the current request. | | `shop.permanent_domain` | string | Same as domain. | | `shop.currency` | string | Store currency code (QAR, SAR…). | | `shop.money_format` | string | Money format ({{amount}} QAR). | | `shop.money_with_currency_format` | string | Same as money_format. | | `shop.locale` | string | Current language code. | | `shop.published_locales` | array | Language codes the store publishes. | | `shop.brand` | object | Brand assets from Settings > Brand (logo, colors, slogan). | | `shop.description` | string | Store description. | | `shop.enabled_payment_types` | array | Payment methods shown at checkout (cod, visa, skipcash…); pair with payment_type_svg_tag. | | `shop.policies` | array of policy | Store policies that have content. | | `shop.privacy_policy` | policy | Privacy policy. | | `shop.refund_policy` | policy | Refund policy. | | `shop.shipping_policy` | policy | Shipping policy. | | `shop.terms_of_service` | policy | Terms of service. | | `shop.contact_information` | policy | Contact information. | | `shop.legal_notice` | policy | Legal notice. | | `shop.metafields` | object | Store custom fields (shop.metafields.namespace.key). | | `shop.customer_accounts_enabled` | boolean | Always true. | | `shop.customer_accounts_optional` | boolean | Always true (guest checkout). | | `shop.password_message` | string | Message for the password page. | ## Example ```liquid title="Liquid" {{ shop.name }} · {{ shop.currency }} ``` ```html title="Output" Layla Boutique · QAR ``` ## Related - [`localization`](/docs/liquid/objects/localization) - [`request`](/docs/liquid/objects/request) ## Compatibility :::caution[Differs from Shopify] products_count, collections_count, types and vendors aren't available; use collections['all']. ::: Since theme platform 1.0. --- # tablerowloop URL: https://sooquna.com/docs/liquid/objects/tablerowloop > Loop state inside tablerow. Loop state inside tablerow. **Available in:** Inside tablerow. ## Properties | Property | Type | Description | | --- | --- | --- | | `tablerowloop.col` | number | 1-based column. | | `tablerowloop.row` | number | 1-based row. | | `tablerowloop.col_first` | boolean | First column. | | `tablerowloop.col_last` | boolean | Last column. | | `tablerowloop.index` | number | 1-based index. | ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # template URL: https://sooquna.com/docs/liquid/objects/template > The current template. The current template. **Available in:** Every template. ## Properties | Property | Type | Description | | --- | --- | --- | | `template.name` | string | Type (product, collection…). | | `template.suffix` | string | Alternate template suffix, nil for the default. | | `template.directory` | string | Always nil. | ## Example ```liquid title="Liquid" ``` ```html title="Output" ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # theme URL: https://sooquna.com/docs/liquid/objects/theme > The theme being rendered. The theme being rendered. **Available in:** Every template. ## Properties | Property | Type | Description | | --- | --- | --- | | `theme.id` | string | ID. | | `theme.name` | string | Name. | | `theme.role` | string | main, or unpublished in previews. | ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # variant URL: https://sooquna.com/docs/liquid/objects/variant > A product variant. A product variant. **Available in:** product.variants, product.selected_variant… ## Properties | Property | Type | Description | | --- | --- | --- | | `variant.id` | string | ID (send as id to /cart/add). | | `variant.title` | string | Title (S / Black). | | `variant.sku` | string | SKU. | | `variant.barcode` | string | Barcode. | | `variant.price` | number | Price. | | `variant.compare_at_price` | number | Compare-at price. | | `variant.available` | boolean | Can be bought. | | `variant.inventory_management` | string | Whether stock is tracked. | | `variant.inventory_policy` | string | continue or deny when sold out. | | `variant.option1` | string | First option value. | | `variant.option2` | string | Second option value. | | `variant.option3` | string | Third option value. | | `variant.options` | array | Option values. | | `variant.featured_image` | image | Image. | | `variant.weight` | number | Weight in grams. | | `variant.weight_unit` | string | Weight unit. | | `variant.requires_shipping` | boolean | Ships. | | `variant.taxable` | boolean | Taxed. | | `variant.quantity_rule` | object | min, max and increment. | | `variant.url` | string | Product URL with ?variant=. | | `variant.product` | product | The product. | ## Example ```liquid title="Liquid" {% for v in product.variants %}{{ v.title }}{% unless v.available %} (sold out){% endunless %}{% unless forloop.last %}, {% endunless %}{% endfor %} ``` ```html title="Output" S / Sand, M / Sand, L / Sand (sold out) ``` ## Compatibility :::caution[Differs from Shopify] inventory_quantity isn't exposed; use available. ::: Since theme platform 1.0. --- # wishlist URL: https://sooquna.com/docs/liquid/objects/wishlist > The wishlist page (/wishlist). The wishlist page (/wishlist). **Available in:** Wishlist template (wishlist feature). ## Properties | Property | Type | Description | | --- | --- | --- | | `wishlist.products` | array of product | Saved products. | | `wishlist.count` | number | How many. | | `wishlist.signed_in` | boolean | It's the customer's account list (not this browser's). | | `wishlist.api_url` | string | JSON endpoint for the list. | ## Compatibility :::tip[Sooquna only] Sooquna's built-in wishlist. ::: Since theme platform 1.0. --- # Pagination URL: https://sooquna.com/docs/liquid/pagination > Splitting collections, search results, blog posts and comments into pages. Long lists load one page at a time with [`paginate`](/docs/liquid/tags/paginate): ```liquid {%- paginate collection.products by 24 -%}

{% render 'product-card', product: product %}

{{ paginate | default_pagination }} {%- endpaginate -%} ``` ## What can be paginated | List | Without paginate | | --- | --- | | `collection.products` | the first 50 | | `search.results` | the first page | | `blog.articles` | the first page | | `article.comments` | the first page | ## Rules - **Page size**: 1 to 250 items. - **The page** comes from `?page=` in the URL, so `canonical_url` and the page title include it after page 1. - **Filters and sort order** in the URL are kept on every page link. - Inside the block, [`paginate`](/docs/liquid/objects/paginate) has `current_page`, `pages`, `items`, `previous`, `next` and `parts` to build your own controls. ```liquid {%- if paginate.pages > 1 -%} {%- endif -%} ``` In right-to-left pages, flip arrow icons with CSS (`[dir="rtl"] .icon-arrow { transform: scaleX(-1); }`) rather than swapping characters. --- # Tags URL: https://sooquna.com/docs/liquid/tags > Every Liquid tag a Sooquna theme can use, by category. Every Liquid tag a Sooquna theme can use, by category. ## Theme | Name | Summary | | --- | --- | | [`content_for`](/docs/liquid/tags/content_for) | Renders theme blocks. | | [`layout`](/docs/liquid/tags/layout) | Picks the layout of a template. | | [`render`](/docs/liquid/tags/render) | Renders a snippet in its own scope. | | [`schema`](/docs/liquid/tags/schema) | A section's or block's settings, blocks and presets (JSON). | | [`section`](/docs/liquid/tags/section) | Renders a section statically. | | [`sections`](/docs/liquid/tags/sections) | Renders a section group, such as the header or footer. | ## Control flow | Name | Summary | | --- | --- | | [`case`](/docs/liquid/tags/case) | Chooses a branch by value. | | [`if`](/docs/liquid/tags/if) | Renders a block when a condition is true. | | [`unless`](/docs/liquid/tags/unless) | Renders a block when a condition is false. | ## Iteration | Name | Summary | | --- | --- | | [`break`](/docs/liquid/tags/break) | Stops a for loop. | | [`continue`](/docs/liquid/tags/continue) | Skips to the next iteration of a for loop. | | [`cycle`](/docs/liquid/tags/cycle) | Outputs the next of a list of strings on each call. | | [`for`](/docs/liquid/tags/for) | Repeats a block for each item. | | [`paginate`](/docs/liquid/tags/paginate) | Splits a list into pages. | | [`tablerow`](/docs/liquid/tags/tablerow) | Generates table rows and cells for each item. | ## Variables | Name | Summary | | --- | --- | | [`assign`](/docs/liquid/tags/assign) | Creates a variable. | | [`capture`](/docs/liquid/tags/capture) | Captures rendered content into a variable. | | [`decrement`](/docs/liquid/tags/decrement) | Subtracts one from a counter, then outputs it. | | [`increment`](/docs/liquid/tags/increment) | Outputs a counter, then adds one to it. | ## Utility | Name | Summary | | --- | --- | | [`comment`](/docs/liquid/tags/comment) | Text that isn't rendered. | | [`doc`](/docs/liquid/tags/doc) | Documents a snippet or block for the code editor; it isn't rendered. | | [`echo`](/docs/liquid/tags/echo) | Outputs an expression (useful inside liquid tags). | | [`liquid`](/docs/liquid/tags/liquid) | Several tags in one block, one per line, without delimiters. | | [`raw`](/docs/liquid/tags/raw) | Outputs Liquid code without running it. | ## HTML | Name | Summary | | --- | --- | | [`form`](/docs/liquid/tags/form) | Renders an HTML form for a storefront action. | | [`javascript`](/docs/liquid/tags/javascript) | JavaScript of a section or block, output once per page. | | [`style`](/docs/liquid/tags/style) | CSS that updates live in the visual editor. | | [`stylesheet`](/docs/liquid/tags/stylesheet) | CSS of a section or block, output once per page. | --- # assign URL: https://sooquna.com/docs/liquid/tags/assign > Creates a variable. Creates a variable. The value can be any expression, including filters. Variables live until the end of the file (snippets rendered with render get their own scope). ## Syntax ```liquid {% assign name = value %} ``` ## Parameters | Name | Type | Description | | --- | --- | --- | | `name` (required) | string | Variable name. | | `value` (required) | any | Value or expression. | ## Example ```liquid title="Liquid" {% assign greeting = 'Marhaba' | append: ', Noora' %}{{ greeting }} ``` ```html title="Output" Marhaba, Noora ``` ## Related - [`capture`](/docs/liquid/tags/capture) - [`increment`](/docs/liquid/tags/increment) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # break URL: https://sooquna.com/docs/liquid/tags/break > Stops a for loop. Stops a for loop. ## Syntax ```liquid {% break %} ``` ## Example ```liquid title="Liquid" {% for i in (1..10) %}{% if i > 3 %}{% break %}{% endif %}{{ i }}{% endfor %} ``` ```html title="Output" 123 ``` ## Related - [`for`](/docs/liquid/tags/for) - [`continue`](/docs/liquid/tags/continue) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # capture URL: https://sooquna.com/docs/liquid/tags/capture > Captures rendered content into a variable. Captures rendered content into a variable. ## Syntax ```liquid {% capture name %}…{% endcapture %} ``` ## Parameters | Name | Type | Description | | --- | --- | --- | | `name` (required) | string | Variable that receives the text. | ## Example ```liquid title="Liquid" {% capture label %}{{ product.title }} · {{ product.vendor }}{% endcapture %}{{ label | upcase }} ``` ```html title="Output" EMBROIDERED LINEN ABAYA · LAYLA ``` ## Related - [`assign`](/docs/liquid/tags/assign) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # case URL: https://sooquna.com/docs/liquid/tags/case > Chooses a branch by value. Chooses a branch by value. ## Syntax ```liquid {% case value %}{% when a, b %}…{% else %}…{% endcase %} ``` ## Example ```liquid title="Liquid" {% case product.type %}{% when 'Abayas', 'Kaftans' %}Modest wear{% when 'Fragrance' %}Oud and perfume{% else %}Other{% endcase %} ``` ```html title="Output" Modest wear ``` ## Related - [`if`](/docs/liquid/tags/if) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # comment URL: https://sooquna.com/docs/liquid/tags/comment > Text that isn't rendered. Text that isn't rendered. {% # text %} is a one-tag comment; inside {% liquid %}, lines starting with # are comments. ## Syntax ```liquid {% comment %}…{% endcomment %} · {% # note %} ``` ## Examples ```liquid title="Liquid" Shown{% comment %} Not shown {{ product.title }}{% endcomment %} ``` ```html title="Output" Shown ``` ### Inline comment ```liquid title="Liquid" Shown{% # not shown %}{%- liquid # a comment line echo ' too' -%} ``` ```html title="Output" Shown too ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # content_for URL: https://sooquna.com/docs/liquid/tags/content_for > Renders theme blocks. Renders theme blocks. 'blocks' renders the current section's (or block's) theme blocks in their saved order. 'block' renders one static block with a fixed type and id. closest.product: value hands an object to every block below. ## Syntax ```liquid {% content_for 'blocks' %} · {% content_for 'block', type: 'price', id: 'main-price' %} ``` ## Parameters | Name | Type | Description | | --- | --- | --- | | `'blocks' \| 'block'` (required) | string | All theme blocks | | `type` | string | Block file in blocks/ (static block). | | `id` | string | Stable id of the static block. | ## Related - [`section`](/docs/liquid/tags/section) - [`render`](/docs/liquid/tags/render) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # continue URL: https://sooquna.com/docs/liquid/tags/continue > Skips to the next iteration of a for loop. Skips to the next iteration of a for loop. ## Syntax ```liquid {% continue %} ``` ## Example ```liquid title="Liquid" {% for i in (1..5) %}{% if i == 3 %}{% continue %}{% endif %}{{ i }}{% endfor %} ``` ```html title="Output" 1245 ``` ## Related - [`for`](/docs/liquid/tags/for) - [`break`](/docs/liquid/tags/break) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # cycle URL: https://sooquna.com/docs/liquid/tags/cycle > Outputs the next of a list of strings on each call. Outputs the next of a list of strings on each call. ## Syntax ```liquid {% cycle 'odd', 'even' %} ``` ## Example ```liquid title="Liquid" {% for i in (1..4) %}{% cycle 'odd', 'even' %} {% endfor %} ``` ```html title="Output" odd even odd even ``` ## Related - [`for`](/docs/liquid/tags/for) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # decrement URL: https://sooquna.com/docs/liquid/tags/decrement > Subtracts one from a counter, then outputs it. Subtracts one from a counter, then outputs it. ## Syntax ```liquid {% decrement name %} ``` ## Example ```liquid title="Liquid" {% decrement stock %} {% decrement stock %} ``` ```html title="Output" -1 -2 ``` ## Related - [`increment`](/docs/liquid/tags/increment) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # doc URL: https://sooquna.com/docs/liquid/tags/doc > Documents a snippet or block for the code editor; it isn't rendered. Documents a snippet or block for the code editor; it isn't rendered. ## Syntax ```liquid {% doc %}@param {product} product - The product to show{% enddoc %} ``` ## Example ```liquid title="Liquid" Card{% doc %}@param {string} title{% enddoc %} ``` ```html title="Output" Card ``` ## Compatibility :::caution[Differs from Shopify] Accepted and removed; the editor doesn't read @param types yet. ::: Since theme platform 1.0. --- # echo URL: https://sooquna.com/docs/liquid/tags/echo > Outputs an expression (useful inside liquid tags). Outputs an expression (useful inside liquid tags). ## Syntax ```liquid {% echo value %} ``` ## Example ```liquid title="Liquid" {% echo product.title | upcase %} ``` ```html title="Output" EMBROIDERED LINEN ABAYA ``` ## Related - [`liquid`](/docs/liquid/tags/liquid) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # for URL: https://sooquna.com/docs/liquid/tags/for > Repeats a block for each item. Repeats a block for each item. Inside the loop, forloop gives the position. limit and offset take part of the array, reversed walks it backwards, and else renders when the array is empty. Loops stop after 10,000 iterations per render. ## Syntax ```liquid {% for item in array limit: 4 offset: 0 reversed %}…{% else %}…{% endfor %} ``` ## Parameters | Name | Type | Description | | --- | --- | --- | | `limit` | number | Most items to loop over. | | `offset` | number | Items to skip first. | | `reversed` | flag | Loop from the end. | ## Examples ```liquid title="Liquid" {% for variant in product.variants %}{{ forloop.index }}. {{ variant.title }}{% unless forloop.last %}, {% endunless %}{% endfor %} ``` ```html title="Output" 1. S / Sand, 2. M / Sand, 3. L / Sand ``` ### Ranges and else ```liquid title="Liquid" {% for i in (1..3) %}{{ i }}{% endfor %} {% for item in cart.discounts %}{{ item }}{% else %}No discounts{% endfor %} ``` ```html title="Output" 123 ``` ## Related - [`break`](/docs/liquid/tags/break) - [`continue`](/docs/liquid/tags/continue) - [`cycle`](/docs/liquid/tags/cycle) - [`tablerow`](/docs/liquid/tags/tablerow) - [`paginate`](/docs/liquid/tags/paginate) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # form URL: https://sooquna.com/docs/liquid/tags/form > Renders an HTML form for a storefront action. Renders an HTML form for a storefront action. Outputs <form> with the right action and hidden fields. Supported types: product, cart, contact, customer, newsletter, customer_login, create_customer, recover_customer_password, reset_customer_password, activate_customer_password, customer_address, guest_login, localization, storefront_password, currency, new_comment. Inside, form gives errors and posted_successfully?. Other parameters become attributes; return_to sets where to go after. ## Syntax ```liquid {% form 'product', product, class: 'product-form' %}…{% endform %} ``` ## Parameters | Name | Type | Description | | --- | --- | --- | | `type` (required) | string | Form type. | | `object` | object | The product (product form), article (new_comment) or address. | | `return_to` | string | Path to redirect to after a successful post. | ## Example ```liquid title="Liquid" {% form 'contact', class: 'contact' %}{% endform %} ``` ```html title="Output" ``` ## Related - [`form`](/docs/liquid/tags/form) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # if URL: https://sooquna.com/docs/liquid/tags/if > Renders a block when a condition is true. Renders a block when a condition is true. Combine conditions with and / or (evaluated right to left, no parentheses). Compare with ==, !=, >, <, >=, <= and contains. Only false and nil are falsy; empty strings and 0 are truthy, so test for emptiness with blank or empty. ## Syntax ```liquid {% if condition %}…{% elsif other %}…{% else %}…{% endif %} ``` ## Examples ```liquid title="Liquid" {% if product.available %}In stock{% else %}Sold out{% endif %} ``` ```html title="Output" In stock ``` ### Testing for empty values ```liquid title="Liquid" {% if product.description != blank %}Has a description{% endif %}{% if cart.items == empty %} · empty cart{% else %} · {{ cart.item_count }} items{% endif %} ``` ```html title="Output" Has a description · 3 items ``` ## Related - [`unless`](/docs/liquid/tags/unless) - [`case`](/docs/liquid/tags/case) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # increment URL: https://sooquna.com/docs/liquid/tags/increment > Outputs a counter, then adds one to it. Outputs a counter, then adds one to it. Counters are separate from variables made with assign and start at 0. ## Syntax ```liquid {% increment name %} ``` ## Example ```liquid title="Liquid" {% increment cards %}{% increment cards %}{% increment cards %} ``` ```html title="Output" 012 ``` ## Related - [`decrement`](/docs/liquid/tags/decrement) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # javascript URL: https://sooquna.com/docs/liquid/tags/javascript > JavaScript of a section or block, output once per page. JavaScript of a section or block, output once per page. ## Syntax ```liquid {% javascript %}…{% endjavascript %} ``` ## Related - [`stylesheet`](/docs/liquid/tags/stylesheet) ## Compatibility :::caution[Differs from Shopify] Output inline once per page rather than bundled into one file. ::: Since theme platform 1.0. --- # layout URL: https://sooquna.com/docs/liquid/tags/layout > Picks the layout of a template. Picks the layout of a template. Layouts are files in layout/; theme.liquid is the default. none renders the template without a layout. ## Syntax ```liquid {% layout 'alternate' %} · {% layout none %} ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # liquid URL: https://sooquna.com/docs/liquid/tags/liquid > Several tags in one block, one per line, without delimiters. Several tags in one block, one per line, without delimiters. Use echo to output inside it. ## Syntax ```liquid {% liquid … %} ``` ## Example ```liquid title="Liquid" {%- liquid assign count = product.variants | size if count > 1 echo count | append: ' options' else echo 'One option' endif -%} ``` ```html title="Output" 3 options ``` ## Related - [`echo`](/docs/liquid/tags/echo) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # paginate URL: https://sooquna.com/docs/liquid/tags/paginate > Splits a list into pages. Splits a list into pages. Works on paginated lists (collection.products, blog.articles, search.results, collections, customer.orders). Page size 1 to 250; the page comes from ?page=. Inside, paginate has the page links; pass it to default_pagination for ready-made links. ## Syntax ```liquid {% paginate collection.products by 24 %}…{% endpaginate %} ``` ## Parameters | Name | Type | Description | | --- | --- | --- | | `list` (required) | array | A paginated list. | | `by` (required) | number | Items per page (1 to 250). | ## Related - [`default_pagination`](/docs/liquid/filters/default_pagination) - [`paginate`](/docs/liquid/tags/paginate) ## Compatibility :::caution[Differs from Shopify] window_size is accepted and ignored. ::: Since theme platform 1.0. --- # raw URL: https://sooquna.com/docs/liquid/tags/raw > Outputs Liquid code without running it. Outputs Liquid code without running it. ## Syntax ```liquid {% raw %}…{% endraw %} ``` ## Example ```liquid title="Liquid" {% raw %}{{ product.title }}{% endraw %} ``` ```html title="Output" {{ product.title }} ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # render URL: https://sooquna.com/docs/liquid/tags/render > Renders a snippet in its own scope. Renders a snippet in its own scope. The snippet sees global objects and the parameters you pass, not the caller's variables. "with x as name" passes one value; "for list as item" renders once per item, with forloop. Errors in a snippet show a marker in the theme editor and are hidden from shoppers. ## Syntax ```liquid {% render 'snippet', key: value %} · {% render 'card' with product as item %} · {% render 'card' for products as item %} ``` ## Parameters | Name | Type | Description | | --- | --- | --- | | `snippet` (required) | string | File name in snippets/, without .liquid. | | `key: value` | any | Variables the snippet receives. | ## Example ```liquid title="snippets/badge.liquid" {{ label }} ``` ```liquid title="Liquid" {% render 'badge', label: 'New' %}{% render 'badge' for product.tags as label %} ``` ```html title="Output" Newlinennewsummer ``` ## Related - [`section`](/docs/liquid/tags/section) ## Compatibility :::caution[Differs from Shopify] As in Shopify. The older include tag isn't supported: use render. ::: Since theme platform 1.0. --- # schema URL: https://sooquna.com/docs/liquid/tags/schema > A section's or block's settings, blocks and presets (JSON). A section's or block's settings, blocks and presets (JSON). Never rendered. The visual editor builds its forms from it. See the section schema guide. ## Syntax ```liquid {% schema %}{ "name": "Hero", "settings": […] }{% endschema %} ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # section URL: https://sooquna.com/docs/liquid/tags/section > Renders a section statically. Renders a section statically. Its settings come from the section's schema defaults or the theme's settings_data. Use it in layouts and custom pages; templates list their sections in JSON instead. ## Syntax ```liquid {% section 'name' %} ``` ## Example ```liquid title="sections/promo.liquid" {% schema %}{"name":"Promo","settings":[{"type":"text","id":"text","label":"Text","default":"Eid sale: 20% off"}]}{% endschema %} ``` ```liquid title="Liquid" {% section 'promo' %} ``` ```html title="Output" ``` ## Related - [`sections`](/docs/liquid/tags/sections) - [`render`](/docs/liquid/tags/render) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # sections URL: https://sooquna.com/docs/liquid/tags/sections > Renders a section group, such as the header or footer. Renders a section group, such as the header or footer. Groups are JSON files in sections/ (header-group.json). Merchants add and reorder their sections in the visual editor. ## Syntax ```liquid {% sections 'header-group' %} ``` ## Related - [`section`](/docs/liquid/tags/section) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # style URL: https://sooquna.com/docs/liquid/tags/style > CSS that updates live in the visual editor. CSS that updates live in the visual editor. Wraps the content in a <style> tag. Settings used inside update as the merchant edits. ## Syntax ```liquid {% style %}…{% endstyle %} ``` ## Example ```liquid title="Liquid" {% style %}.price { color: {{ '#8A1538' }}; }{% endstyle %} ``` ```html title="Output" ``` ## Related - [`stylesheet`](/docs/liquid/tags/stylesheet) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # stylesheet URL: https://sooquna.com/docs/liquid/tags/stylesheet > CSS of a section or block, output once per page. CSS of a section or block, output once per page. However many times the section renders, its stylesheet appears once. Liquid isn't processed inside. ## Syntax ```liquid {% stylesheet %}…{% endstylesheet %} ``` ## Related - [`javascript`](/docs/liquid/tags/javascript) - [`style`](/docs/liquid/tags/style) ## Compatibility :::caution[Differs from Shopify] Output inline once per page rather than bundled into one file. ::: Since theme platform 1.0. --- # tablerow URL: https://sooquna.com/docs/liquid/tags/tablerow > Generates table rows and cells for each item. Generates table rows and cells for each item. Outputs <tr> and <td> elements; cols sets the cells per row. Wrap it in a <table>. ## Syntax ```liquid {% tablerow item in array cols: 3 %}…{% endtablerow %} ``` ## Parameters | Name | Type | Description | | --- | --- | --- | | `cols` | number | Cells per row. | | `limit` | number | Most items. | | `offset` | number | Items to skip. | ## Example ```liquid title="Liquid" {% tablerow i in (1..4) cols: 2 %}{{ i }}{% endtablerow %}

``` ```html title="Output"

1	2
3	4

``` ## Related - [`for`](/docs/liquid/tags/for) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # unless URL: https://sooquna.com/docs/liquid/tags/unless > Renders a block when a condition is false. Renders a block when a condition is false. ## Syntax ```liquid {% unless condition %}…{% endunless %} ``` ## Example ```liquid title="Liquid" {% unless product.tags contains 'final-sale' %}Free returns{% endunless %} ``` ```html title="Output" Free returns ``` ## Related - [`if`](/docs/liquid/tags/if) ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # Porting a Shopify theme URL: https://sooquna.com/docs/migrating > A checklist for bringing an Online Store 2.0 theme to Sooquna. Sooquna follows Shopify's theme structure, so most of an Online Store 2.0 theme (Dawn and the themes built on it) works after a few changes. Work through this list, then use the [compatibility matrix](/docs/migrating/compatibility) for anything else your theme uses. ## Checklist 1. **Upload the theme** in **Storefront › Themes** as a `.zip`. Fix the errors the [theme check](/docs/best-practices/theme-check) reports; most are invalid JSON or unknown setting types. 2. **Replace `include` with `render`**, and pass the variables each snippet uses. `include` isn't supported. 3. **Review escaping.** Output is [escaped by default](/docs/liquid/autoescape). Search for filters applied to rich text (`product.description | truncatewords`, `| replace`) and for markup built with `append`, and fix them as the page explains. 4. **Split mixed `and`/`or` conditions.** Sooquna checks them left to right. 5. **Fonts.** `font_picker` and `font_face` do nothing: self-host the theme's fonts in `assets/` ([Fonts](/docs/settings/fonts)). 6. **Colour settings** give hex strings: replace `settings.color.red` and similar with the [`color_*` filters](/docs/liquid/filters#color). 7. **Remove customer templates.** `templates/customers/*` aren't used; account pages are drawn by Sooquna. Keep links to `routes.account_*_url`. 8. **Remove app blocks** (`@app`) and app embeds; use Sooquna's built-in [store features](/docs/storefront/store-features) instead (wishlist, reviews, back in stock…). 9. **Add Arabic.** Add `locales/ar.json`, set `dir` on ``, and switch physical CSS to logical properties ([RTL guide](/docs/best-practices/rtl-arabic)). 10. **Check every template in the preview**, in both languages, at phone width. Liquid errors show in place. ## What usually works unchanged JSON templates, sections and section groups, theme blocks and `content_for`, schemas and presets, `render`, `paginate`, `form`, `section`, `t` with plurals, money filters, `image_url` and `image_tag`, the cart AJAX API, the section rendering API, predictive search, product recommendations, collection filters with the same URL parameters, and `window.Shopify` (an alias of `window.Sooquna`). Next: [Differences](/docs/migrating/differences), and a worked example: [porting a Dawn section](/docs/migrating/porting-a-dawn-section). --- # Compatibility matrix URL: https://sooquna.com/docs/migrating/compatibility > What works as in Shopify, what differs, and what Sooquna adds. Generated from the Liquid reference. What works as in Shopify, what differs, and what Sooquna adds. Generated from the Liquid reference. Everything not listed below works the same as in Shopify Liquid. Shopify features that don't exist at all (for example `include`, app blocks and selling plans) are covered in [Differences](/docs/migrating/differences). | | Total | Same | Differs | Accepted, does nothing | Sooquna only | | --- | --- | --- | --- | --- | --- | | Tags | 28 | 23 | 5 | 0 | 0 | | Filters | 106 | 82 | 18 | 3 | 3 | | Objects | 61 | 40 | 14 | 0 | 7 | | Setting types | 34 | 21 | 11 | 1 | 1 | ## Tags | Name | Status | Difference | | --- | --- | --- | | [`doc`](/docs/liquid/tags/doc) | Differs from Shopify | Accepted and removed; the editor doesn't read @param types yet. | | [`javascript`](/docs/liquid/tags/javascript) | Differs from Shopify | Output inline once per page rather than bundled into one file. | | [`paginate`](/docs/liquid/tags/paginate) | Differs from Shopify | window_size is accepted and ignored. | | [`render`](/docs/liquid/tags/render) | Differs from Shopify | As in Shopify. The older include tag isn't supported: use render. | | [`stylesheet`](/docs/liquid/tags/stylesheet) | Differs from Shopify | Output inline once per page rather than bundled into one file. | ## Filters | Name | Status | Difference | | --- | --- | --- | | [`asset_img_url`](/docs/liquid/filters/asset_img_url) | Differs from Shopify | The size argument is ignored: the file's URL is returned. Use image_url with images from settings to resize. | | [`date`](/docs/liquid/filters/date) | Differs from Shopify | Adds Arabic month names and the Hijri calendar. | | [`escape`](/docs/liquid/filters/escape) | Differs from Shopify | Sooquna escapes all output automatically, so escape is optional; it never escapes twice. | | [`file_img_url`](/docs/liquid/filters/file_img_url) | Differs from Shopify | Size argument ignored. | | [`file_url`](/docs/liquid/filters/file_url) | Differs from Shopify | Resolves files in assets/; for merchant uploads use an image_picker or url setting. | | [`font_face`](/docs/liquid/filters/font_face) | Accepted, does nothing | Sooquna has no hosted font library yet: outputs nothing so ported themes still render. | | [`font_modify`](/docs/liquid/filters/font_modify) | Accepted, does nothing | Returns the font unchanged. | | [`font_url`](/docs/liquid/filters/font_url) | Accepted, does nothing | Returns an empty string. | | [`global_asset_url`](/docs/liquid/filters/global_asset_url) | Differs from Shopify | Resolves to the theme's assets/ folder: ship the file with your theme. | | [`handle`](/docs/liquid/filters/handle) | Differs from Shopify | Keeps Arabic and other non-Latin letters instead of dropping them. | | [`handleize`](/docs/liquid/filters/handleize) | Differs from Shopify | Keeps Arabic and other non-Latin letters. | | [`image_url`](/docs/liquid/filters/image_url) | Differs from Shopify | Always WebP; format and pad_color aren't supported. | | [`img_tag`](/docs/liquid/filters/img_tag) | Differs from Shopify | Takes alt only; use image_tag for srcset and sizes. | | [`inspect`](/docs/liquid/filters/inspect) | Sooquna only | Not in Shopify Liquid. Use while developing; output isn't stable. | | [`money`](/docs/liquid/filters/money) | Differs from Shopify | Shows the currency code before the amount (QAR 15.00); the format isn't editable per store. | | [`money_with_currency`](/docs/liquid/filters/money_with_currency) | Differs from Shopify | Same output as money: the code is always shown. | | [`payment_type_svg_tag`](/docs/liquid/filters/payment_type_svg_tag) | Differs from Shopify | Draws a labelled badge rather than brand artwork. | | [`placeholder_svg_tag`](/docs/liquid/filters/placeholder_svg_tag) | Differs from Shopify | One neutral illustration whatever the name; it takes the text color. | | [`safe`](/docs/liquid/filters/safe) | Sooquna only | Not a Shopify filter; it doesn't disable escaping. | | [`script_tag`](/docs/liquid/filters/script_tag) | Differs from Shopify | Adds defer, so scripts never block rendering. | | [`shopify_asset_url`](/docs/liquid/filters/shopify_asset_url) | Differs from Shopify | Resolves to the theme's assets/ folder. | | [`t`](/docs/liquid/filters/t) | Differs from Shopify | Adds CLDR plural forms beyond one/other, which Arabic needs. | | [`type`](/docs/liquid/filters/type) | Sooquna only | Not in Shopify Liquid. | | [`weight_with_unit`](/docs/liquid/filters/weight_with_unit) | Differs from Shopify | Takes the unit as an argument instead of the store's setting. | ## Objects | Name | Status | Difference | | --- | --- | --- | | [`all_products`](/docs/liquid/objects/all_products) | Differs from Shopify | Lookup only: it can't be looped. | | [`cart`](/docs/liquid/objects/cart) | Differs from Shopify | Adds free_shipping_threshold for progress bars. | | [`closest`](/docs/liquid/objects/closest) | Differs from Shopify | Set explicitly with content_for 'blocks', closest.<name>: …; Shopify also infers it from the template. | | [`custom_page`](/docs/liquid/objects/custom_page) | Sooquna only | Sooquna only; see the custom page tutorial. | | [`customer`](/docs/liquid/objects/customer) | Differs from Shopify | No orders, addresses or tags: customer account pages are drawn by Sooquna, not by templates/customers. | | [`features`](/docs/liquid/objects/features) | Sooquna only | Sooquna's built-in storefront features; Shopify uses apps. | | [`forloop`](/docs/liquid/objects/forloop) | Differs from Shopify | forloop.parentloop isn't available. | | [`form_error`](/docs/liquid/objects/form_error) | Sooquna only | Shopify uses form.errors. | | [`line_item`](/docs/liquid/objects/line_item) | Differs from Shopify | product and variant carry a few fields only; look up all_products[item.product.handle] for more. | | [`localization`](/docs/liquid/objects/localization) | Differs from Shopify | One country, the store's: prices are in its currency. | | [`policy`](/docs/liquid/objects/policy) | Differs from Shopify | kind is Sooquna's. | | [`powered_by_link`](/docs/liquid/objects/powered_by_link) | Differs from Shopify | Links to Sooquna. | | [`product`](/docs/liquid/objects/product) | Differs from Shopify | Adds rating, reviews and bestseller; selling plans are empty. | | [`recently_viewed`](/docs/liquid/objects/recently_viewed) | Sooquna only | Sooquna only. | | [`request`](/docs/liquid/objects/request) | Differs from Shopify | request.locale.direction is Sooquna's: use it for dir= on RTL languages. | | [`review`](/docs/liquid/objects/review) | Sooquna only | Sooquna's built-in reviews. | | [`reviews`](/docs/liquid/objects/reviews) | Sooquna only | Sooquna's built-in reviews. | | [`robots`](/docs/liquid/objects/robots) | Differs from Shopify | default is the rules as text, not groups. | | [`shop`](/docs/liquid/objects/shop) | Differs from Shopify | products_count, collections_count, types and vendors aren't available; use collections['all']. | | [`variant`](/docs/liquid/objects/variant) | Differs from Shopify | inventory_quantity isn't exposed; use available. | | [`wishlist`](/docs/liquid/objects/wishlist) | Sooquna only | Sooquna's built-in wishlist. | ## Setting types | Name | Status | Difference | | --- | --- | --- | | [`article`](/docs/settings/input-settings/article) | Differs from Shopify | Returns the ID, not the article object. | | [`blog`](/docs/settings/input-settings/blog) | Differs from Shopify | Returns the ID, not the blog object. | | [`color`](/docs/settings/input-settings/color) | Differs from Shopify | The value is the hex string, not a color object (.red, .rgb aren't available); use the color_* filters. | | [`color_scheme`](/docs/settings/input-settings/color_scheme) | Differs from Shopify | The value is the scheme ID, not the scheme object. | | [`custom_page`](/docs/settings/input-settings/custom_page) | Sooquna only | Sooquna only. | | [`font_picker`](/docs/settings/input-settings/font_picker) | Accepted, does nothing | Accepted so ported themes load; font_face outputs nothing. | | [`html`](/docs/settings/input-settings/html) | Differs from Shopify | Scripts are removed. | | [`liquid`](/docs/settings/input-settings/liquid) | Differs from Shopify | The value isn't rendered as Liquid: merchant code doesn't run on the storefront. Use html for markup. | | [`metaobject`](/docs/settings/input-settings/metaobject) | Differs from Shopify | Returns the ID, not the entry. | | [`metaobject_list`](/docs/settings/input-settings/metaobject_list) | Differs from Shopify | Returns IDs, not entries. | | [`page`](/docs/settings/input-settings/page) | Differs from Shopify | Returns the ID, not the page object. | | [`video`](/docs/settings/input-settings/video) | Differs from Shopify | Returns the reference, not a video object. | | [`video_url`](/docs/settings/input-settings/video_url) | Differs from Shopify | The value is the URL, not an object with .id and .type. | --- # Differences from Shopify URL: https://sooquna.com/docs/migrating/differences > Everything that works differently, or not at all, compared with Shopify themes. The [compatibility matrix](/docs/migrating/compatibility) lists every tag, filter, object and setting type that differs. This page covers the bigger differences. ## Liquid | Shopify | Sooquna | | --- | --- | | Output is printed as is | Output is [escaped](/docs/liquid/autoescape); trusted HTML (rich text, filter-built tags) isn't. | | `{% include %}` (deprecated) | Not supported: use `render`. | | `and`/`or` checked right to left | Checked left to right: don't mix them. | | `forloop.parentloop` | Not available. | | `{{ x \| raw }}` in some contexts | No `raw` filter; `safe` can't print untrusted HTML. | ## Theme structure | Shopify | Sooquna | | --- | --- | | Customer templates (`templates/customers/*`) | Not used: account pages are drawn by Sooquna in the store's checkout colours. | | `templates/gift_card.liquid` | Not used: gift cards are checked at `/gift_cards/check`, drawn by Sooquna. | | App blocks and app embeds | Not available. Built-in [store features](/docs/storefront/store-features) cover wishlist, reviews, back in stock and more, with `capability` to show their sections. | | — | [Custom pages](/docs/architecture/custom-pages) (`custom_pages/`) and the [`features`](/docs/liquid/objects/features) object are Sooquna additions. | | Liquid assets (`theme.css.liquid`) are rendered | Assets are served as they are: use `{% style %}` for CSS that needs settings. | ## Settings and data | Shopify | Sooquna | | --- | --- | | Hosted font library (`font_picker`, `font_face`) | Not yet: self-host fonts. | | Connecting settings to metafields (dynamic sources) | Not yet: read metafields in Liquid. | | `color` settings are colour objects | Hex strings; use the `color_*` filters. | | `article`, `blog`, `page`, `metaobject` settings give objects | They give IDs. `product`, `collection`, `image_picker`, `link_list` and `custom_page` give objects. | | `liquid` settings render merchant Liquid | The text isn't rendered. | | Selling plans (subscriptions) | Not available (always empty). | | Markets: many countries and currencies | One country and currency per store; many languages. | ## Formatting - `money` shows the currency code: `QAR 15.00` (and `15.00 ر.ق` on Arabic pages). The format isn't editable per store. - `date` adds Arabic month names and `calendar: 'hijri'`. - `image_url` always gives WebP; `format` and `pad_color` are ignored. - `t` supports all CLDR plural forms, which Arabic needs. ## Customers - `customer` has name, email and order count; orders and addresses are on the account pages. - Sign-in, sign-up and password forms work only on the account pages. ## Checkout The checkout isn't part of the theme. Merchants brand it (logo, colours, fonts) in **Settings › Checkout**. --- # Example: port a Dawn section URL: https://sooquna.com/docs/migrating/porting-a-dawn-section > Porting Dawn's rich-text section, step by step, with the changes Sooquna needs. This walks through a section in the style of Dawn's `rich-text.liquid`. Most of it works unchanged; four things need attention. ## The original (abridged) ```liquid title="sections/rich-text.liquid (Shopify)" {{ 'section-rich-text.css' | asset_url | stylesheet_tag }}

{%- for block in section.blocks -%} {%- case block.type -%} {%- when 'heading' -%}

{%- when 'text' -%}

{%- when 'button' -%} {{ block.settings.button_label | escape }} {%- endcase -%} {%- endfor -%}

{% schema %} { "name": "t:sections.rich-text.name", "class": "section", "settings": [ { "type": "color_scheme", "id": "color_scheme", "label": "t:sections.all.colors.label", "default": "scheme-1" }, { "type": "select", "id": "desktop_content_position", "options": [ { "value": "left", "label": "t:sections.rich-text.settings.desktop_content_position.options__1.label" }, { "value": "center", "label": "t:sections.rich-text.settings.desktop_content_position.options__2.label" }, { "value": "right", "label": "t:sections.rich-text.settings.desktop_content_position.options__3.label" } ], "default": "center", "label": "t:sections.rich-text.settings.desktop_content_position.label" } ], "blocks": [ … ], "presets": [{ "name": "t:sections.rich-text.presets.name", "blocks": [{ "type": "heading" }, { "type": "text" }, { "type": "button" }] }] } {% endschema %} ``` ## What works unchanged The loop over `section.blocks`, `block.shopify_attributes`, `case`/`when`, `asset_url | stylesheet_tag`, rich text output, `blank` checks, `t:` labels and presets. ## 1. Colour schemes Dawn's `color_scheme` setting reads scheme objects from `settings.color_schemes`. In Sooquna the setting gives the scheme's ID, so the class works as written (`color-scheme-1`) **if** your CSS defines those classes. Dawn generates them in `layout/theme.liquid` from the scheme objects; replace that loop with CSS built from your own colour settings, as in [Color schemes](/docs/settings/color-schemes). ## 2. `left` and `right` positions `desktop_content_position` uses `left` and `right`. On Arabic pages, "left" should mean the start side. Keep the values (merchants' saved data uses them) and map them to logical CSS: ```css .rich-text__wrapper--left { justify-content: flex-start; } .rich-text__wrapper--right { justify-content: flex-end; } ``` `flex-start` is the right edge in a right-to-left page, so content lines up where Arabic readers expect. ## 3. Escaping `{{ block.settings.heading | escape }}` still works and escapes once. You can drop `| escape`: Sooquna escapes output anyway. ## 4. Translations Copy the section's keys from Dawn's `locales/en.default.schema.json` and add Arabic ones to `locales/ar.schema.json`, so merchants see the editor in their language. Storefront strings (none in this section) go to `locales/ar.json`. ## Result The section renders in both directions, merchants arrange its blocks in the visual editor, and the schema is unchanged, so saved templates keep working. --- # Color schemes URL: https://sooquna.com/docs/settings/color-schemes > Sets of colours merchants apply to sections, the way Sahil does it. A color scheme is a named set of colours (background, text, accent) that merchants apply to a section with one choice. Sahil has three schemes plus a brand scheme. ## 1. Define the colours in theme settings ```json title="config/settings_schema.json (excerpt)" { "name": "Colors", "settings": [ { "type": "header", "content": "Scheme 1" }, { "type": "color", "id": "scheme_1_background", "label": "Background", "default": "#FBF8F3" }, { "type": "color", "id": "scheme_1_text", "label": "Text", "default": "#1C1917" }, { "type": "color", "id": "scheme_1_accent", "label": "Accent", "default": "#1C1917" }, { "type": "color", "id": "scheme_1_accent_text", "label": "Accent text", "default": "#FFFFFF" } ] } ``` ## 2. Turn each scheme into a CSS class In a snippet rendered in the layout's ``: ```liquid title="snippets/css-variables.liquid" {%- style -%} {%- for i in (1..3) %} {%- assign bg = 'scheme_' | append: i | append: '_background' -%} {%- assign fg = 'scheme_' | append: i | append: '_text' -%} .scheme-{{ i }} { --bg: {{ settings[bg] }}; --fg: {{ settings[fg] }}; --muted: color-mix(in srgb, var(--fg) 62%, var(--bg)); background: var(--bg); color: var(--fg); } {%- endfor %} {%- endstyle -%} ``` `settings[bg]` reads a setting whose ID you build. `{% style %}` updates in the editor as the merchant changes a colour. ## 3. Let sections pick a scheme ```json { "type": "select", "id": "color_scheme", "label": "Color scheme", "default": "1", "options": [{ "value": "1", "label": "Scheme 1" }, { "value": "2", "label": "Scheme 2" }, { "value": "3", "label": "Scheme 3" }] } ``` ```liquid

…

``` Use only the scheme's variables (`var(--bg)`, `var(--fg)`) inside sections, so every section looks right in every scheme. ## Check contrast Text must have a contrast of at least 4.5:1 with its background. The [`color_brightness`](/docs/liquid/filters/color_brightness) filter helps pick readable text automatically, and [`color_mix`](/docs/liquid/filters/color_mix) and [`color_modify`](/docs/liquid/filters/color_modify) derive tints from a scheme. ## The color_scheme setting types `color_scheme_group` and `color_scheme` are accepted so Shopify themes upload; `color_scheme` gives the scheme ID. The pattern above works without them and keeps the CSS in your hands. --- # Dynamic sources and metafields URL: https://sooquna.com/docs/settings/dynamic-sources > Read custom fields (metafields) in a theme, and the state of connecting settings to them. Merchants define custom fields in **Settings › Custom fields** and fill them in on each product, collection or page: a subtitle, a care guide, a "made in" country. Themes read them as metafields. ## Reading metafields ```liquid {%- assign subtitle = product.metafields.custom.subtitle -%} {%- if subtitle != blank -%}

{%- endif -%} ``` `resource.metafields..` is a [`metafield`](/docs/liquid/objects/metafield). It prints as its value; `.value` gives the typed value (a number, a list, a reference), and `.type` its type. Metafields are on `product`, `collection`, `page`, `article` and `shop`. ## Connecting settings (dynamic sources) In Shopify, a merchant can connect a text setting to a metafield in the editor. **Sooquna doesn't offer this yet.** Until it does, read the metafield in your section and fall back to the setting: ```liquid {{ product.metafields.custom.badge | default: block.settings.badge_text }} ``` This works the same for every product and keeps the merchant's text as the default. ## Metaobjects Entries of a custom content type (an author, a store location), managed in **Storefront › Custom content**, are metaobjects. They can have their own pages; see [Metaobject pages](/docs/storefront/metaobject-pages). A [`metaobject`](/docs/settings/input-settings/metaobject) setting lets a section pick one entry. --- # Fonts URL: https://sooquna.com/docs/settings/fonts > Self-hosting fonts in a theme, and choosing Arabic fonts that pair with Latin ones. Sooquna has no hosted font library yet: ship your fonts in `assets/` and declare them yourself. The `font_picker` setting and the `font_face`, `font_url` and `font_modify` filters are accepted so Shopify themes upload, but they output nothing. ## Self-host with @font-face ```liquid title="snippets/css-variables.liquid" {%- style -%} @font-face { font-family: "Geist"; src: url("{{ 'geist-latin-wght-normal.woff2' | asset_url }}") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F; } @font-face { font-family: "Plex Arabic"; src: url("{{ 'ibm-plex-sans-arabic-arabic-400-normal.woff2' | asset_url }}") format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+FB50-FDFF, U+FE70-FEFC; } :root { --font-body: "Geist", "Plex Arabic", system-ui, sans-serif; } {%- endstyle -%} ``` - **WOFF2 only**: every browser that matters supports it. - **`unicode-range`** splits Latin and Arabic: an English page never downloads the Arabic file, and the browser picks the right font per character, so mixed text works. - **`font-display: swap`** shows text at once in a fallback font. - **Preload** only the first-screen file of the page's script: Latin on English pages, Arabic on Arabic pages. ```liquid {%- if request.locale.direction == 'rtl' -%} {%- endif -%} ``` ## Letting merchants choose Offer a `select` of the fonts you ship, and switch a CSS variable: ```json { "type": "select", "id": "heading_font", "label": "Heading font", "default": "sans", "options": [{ "value": "sans", "label": "Sans" }, { "value": "serif", "label": "Serif" }] } ``` ## Arabic font guidance - Pick an Arabic family with weights that match your Latin font: IBM Plex Sans Arabic, Noto Sans Arabic, Tajawal, Cairo and Almarai all pair well with modern sans serifs. - Arabic needs more line height than Latin: 1.7–1.9 for body text. - Don't use `letter-spacing` on Arabic: it breaks the joins between letters. Reset it on `[dir="rtl"]`. - Don't fake bold or italic: ship the weights you use, and avoid italic for Arabic altogether. - Keep Arabic at the same or a slightly larger size than Latin; many Arabic fonts look small at the same `font-size`. See [RTL and Arabic typography](/docs/best-practices/rtl-arabic) for layout. --- # Input setting types URL: https://sooquna.com/docs/settings/input-settings > The setting types of settings_schema.json and section and block schemas, with the value Liquid receives. The setting types of settings_schema.json and section and block schemas, with the value Liquid receives. ## Basic | Type | Summary | | --- | --- | | [`checkbox`](/docs/settings/input-settings/checkbox) | An on/off switch. | | [`number`](/docs/settings/input-settings/number) | A number field. | | [`radio`](/docs/settings/input-settings/radio) | One choice among a few, shown as radio buttons. | | [`range`](/docs/settings/input-settings/range) | A slider between min and max, in steps. | | [`select`](/docs/settings/input-settings/select) | One choice from a dropdown. Options can be grouped with "group". | | [`text`](/docs/settings/input-settings/text) | A single line of text. | | [`textarea`](/docs/settings/input-settings/textarea) | Several lines of plain text. | ## Specialized | Type | Summary | | --- | --- | | [`article`](/docs/settings/input-settings/article) | Pick a blog post. | | [`blog`](/docs/settings/input-settings/blog) | Pick a blog. | | [`collection`](/docs/settings/input-settings/collection) | Pick a collection. | | [`collection_list`](/docs/settings/input-settings/collection_list) | Pick several collections. "limit" caps how many. | | [`color`](/docs/settings/input-settings/color) | A color picker. | | [`color_background`](/docs/settings/input-settings/color_background) | A CSS background (a color or gradient). | | [`color_scheme`](/docs/settings/input-settings/color_scheme) | Pick one of the theme's color schemes. | | [`color_scheme_group`](/docs/settings/input-settings/color_scheme_group) | The theme's color schemes (settings_schema.json only): named sets of colors. | | [`custom_page`](/docs/settings/input-settings/custom_page) | Pick one of the theme's custom pages (custom_pages/). | | [`font_picker`](/docs/settings/input-settings/font_picker) | Pick a font (compatibility). | | [`html`](/docs/settings/input-settings/html) | HTML the merchant writes. | | [`image_picker`](/docs/settings/input-settings/image_picker) | Pick or upload an image. | | [`inline_richtext`](/docs/settings/input-settings/inline_richtext) | Formatted text without paragraphs (bold, italic, links). | | [`link_list`](/docs/settings/input-settings/link_list) | Pick a navigation menu. | | [`liquid`](/docs/settings/input-settings/liquid) | Liquid the merchant writes (compatibility). | | [`metaobject`](/docs/settings/input-settings/metaobject) | Pick an entry of a metaobject type ("metaobject_type"). | | [`metaobject_list`](/docs/settings/input-settings/metaobject_list) | Pick several entries of a metaobject type. | | [`page`](/docs/settings/input-settings/page) | Pick a page. | | [`product`](/docs/settings/input-settings/product) | Pick a product. | | [`product_list`](/docs/settings/input-settings/product_list) | Pick several products. "limit" caps how many. | | [`richtext`](/docs/settings/input-settings/richtext) | Formatted text with paragraphs and lists. | | [`text_alignment`](/docs/settings/input-settings/text_alignment) | Left, center or right alignment. | | [`url`](/docs/settings/input-settings/url) | A link to a page of the store or another site. | | [`video`](/docs/settings/input-settings/video) | Pick an uploaded video. | | [`video_url`](/docs/settings/input-settings/video_url) | A YouTube or Vimeo link ("accept" lists which). | ## Sidebar | Type | Summary | | --- | --- | | [`header`](/docs/settings/input-settings/header) | A heading that groups the settings after it. | | [`paragraph`](/docs/settings/input-settings/paragraph) | Help text in the settings panel. | --- # article URL: https://sooquna.com/docs/settings/input-settings/article > Pick a blog post. Pick a blog post. ## Schema ```json { "type": "article", "id": "featured_article", "label": "Article" } ``` ## Value in Liquid The article's ID as a string; nil when none. ## Compatibility :::caution[Differs from Shopify] Returns the ID, not the article object. ::: Since theme platform 1.0. --- # blog URL: https://sooquna.com/docs/settings/input-settings/blog > Pick a blog. Pick a blog. ## Schema ```json { "type": "blog", "id": "blog", "label": "Blog" } ``` ## Value in Liquid The blog's ID as a string. Read blogs[handle] for its articles. ## Compatibility :::caution[Differs from Shopify] Returns the ID, not the blog object. ::: Since theme platform 1.0. --- # checkbox URL: https://sooquna.com/docs/settings/input-settings/checkbox > An on/off switch. An on/off switch. ## Schema ```json { "type": "checkbox", "id": "show_vendor", "label": "Show vendor", "default": false } ``` ## Value in Liquid true or false. ## Usage ```liquid {% if section.settings.show_vendor %}{{ product.vendor }}{% endif %} ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # collection URL: https://sooquna.com/docs/settings/input-settings/collection > Pick a collection. Pick a collection. ## Schema ```json { "type": "collection", "id": "collection", "label": "Collection" } ``` ## Value in Liquid The collection object; nil when none. ## Usage ```liquid {% assign c = section.settings.collection | default: collections.all %}{{ c.title }} ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # collection_list URL: https://sooquna.com/docs/settings/input-settings/collection_list > Pick several collections. "limit" caps how many. Pick several collections. "limit" caps how many. ## Schema ```json { "type": "collection_list", "id": "collections", "label": "Collections", "limit": 8 } ``` ## Value in Liquid An array of collections (empty when none). ## Usage ```liquid {% for c in section.settings.collections %}{{ c.title }}{% endfor %} ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # color URL: https://sooquna.com/docs/settings/input-settings/color > A color picker. A color picker. ## Schema ```json { "type": "color", "id": "brand_color", "label": "Brand color", "default": "#8A1538" } ``` ## Value in Liquid A hex string ("#8A1538"). Works with the color_* filters. ## Usage ```liquid --brand: {{ settings.brand_color }}; --brand-soft: {{ settings.brand_color | color_modify: 'alpha', 0.12 }}; ``` ## Compatibility :::caution[Differs from Shopify] The value is the hex string, not a color object (.red, .rgb aren't available); use the color_* filters. ::: Since theme platform 1.0. --- # color_background URL: https://sooquna.com/docs/settings/input-settings/color_background > A CSS background (a color or gradient). A CSS background (a color or gradient). ## Schema ```json { "type": "color_background", "id": "gradient", "label": "Background" } ``` ## Value in Liquid A CSS background string. ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # color_scheme URL: https://sooquna.com/docs/settings/input-settings/color_scheme > Pick one of the theme's color schemes. Pick one of the theme's color schemes. ## Schema ```json { "type": "color_scheme", "id": "color_scheme", "label": "Color scheme", "default": "scheme-1" } ``` ## Value in Liquid The scheme ID; use it as a class name. ## Usage ```liquid

``` ## Compatibility :::caution[Differs from Shopify] The value is the scheme ID, not the scheme object. ::: Since theme platform 1.0. --- # color_scheme_group URL: https://sooquna.com/docs/settings/input-settings/color_scheme_group > The theme's color schemes (settings_schema.json only): named sets of colors. The theme's color schemes (settings_schema.json only): named sets of colors. Define the colors each scheme has in "definition"; merchants add schemes in the editor. Output a CSS class per scheme in a snippet. ## Schema ```json { "type": "color_scheme_group", "id": "color_schemes", "definition": [ { "type": "color", "id": "background", "label": "Background", "default": "#FFFFFF" }, { "type": "color", "id": "text", "label": "Text", "default": "#191719" } ], "role": { "background": "background", "text": "text" } } ``` ## Value in Liquid An object of schemes by ID; each has settings.<color id>. ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # custom_page URL: https://sooquna.com/docs/settings/input-settings/custom_page > Pick one of the theme's custom pages (custom_pages/). Pick one of the theme's custom pages (custom_pages/). ## Schema ```json { "type": "custom_page", "id": "landing", "label": "Landing page" } ``` ## Value in Liquid A custom_page (name, url); nil when none. ## Usage ```liquid {% if section.settings.landing %}Ramadan offers{% endif %} ``` ## Compatibility :::tip[Sooquna only] Sooquna only. ::: Since theme platform 1.0. --- # font_picker URL: https://sooquna.com/docs/settings/input-settings/font_picker > Pick a font (compatibility). Pick a font (compatibility). Sooquna has no hosted font library yet. Ship fonts in assets/ and offer a select of your own font names instead. ## Schema ```json { "type": "font_picker", "id": "heading_font", "label": "Heading font", "default": "assistant_n4" } ``` ## Value in Liquid The font name as a string. ## Compatibility :::caution[Accepted, does nothing] Accepted so ported themes load; font_face outputs nothing. ::: Since theme platform 1.0. --- # header URL: https://sooquna.com/docs/settings/input-settings/header > A heading that groups the settings after it. A heading that groups the settings after it. ## Schema ```json { "type": "header", "content": "Colors" } ``` ## Value in Liquid No value. ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # html URL: https://sooquna.com/docs/settings/input-settings/html > HTML the merchant writes. HTML the merchant writes. ## Schema ```json { "type": "html", "id": "custom_html", "label": "Custom HTML" } ``` ## Value in Liquid Sanitized HTML (scripts and event handlers are removed). ## Compatibility :::caution[Differs from Shopify] Scripts are removed. ::: Since theme platform 1.0. --- # image_picker URL: https://sooquna.com/docs/settings/input-settings/image_picker > Pick or upload an image. Pick or upload an image. ## Schema ```json { "type": "image_picker", "id": "image", "label": "Image" } ``` ## Value in Liquid An image object; nil when none. Pass it to image_url. ## Usage ```liquid {% if section.settings.image %}{{ section.settings.image | image_url: width: 1200 | image_tag: sizes: '100vw' }}{% endif %} ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # inline_richtext URL: https://sooquna.com/docs/settings/input-settings/inline_richtext > Formatted text without paragraphs (bold, italic, links). Formatted text without paragraphs (bold, italic, links). ## Schema ```json { "type": "inline_richtext", "id": "caption", "label": "Caption" } ``` ## Value in Liquid Sanitized HTML. ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # link_list URL: https://sooquna.com/docs/settings/input-settings/link_list > Pick a navigation menu. Pick a navigation menu. ## Schema ```json { "type": "link_list", "id": "menu", "label": "Menu", "default": "main-menu" } ``` ## Value in Liquid The linklist; nil when none. ## Usage ```liquid {% for link in section.settings.menu.links %}{{ link.title }}{% endfor %} ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # liquid URL: https://sooquna.com/docs/settings/input-settings/liquid > Liquid the merchant writes (compatibility). Liquid the merchant writes (compatibility). ## Schema ```json { "type": "liquid", "id": "custom_liquid", "label": "Custom Liquid" } ``` ## Value in Liquid The code as text; it isn't rendered. ## Compatibility :::caution[Differs from Shopify] The value isn't rendered as Liquid: merchant code doesn't run on the storefront. Use html for markup. ::: Since theme platform 1.0. --- # metaobject URL: https://sooquna.com/docs/settings/input-settings/metaobject > Pick an entry of a metaobject type ("metaobject_type"). Pick an entry of a metaobject type ("metaobject_type"). ## Schema ```json { "type": "metaobject", "id": "author", "label": "Author", "metaobject_type": "author" } ``` ## Value in Liquid The entry's ID as a string. ## Compatibility :::caution[Differs from Shopify] Returns the ID, not the entry. ::: Since theme platform 1.0. --- # metaobject_list URL: https://sooquna.com/docs/settings/input-settings/metaobject_list > Pick several entries of a metaobject type. Pick several entries of a metaobject type. ## Schema ```json { "type": "metaobject_list", "id": "authors", "label": "Authors", "metaobject_type": "author" } ``` ## Value in Liquid An array of entry IDs. ## Compatibility :::caution[Differs from Shopify] Returns IDs, not entries. ::: Since theme platform 1.0. --- # number URL: https://sooquna.com/docs/settings/input-settings/number > A number field. A number field. ## Schema ```json { "type": "number", "id": "products_to_show", "label": "Products", "default": 4 } ``` ## Value in Liquid A number (whole numbers are integers, so they work as loop limits); nil when empty. ## Usage ```liquid {% for p in collection.products limit: section.settings.products_to_show %}…{% endfor %} ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # page URL: https://sooquna.com/docs/settings/input-settings/page > Pick a page. Pick a page. ## Schema ```json { "type": "page", "id": "page", "label": "Page" } ``` ## Value in Liquid The page's ID as a string. Read pages[handle] for its content. ## Compatibility :::caution[Differs from Shopify] Returns the ID, not the page object. ::: Since theme platform 1.0. --- # paragraph URL: https://sooquna.com/docs/settings/input-settings/paragraph > Help text in the settings panel. Help text in the settings panel. ## Schema ```json { "type": "paragraph", "content": "Shown above the footer on every page." } ``` ## Value in Liquid No value. ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # product URL: https://sooquna.com/docs/settings/input-settings/product > Pick a product. Pick a product. ## Schema ```json { "type": "product", "id": "product", "label": "Product" } ``` ## Value in Liquid The product object; nil when none. ## Usage ```liquid {% assign p = section.settings.product %}{% if p %}{{ p.title }} {{ p.price | money }}{% endif %} ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # product_list URL: https://sooquna.com/docs/settings/input-settings/product_list > Pick several products. "limit" caps how many. Pick several products. "limit" caps how many. ## Schema ```json { "type": "product_list", "id": "products", "label": "Products", "limit": 12 } ``` ## Value in Liquid An array of products (empty when none). ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # radio URL: https://sooquna.com/docs/settings/input-settings/radio > One choice among a few, shown as radio buttons. One choice among a few, shown as radio buttons. ## Schema ```json { "type": "radio", "id": "layout", "label": "Layout", "options": [ { "value": "grid", "label": "Grid" }, { "value": "list", "label": "List" } ], "default": "grid" } ``` ## Value in Liquid The chosen option's value. ## Usage ```liquid

``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # range URL: https://sooquna.com/docs/settings/input-settings/range > A slider between min and max, in steps. A slider between min and max, in steps. The saved value stays between min and max. ## Schema ```json { "type": "range", "id": "columns", "label": "Columns", "min": 2, "max": 5, "step": 1, "default": 4 } ``` ## Value in Liquid A number. ## Usage ```liquid grid-template-columns: repeat({{ section.settings.columns }}, 1fr); ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # richtext URL: https://sooquna.com/docs/settings/input-settings/richtext > Formatted text with paragraphs and lists. Formatted text with paragraphs and lists. A default must be wrapped in <p> or <ul>. ## Schema ```json { "type": "richtext", "id": "text", "label": "Text", "default": "

Hand-made in Doha.

" } ``` ## Value in Liquid Sanitized HTML. ## Usage ```liquid {{ section.settings.text }} ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # select URL: https://sooquna.com/docs/settings/input-settings/select > One choice from a dropdown. Options can be grouped with "group". One choice from a dropdown. Options can be grouped with "group". ## Schema ```json { "type": "select", "id": "image_ratio", "label": "Image ratio", "options": [ { "value": "square", "label": "Square" }, { "value": "portrait", "label": "Portrait" } ], "default": "square" } ``` ## Value in Liquid The chosen option's value. ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # text URL: https://sooquna.com/docs/settings/input-settings/text > A single line of text. A single line of text. ## Schema ```json { "type": "text", "id": "heading", "label": "Heading", "default": "New in" } ``` ## Value in Liquid A string; nil when empty. Output is escaped. ## Usage ```liquid {{ section.settings.heading }} ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # text_alignment URL: https://sooquna.com/docs/settings/input-settings/text_alignment > Left, center or right alignment. Left, center or right alignment. Values are logical (left means the start side), so they flip on Arabic pages when you use text-align start/end in CSS. ## Schema ```json { "type": "text_alignment", "id": "alignment", "label": "Alignment", "default": "left" } ``` ## Value in Liquid left, center or right. ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # textarea URL: https://sooquna.com/docs/settings/input-settings/textarea > Several lines of plain text. Several lines of plain text. ## Schema ```json { "type": "textarea", "id": "note", "label": "Note" } ``` ## Value in Liquid A string. Use newline_to_br to keep line breaks. ## Usage ```liquid {{ section.settings.note | newline_to_br }} ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # url URL: https://sooquna.com/docs/settings/input-settings/url > A link to a page of the store or another site. A link to a page of the store or another site. ## Schema ```json { "type": "url", "id": "button_link", "label": "Button link" } ``` ## Value in Liquid The URL as a string, with the language prefix for store pages; nil when empty. ## Usage ```liquid {% if section.settings.button_link %}Shop{% endif %} ``` ## Compatibility **Shopify:** Same as Shopify. Since theme platform 1.0. --- # video URL: https://sooquna.com/docs/settings/input-settings/video > Pick an uploaded video. Pick an uploaded video. ## Schema ```json { "type": "video", "id": "video", "label": "Video" } ``` ## Value in Liquid The video's asset reference as a string. ## Compatibility :::caution[Differs from Shopify] Returns the reference, not a video object. ::: Since theme platform 1.0. --- # video_url URL: https://sooquna.com/docs/settings/input-settings/video_url > A YouTube or Vimeo link ("accept" lists which). A YouTube or Vimeo link ("accept" lists which). ## Schema ```json { "type": "video_url", "id": "video_url", "label": "Video", "accept": [ "youtube", "vimeo" ] } ``` ## Value in Liquid The URL as a string. ## Compatibility :::caution[Differs from Shopify] The value is the URL, not an object with .id and .type. ::: Since theme platform 1.0. --- # Cart AJAX API URL: https://sooquna.com/docs/storefront/cart-api > Add to, change and read the cart from JavaScript without reloading the page. The cart API answers on the store's own domain, so theme JavaScript calls it with relative URLs. Responses are JSON with prices in minor units, the same shape as Shopify's. | Request | Does | | --- | --- | | `GET /cart.js` | The cart. | | `POST /cart/add.js` | Adds one or more variants. | | `POST /cart/change.js` | Changes one line's quantity or properties. | | `POST /cart/update.js` | Changes several quantities, the note or attributes. | | `POST /cart/clear.js` | Empties the cart. | Requests take JSON (`Content-Type: application/json`) or form data. Without `.js`, `POST /cart/add` is a plain form post that redirects to the cart page: that's what [`{% form 'product' %}`](/docs/storefront/product-forms) does when JavaScript is off. ## Add to cart ```js const res = await fetch("/cart/add.js", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ id: variantId, quantity: 1, properties: { "Gift message": "Eid Mubarak" } }), }); const item = await res.json(); // the added line ``` Add several at once with `{ items: [{ id, quantity }, …] }`; the answer is then `{ items: [...] }`. ## Change a line ```js await fetch("/cart/change.js", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ id: lineKey, quantity: 2 }), // or { line: 1, quantity: 0 } to remove the first line }); ``` `id` is the line's `key` (or a variant ID when that variant is in the cart once); `line` is the 1-based position. Quantity `0` removes the line. ## Update many ```js await fetch("/cart/update.js", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ updates: { [lineKey]: 3 }, note: "Please call before delivery", attributes: { "Delivery slot": "Evening" } }), }); ``` `updates` is an object of line keys (or variant IDs) to quantities, or an array of quantities in line order. ## The cart object ```json { "token": "…", "item_count": 3, "total_price": 122000, "items_subtotal_price": 122000, "original_total_price": 122000, "total_discount": 0, "currency": "QAR", "note": "", "attributes": {}, "requires_shipping": true, "items": [ { "key": "…", "id": "…", "variant_id": "…", "product_id": "…", "title": "Embroidered linen abaya - M / Sand", "product_title": "Embroidered linen abaya", "variant_title": "M / Sand", "quantity": 2, "price": 45000, "final_price": 45000, "line_price": 90000, "final_line_price": 90000, "url": "/products/embroidered-linen-abaya?variant=…", "image": "https://…", "properties": {} } ], "cart_level_discount_applications": [], "discount_codes": [] } ``` Format prices on the page with the store's currency: `window.Sooquna.currency` holds its code. ## Errors Problems answer with an HTTP status and: ```json { "status": 422, "message": "Cart Error", "description": "Only 2 left in stock." } ``` Show `description` to the shopper. ## Updating the page After a change, re-render the cart drawer and the header's cart count with the [section rendering API](/docs/storefront/section-rendering): ```js const html = await (await fetch(`${location.pathname}?sections=cart-drawer,sections--header-group__header`)).json(); ``` The [`product_added_to_cart`](/docs/storefront/customer-events) event is sent for you after a successful `add.js`. --- # Customer accounts URL: https://sooquna.com/docs/storefront/customer-accounts > Linking to sign-in, sign-up and account pages, which Sooquna draws for every theme. Customer account pages (sign in, sign up, password reset, orders, addresses, profile) are drawn by Sooquna, not by the theme. They follow the shopper's language and direction and take the store's colours from **Settings › Checkout**, so they match checkout. Themes don't need `templates/customers/*`; if a ported theme has them, they're ignored. ## Linking to them ```liquid {%- if customer -%} {{ 'customer.account' | t }} {%- else -%} {{ 'customer.log_in' | t }} {%- endif -%} ``` | Route | Page | | --- | --- | | `routes.account_login_url` | Sign in (`/account/login`) | | `routes.account_register_url` | Sign up (`/account/register`) | | `routes.account_url` | Orders (`/account`) | | `routes.account_addresses_url` | Addresses | | `routes.account_logout_url` | Sign out | ## The signed-in customer [`customer`](/docs/liquid/objects/customer) is set on every page while a customer is signed in, and `nil` for guests: greet them, or show their saved wishlist. ```liquid {%- if customer -%}{{ 'customer.greeting' | t: name: customer.first_name }}{%- endif -%} ``` Order history and addresses aren't available to theme Liquid; link to the account pages instead. ## Sign-in forms Sign-in, sign-up and password forms work only on the account pages, which handle passwords, one-time codes and rate limits. A theme's `{% form 'customer_login' %}`, `'create_customer'` or `'recover_customer_password'` renders but can't sign anyone in: link to `routes.account_login_url` instead. To bring shoppers back to the page they were on, add `?return_to=` with a path on the store: ```liquid {{ 'customer.log_in' | t }} ``` --- # Customer events URL: https://sooquna.com/docs/storefront/customer-events > The storefront events bus, standard event names and payloads, and the consent API. `content_for_header` loads a small script that publishes **customer events**: what shoppers do, for the store's analytics and for pixels (Google, Meta, TikTok, Snapchat, custom pixels) the merchant connects in admin. Themes can listen to them and publish their own. ## Standard events | Event | When | `data` | | --- | --- | --- | | `page_viewed` | Every page | — | | `product_viewed` | Product pages | `product_id`, `variant_id`, `value`, `currency` | | `collection_viewed` | Collection pages | `collection_id` | | `search_submitted` | Search results | `query` | | `cart_viewed` | The cart page | — | | `product_added_to_cart` | After a successful `/cart/add.js` | `product_id`, `variant_id`, `quantity`, `value`, `currency` | | `checkout_started` | Checkout opens | order totals | | `checkout_completed` | The order is placed | `order_id`, `value`, `currency` | `value` is in minor units. You don't publish these yourself: they're sent for you. ## Listening ```js Sooquna.analytics.subscribe("product_added_to_cart", (event) => { // event: { name, id, timestamp, data, context: { url, title, referrer } } openCartDrawer(); }); Sooquna.analytics.subscribe("all_events", (event) => console.debug(event.name, event.data)); ``` ## Publishing your own ```js Sooquna.analytics.publish("size_guide_opened", { product_id: "…" }); ``` Custom events reach the store's analytics and custom pixels. Pass `{ local: true }` as a third argument to notify subscribers on the page only. ## Consent In regions that require it, nothing but strictly necessary cookies is used until the shopper agrees. A banner asks for you; themes can read and set the choice: ```js const privacy = Sooquna.customerPrivacy; privacy.analyticsProcessingAllowed(); // true or false privacy.marketingAllowed(); privacy.setTrackingConsent({ analytics: true, marketing: false }, () => {}); document.addEventListener("sooquna:consent", (e) => console.log(e.detail)); ``` Pixels load only after consent allows them. A custom pixel runs in a sandboxed frame with no access to the page, and receives events by message. ## Page facts `window.Sooquna` also has `shop`, `locale`, `currency`, `page_type`, `design_mode` and `routes` (`cart_add_url`, `cart_url`, `predictive_search_url`…), so scripts don't need them printed into the page. `window.Shopify` points to the same object, for ported scripts. --- # Collection filters URL: https://sooquna.com/docs/storefront/filters > Faceted filters on collection and search pages, from the filter objects and URL parameters. Merchants choose filters (availability, price, vendor, product type, tags, options such as size and colour, custom fields) in **Storefront › Search & discovery**. Themes read them from `collection.filters` and `search.filters`: a list of [`filter`](/docs/liquid/objects/filter) objects. ```liquid title="snippets/facets.liquid" ``` ## URL parameters | Filter | Parameter | | --- | --- | | Availability | `filter.v.availability=1` | | Price | `filter.v.price.gte=100&filter.v.price.lte=300` (in major units) | | Vendor | `filter.p.vendor=Layla` | | Product type | `filter.p.product_type=Abayas` | | Tag | `filter.p.tag=linen` | | Option | `filter.v.option.size=M`, `filter.v.option.color=Black` | | Custom field | `filter.p.m.custom.material=Linen` | | Category | `filter.p.t.category=…` | Repeat a parameter for several values (`filter.p.vendor=A&filter.p.vendor=B`): values of one filter are OR-ed, different filters AND-ed. Sort with `sort_by` (`collection.sort_options` lists the choices). ## Active filters and "clear" ```liquid {%- for filter in collection.filters -%} {%- for value in filter.active_values -%} {{ filter.label }}: {{ value.label }} ✕ {%- endfor -%} {%- endfor -%} Clear all ``` ## Without reloading Submit the form with JavaScript: build the URL from the form data, fetch it with `section_id=` for the product grid (the [section rendering API](/docs/storefront/section-rendering)), swap the grid, and update the address bar with `history.replaceState`. Colour options have `presentation: "swatch"` and `value.swatch.color`, to draw colour circles instead of names. --- # Contact and newsletter forms URL: https://sooquna.com/docs/storefront/forms > The contact form, newsletter sign-ups and showing success and errors. ## Contact form ```liquid {%- form 'contact', id: 'ContactForm' -%} {%- if form.posted_successfully? -%}

{%- endif -%} {%- if form.errors -%}

{%- endif -%} {{ 'contact.form.name' | t }} {{ 'contact.form.email' | t }} {{ 'contact.form.phone' | t }} {{ 'contact.form.order_number' | t }} {{ 'contact.form.message' | t }} {%- endform -%} ``` The message is saved under **Messages** in admin and emailed to the store. `contact[name]`, `contact[email]`, `contact[phone]` and `contact[body]` are the standard fields; any other `contact[…]` field is kept with the message. After sending, the shopper comes back to the same page with `form.posted_successfully?` true. Spam protection is built in: a hidden field bots fill in is added for you, and each visitor can send a few messages a minute. ## Newsletter sign-up ```liquid {%- form 'customer', id: 'Newsletter' -%} {%- if form.posted_successfully? -%}

{%- else -%} {%- endif -%} {%- endform -%} ``` The email becomes a customer who accepts marketing, tagged with `contact[tags]` (comma-separated). `{% form 'newsletter' %}` works the same. ## Several forms on one page Give each form its own `id`. `form.posted_successfully?` is true only in forms of the type that was sent, so a footer sign-up doesn't show "thanks" after a contact message. --- # Languages and RTL URL: https://sooquna.com/docs/storefront/localization > Language selectors, URLs per language, right-to-left pages and hreflang. A store publishes one or more languages in **Settings › Languages**. The primary language has no URL prefix; the others live under `/ar/`, `/fr/` and so on. ## What Sooquna does for you - **URLs**: `routes`, every `url` property and [`url`](/docs/settings/input-settings/url) settings include the language prefix. - **Content**: product titles, collection descriptions, pages, menus and section settings come in the page's language when the merchant has translated them. - **hreflang**: `content_for_header` adds `` for every published language, and the sitemap lists the alternates. - **A language suggestion**: when a visitor's browser prefers another published language, a small banner offers it. ## What the theme does Set the language and direction on ``: ```liquid ``` and print text through [`t`](/docs/liquid/filters/t), never hard-coded. Layout and spacing for right-to-left pages are in [RTL and Arabic typography](/docs/best-practices/rtl-arabic). ## A language selector ```liquid {%- if localization.available_languages.size > 1 -%} {%- form 'localization', id: 'LanguageForm' -%} {%- endform -%} {%- endif -%} ``` The form posts to `/localization`, remembers the choice and sends the shopper to the same page in the new language. Show each language in its own name (`endonym_name`: English, العربية) with a `lang` attribute, so screen readers pronounce it right. Plain links work too, without a form: ```liquid {%- for language in localization.available_languages -%} {{ language.endonym_name }} {%- endfor -%} ``` ## Countries and currency A store sells in its own currency; `localization.country` is the store's country. Prices are always in `shop.currency`. ## Dates and numbers [`date`](/docs/liquid/filters/date) prints Arabic month names on Arabic pages and takes `calendar: 'hijri'`. Prices use Western digits in every language, so they're the same in the cart, on receipts and in WhatsApp messages. --- # Metaobject pages URL: https://sooquna.com/docs/storefront/metaobject-pages > Pages for entries of custom content types, such as store locations or designers. Merchants define content types in **Storefront › Custom content**: a designer, a store location, a recipe. When a type is marked as having pages, each published entry gets a URL: ```text // for example /designers/layla-ahmad ``` Underscores in the type become dashes in the URL (`store_location` → `/store-location/doha-mall`). ## The template The page uses `templates/metaobject/.json` (or `.liquid`). Without that template, the URL is a 404. ```json title="templates/metaobject/designer.json" { "sections": { "main": { "type": "main-designer" } }, "order": ["main"] } ``` ```liquid title="sections/main-designer.liquid"

{% schema %}{ "name": "Designer" }{% endschema %} ``` [`metaobject`](/docs/liquid/objects/metaobject) has `id`, `handle`, `type` and `url`, plus each field by its key. A field prints as its value; `.value` gives the typed value. --- # Password page URL: https://sooquna.com/docs/storefront/password-page > The page shoppers see while a store is closed with a password, before launch. While a store is password-protected (**Storefront › Preferences**), every page shows the password page: `templates/password.json`, drawn in `layout/password.liquid` when the theme has one. ```liquid title="sections/main-password.liquid"

{%- if shop.password_message != blank -%}

{%- endif -%} {%- form 'storefront_password' -%} {%- if form_error -%}

{%- endif -%} {{ 'general.password_page.login_form_password_label' | t }} {%- endform -%}

``` - `shop.password_message` is the merchant's message. - The form posts `password` to `/password`. A wrong password shows the page again with [`form_error`](/docs/liquid/objects/form_error) set. - A newsletter form works on the password page too: collect emails before launch. Search engines are asked not to index a store while it's password-protected. --- # Predictive search URL: https://sooquna.com/docs/storefront/predictive-search > Search suggestions as the shopper types, as JSON or as a rendered section. ## As a section (recommended) Render a section with [`predictive_search`](/docs/liquid/objects/predictive_search) and swap it in under the search box: ```js const q = encodeURIComponent(input.value.trim()); const html = await (await fetch(`/search/suggest?q=${q}&resources[type]=product,collection,query&resources[limit]=4§ion_id=predictive-search`)).text(); ``` ```liquid title="sections/predictive-search.liquid" {%- if predictive_search.performed -%} {%- endif -%} ``` ## As JSON ```js const data = await (await fetch(`/search/suggest.json?q=${q}&resources[type]=product&resources[limit]=6`)).json(); data.resources.results.products; // [{ id, title, handle, url, price, available, vendor, image }] ``` `results` has `products`, `collections`, `pages`, `articles` and `queries` (suggested searches, with `text`, `styled_text` and `url`). ## Parameters | Parameter | Default | | | --- | --- | --- | | `q` | | The search terms. | | `resources[type]` | all | `product`, `collection`, `page`, `article`, `query`, comma-separated. | | `resources[limit]` | 4 | Results per type, at most 10. | Arabic searches ignore diacritics and tatweel, and treat alef forms (أ إ آ), taa marbuta and alef maqsura alike, so `عطر` finds `عِطر` and `اسورة` finds `أسورة`. Arabic-Indic digits match Western ones. ## Good practice - Wait about 250 ms after the last keystroke, and cancel the previous request with an `AbortController`. - Use `role="combobox"` on the input and `aria-activedescendant` for keyboard selection. - Link the "See all results" row to `routes.search_url` with the same `q`. --- # Product forms and variants URL: https://sooquna.com/docs/storefront/product-forms > The add-to-cart form, variant pickers and keeping the page in sync with the selected variant. ## The form ```liquid {%- assign current = product.selected_or_first_available_variant -%} {%- form 'product', product, id: 'ProductForm', class: 'product-form' -%} {{ 'products.product.quantity' | t }} {%- endform -%} ``` `{% form 'product' %}` posts to `/cart/add` and redirects to the cart. With JavaScript, intercept the submit and post the form data to `/cart/add.js` instead (see the [cart API](/docs/storefront/cart-api)). Extra inputs named `properties[Name]` become line properties. ## Choosing a variant Draw one control per option from `product.options_with_values`: ```liquid {%- for option in product.options_with_values -%}

{{ option.name }} {%- for value in option.values -%} {{ value.name }} {%- endfor -%}

{%- endfor -%} ``` When the shopper picks values, find the variant in the product JSON whose `options` match, then: 1. set the hidden `id` input to its ID; 2. update the URL with `?variant=` (`history.replaceState`), so the page can be shared and reloaded; 3. refresh price, stock and images: re-render the main section with `?variant=§ion_id=template--main`, or update them from the JSON. `product.selected_variant` is the variant from `?variant=` (nil without it); `selected_or_first_available_variant` always has one. ## Stock `variant.available` says whether it can be bought. Exact stock isn't exposed to themes; with the **Stock status** [feature](/docs/storefront/store-features) on, Sahil's `inventory-status` block shows a low-stock message. ## Gift cards Gift card products have `product.gift_card?`. With the gift cards feature on, add recipient fields to the form (`properties[Recipient email]`, `properties[Recipient name]`, `properties[Message]` and `properties[Send on]`), as Sahil's `snippets/gift-card-recipient.liquid` does. --- # Section rendering API URL: https://sooquna.com/docs/storefront/section-rendering > Re-render one or more sections from JavaScript, in the context of any page. Ask any storefront URL for sections instead of the whole page. The sections render exactly as they would on that page, with its product, collection, filters and language. ## One section, as HTML ```js const html = await (await fetch(`/collections/abayas?filter.p.vendor=Layla§ion_id=template--grid`)).text(); ``` ## Up to five, as JSON ```js const res = await fetch(`/products/linen-abaya?sections=template--main,cart-drawer`); const { "template--main": main, "cart-drawer": drawer } = await res.json(); ``` A section that doesn't exist comes back as `null`. ## Section IDs | ID | Renders | | --- | --- | | `template--` | The section `` of the page's JSON template (`template--main`). | | `sections--__` | A section of a section group (`sections--header-group__header`). | | `` | `sections/.liquid` with its default settings (`cart-drawer`). | The ID of every rendered section is in its wrapper (`id="shopify-section-template--main"`), so you can read it from the page. ## Typical uses - **Filters and sorting**: fetch the collection URL with the new filters and `section_id=template--grid`, swap the grid, and `history.replaceState` the URL. - **Cart drawer**: after the [cart API](/docs/storefront/cart-api), re-render the drawer and the header. - **Variant changes**: fetch `?variant=§ion_id=template--main` to update price, stock and images together. - **Recommendations**: `/recommendations/products?product_id=&limit=4§ion_id=related-products` renders a section with [`recommendations`](/docs/liquid/objects/recommendations). --- # Store features URL: https://sooquna.com/docs/storefront/store-features > Built-in storefront features (wishlist, reviews, back in stock…) and how a theme shows them only when they're on. Sooquna has storefront features built in, switched on per store in **Storefront › Features**: wishlist, product reviews, back-in-stock alerts, size guides, quick view and more. Shopify needs apps for these; in Sooquna the theme draws them and the platform does the rest. ## Showing a feature only when it's on Give the section, block or settings group a `capability`: ```liquid title="blocks/wishlist-button.liquid (schema)" {% schema %} { "name": "Wishlist button", "capability": "wishlist", "settings": [] } {% endschema %} ``` While the feature is off, the file renders nothing, and the visual editor hides it. In other code, check [`features`](/docs/liquid/objects/features): ```liquid {%- if features.wishlist -%} {{ 'wishlist.title' | t }} {%- endif -%} ``` ## Feature keys | Key | Feature | | --- | --- | | `wishlist` | Wishlist, with a `/wishlist` page ([`wishlist`](/docs/liquid/objects/wishlist)) | | `reviews` | Product reviews ([`product.reviews`](/docs/liquid/objects/reviews), `product.rating`) | | `back_in_stock` | "Notify me" on sold-out variants; `features.back_in_stock_whatsapp` when alerts can go to WhatsApp | | `size_guide` | Size charts on product pages | | `quick_view` | Quick view from product cards (`?view=quick-view`) | | `image_zoom` | Zoom on product images | | `product_badges` | Sale, new and bestseller badges (`product.bestseller`) | | `stock_status` | Low-stock and sold-out messages | | `related_products` | Related products ([`recommendations`](/docs/liquid/objects/recommendations)) | | `product_search` | Predictive search | | `whatsapp_share` | Share and chat buttons for WhatsApp | | `announcement_bar` | The announcement bar | | `newsletter_capture` | Newsletter sign-up and pop-up | | `order_tracking` | Order lookup at `/orders/lookup` | | `gift_cards`, `gift_message` | Gift card products and gift messages | Unknown keys are `nil`, so `{% if features.something %}` is safe in any store. ## How Sahil does it Sahil ships every feature's section or block (`blocks/wishlist-button.liquid`, `sections/product-reviews.liquid`, `blocks/back-in-stock.liquid`, `blocks/size-chart.liquid`…), each with its `capability`. A merchant who switches a feature on sees it on the storefront at once, with no theme edit. Copy that pattern: ship the feature's markup, and let `capability` decide. --- # Publishing themes URL: https://sooquna.com/docs/themes/publishing > Sharing themes with other merchants, and the planned theme store. Today a theme is published per store: upload it as a `.zip` in **Storefront › Themes**, or build it in the code editor, then **Publish**. To give a theme to another merchant, download it as a `.zip` and send it; they upload it to their store. ## The theme store (phase 2) A Sooquna theme store for first-party and partner themes is planned. Themes listed there will need to: - pass the [theme check](/docs/best-practices/theme-check) with no errors; - support English and Arabic, right to left included, with complete `locales/en.default.json` and `locales/ar.json`; - score 90 or more on Lighthouse mobile on the home, product and collection pages; - meet the [accessibility checklist](/docs/best-practices/accessibility); - ship sections for the built-in [store features](/docs/storefront/store-features), with `capability`; - include a `theme.json` with a support URL and documentation. Partners interested in listing themes can register through the [partner programme](/partners). --- # Sahil URL: https://sooquna.com/docs/themes/sahil > Sooquna's first-party theme for fashion and lifestyle brands, Arabic-first and fast. **Sahil** (ساحل, "coast") is the theme every Sooquna store starts with. It's image-led, built for fashion, abayas, fragrance and lifestyle brands, and designed Arabic-first: every template works right to left, with Arabic typography and plural forms. ## What's in it - **14 templates**: home, product (with a quick-view alternate), collection, collections list, search, cart, blog, article, page (with a contact alternate), wishlist, password and 404, plus a size guide custom page. - **38 sections**, including slideshow, image banner, featured collection and product, multicolumn, testimonials, logo list, video, collapsible content, recently viewed, related products, product reviews, newsletter and pop-up, WhatsApp button, cart drawer and predictive search. - **36 theme blocks** for product pages and content: title, price, variant picker, buy buttons, quantity, inventory status, delivery estimate, size chart, product badges, rating, share, wishlist button, back in stock, trust badges, payment icons, countdown, icon with text and more. - **Store features built in**: wishlist, reviews, back-in-stock alerts, size guides, quick view, badges, stock status, WhatsApp share and newsletter, each shown only while the store has it on. - **Three colour schemes** plus a brand scheme, a Night preset, heading and body type scales, and a choice of sans or serif headings. - **Cart as a drawer or a page**, with a free-shipping progress bar and order notes. ## Performance Self-hosted Geist and IBM Plex Sans Arabic fonts, split by script so English pages never load Arabic files; responsive WebP images; deferred scripts per feature; no frameworks. Sahil scores 90 or more on Lighthouse mobile. ## Customising Change sections, blocks, colours and type in **Customize**. For code changes, [duplicate the theme](/docs/getting-started/quick-start) first and keep a note of the files you change. When a new Sahil version comes out, the themes list shows **Update available**: add the new version from the theme library, check it in the preview, and carry your changes across before publishing it. ## Version Current version: **1.1.0**. See the [changelog](/docs/changelog).

{{ block.settings.text }}

{{ custom_page.title }}

{{ section.settings.heading }}

{{ section.settings.heading }}

{{ block.settings.heading | escape }}

{{ metaobject.name }}

{{ shop.name }}