# Loading overlay

The loading overlay is a UI component designed to visually indicate that something is loading or in progress on the page - such as the content being fetched, a page transition, or a background process.\
In this implementation, it’s a reusable block that can:

* Display a custom loading image defined in the theme settings.
* Fall back to a simple animated placeholder if no image is provided.
* Be conditionally shown or hidden based on a setting loading appearance.

This loading overlay is built using Liquid (Shopify's templating language) and rendered in HTML.

<figure><img src="/files/TAfrcFlf5d6A3oarTpWE" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="129.88104248046875">Settings</th><th width="143.704833984375" align="center">Type</th><th>Description</th></tr></thead><tbody><tr><td>Image</td><td align="center"><code>image_picker</code></td><td>Upload or select an image to show in the loading overlay (e.g., logo, spinner).</td></tr><tr><td>Image width</td><td align="center"><code>range</code></td><td>Controls the width of the loading image.</td></tr><tr><td>Background</td><td align="center"><code>color</code></td><td>Choose the background color for the overlay.</td></tr><tr><td>Appearance</td><td align="center"><code>select</code></td><td>Controls when the loading overlay appears. Options: <code>First load</code>, <code>Always</code>, <code>Never</code>.</td></tr></tbody></table>


---

# 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://palo-alto.presidiocreative.com/theme-settings/settings/loading-overlay.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.