> ## Documentation Index
> Fetch the complete documentation index at: https://docs.launchmystore.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Aqua Overview

> Build themes with Aqua templating

# Aqua Templating

LaunchMyStore uses **Aqua** template language. It's designed for building dynamic, customizable themes.

<Note>
  LaunchMyStore is **100% Liquid compatible**. Existing Liquid themes work seamlessly with zero modifications.
</Note>

## What is Aqua?

Aqua is a safe, customer-facing template language with three main constructs:

<CardGroup cols={3}>
  <Card title="Objects" icon="cube">
    Output dynamic content with double curly braces: `{{ product.title }}`
  </Card>

  <Card title="Tags" icon="code">
    Logic and control flow: `{% if %}`, `{% for %}`, `{% assign %}`
  </Card>

  <Card title="Filters" icon="filter">
    Transform output with pipes: `{{ price | money }}`
  </Card>
</CardGroup>

## Quick Example

```aqua theme={null}
<div class="product-card">
  <img src="{{ product.featured_image | img_url: '400x' }}" alt="{{ product.title }}">
  <h2>{{ product.title }}</h2>
  <p class="price">{{ product.price | money }}</p>
  
  {% if product.compare_at_price > product.price %}
    <span class="sale-badge">Sale</span>
    <s>{{ product.compare_at_price | money }}</s>
  {% endif %}
  
  {% if product.available %}
    <button>Add to Cart</button>
  {% else %}
    <button disabled>Sold Out</button>
  {% endif %}
</div>
```

## Theme Structure

LaunchMyStore themes follow the JSON templates structure:

```
theme/
├── assets/              # CSS, JS, images, fonts
├── blocks/              # Reusable block components
├── config/
│   ├── settings_data.json    # Current theme settings
│   └── settings_schema.json  # Settings definitions
├── layout/
│   └── theme.aqua     # Main layout wrapper
├── locales/
│   └── en.default.json  # Translations
├── sections/            # Page sections
├── snippets/            # Reusable Aqua includes
└── templates/           # Page templates (JSON format)
    ├── index.json
    ├── product.json
    ├── collection.json
    └── ...
```

## Page Types

| Template                 | URL Pattern                       | Global Object |
| ------------------------ | --------------------------------- | ------------- |
| `index.json`             | `/`                               | `shop`        |
| `product.json`           | `/products/{handle}`              | `product`     |
| `collection.json`        | `/collections/{handle}`           | `collection`  |
| `page.json`              | `/pages/{handle}`                 | `page`        |
| `blog.json`              | `/blogs/{handle}`                 | `blog`        |
| `article.json`           | `/blogs/{blog}/articles/{handle}` | `article`     |
| `cart.json`              | `/cart`                           | `cart`        |
| `search.json`            | `/search`                         | `search`      |
| `customers/account.json` | `/account`                        | `customer`    |
| `404.json`               | (any 404)                         | -             |

## Whitespace Control

Use hyphens to strip whitespace:

```aqua theme={null}
{%- assign name = "value" -%}
{{- product.title -}}
```

* `{%-` strips whitespace before
* `-%}` strips whitespace after
* `{{-` and `-}}` work the same for outputs

## Comments

```aqua theme={null}
{% comment %}
  This won't appear in the output
{% endcomment %}

{# Shorthand single-line comment #}
```

## Next Steps

<CardGroup cols={2}>
  <Card title="Objects" icon="cube" href="/aqua/objects">
    Learn about global objects like shop, product, cart
  </Card>

  <Card title="Filters" icon="filter" href="/aqua/filters">
    Transform and format output values
  </Card>

  <Card title="Tags" icon="code" href="/aqua/tags">
    Control flow, loops, and template logic
  </Card>

  <Card title="Schema" icon="brackets-curly" href="/aqua/schema">
    Define section and block settings
  </Card>
</CardGroup>
