# Config

The config is a crucial part of your theme's architecture, as it defines various settings and parameters that help your theme function properly and efficiently. Your theme's config consists of the primary file: `settings_schema.json`. This file should be located in the `config` directory of your theme.

## settings\_schema.json

`settings_schema.json` is a JSON file that describes the structure and available options for the theme's settings. It defines the fields that can be customized by the store owner in the theme editor, such as colors, fonts, and layout options. Each field has a unique key, a data type, and various options or properties.

The schema serves as a blueprint for the theme settings, which are stored and managed in the database. When the store owner customizes their theme through the theme editor, the values are saved in the database and then retrieved and applied when the theme is rendered.

Here's an example of a `settings_schema.json` file:

```
[
  {
    "name": "Colors",
    "settings": [
      {
        "type": "color",
        "id": "primary_color",
        "label": "Primary color",
        "default": "#000000"
      },
      {
        "type": "color",
        "id": "secondary_color",
        "label": "Secondary color",
        "default": "#ffffff"
      }
    ]
  },
  {
    "name": "Typography",
    "settings": [
      {
        "type": "font",
        "id": "body_font",
        "label": "Body font",
        "default": "Arial, sans-serif"
      },
      {
        "type": "font",
        "id": "heading_font",
        "label": "Heading font",
        "default": "Verdana, sans-serif"
      }
    ]
  },
  {
    "name": "Layout",
    "settings": [
      {
        "type": "range",
        "id": "content_width",
        "label": "Content width",
        "min": 800,
        "max": 1600,
        "step": 100,
        "unit": "px",
        "default": 1200
      }
    ]
  }
]

```

See [Input settings](https://cryptococo.gitbook.io/cocoshop-theme-development/architecture/input-settings) for more details.

## Usage

To use the settings defined in your `settings_schema.json` file within your theme templates, you can access them using the `settings` object. The `settings` object is automatically created by the theme engine and contains the values of the settings defined in the `settings_schema.json` file. Each setting can be accessed using its unique `id` as a property of the `settings` object.

You can access these settings in your theme templates like this:

```liquid
<style>
  body {
    background-color: {{ settings.primary_color }};
    color: {{ settings.secondary_color }};
  }
</style>
```

The above Liquid code snippet will generate CSS code that sets the background color and text color of the page using the values defined in the `settings_schema.json` file. When the store owner customizes their theme, the updated values are automatically applied to the theme, updating the appearance of the store.

Remember to use the correct Liquid syntax for accessing the `settings` object and its properties. If you need to access the setting value within a Liquid tag, use double curly braces `{{ }}`. If you need to access the setting value within a Liquid control structure, use a single curly brace and a percentage sign `{% %}`.

By using the settings defined in `settings_schema.json` within your templates, you allow the store owner to have greater control and flexibility in customizing their store's appearance and functionality.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://cryptococo.gitbook.io/cocoshop-theme-development/architecture/config.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
