# Custom codes

Foxify provides you the ability to build everything you want - either by using premade elements or by tweaking CSS/JS code.

If you're familiar with coding and want to create advanced effects and stylings, Foxify supports a **Custom code editor** that lets you add your custom CSS and JavaScript directly to all the pages using that template.

## How to add Custom codes

{% hint style="success" %}
Steps:

1. In your Foxify editor, on the left sidebar, select the option **\</> Custom code**, or press **\[C]** on your keyboard.
2. Add your **Custom CSS** and/or **Custom JS** in the corresponding boxes.&#x20;
3. **Save** your settings without publishing changes to the live page
4. Hit **Publish** to apply the custom code you added directly to live page on Shopify.
   {% endhint %}

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

{% hint style="warning" %}
This advanced feature requires you to have a certain knowledge of web design languages. If you are not familiar with these, kindly avoid using the **Custom code editor** to prevent unwanted technical issues.&#x20;
{% endhint %}

{% hint style="info" %}
:pushpin: Please note: Providing custom code is out of the scope of Foxify support.
{% endhint %}

<div data-full-width="false"><figure><img src="/files/kcilvHtHzK8t5VOGf1nR" alt=""><figcaption><p>Foxify AI turns a prompt into a well-structured page layout in seconds. <a href="https://admin.shopify.com/apps/foxify-builder?utm_source=foxecom&#x26;utm_medium=help_center_custom_code&#x26;utm_campaign=anchor-text&#x26;utm_term=try-foxify-ai"><mark style="color:orange;">Try Foxify AI</mark></a> ✨</p></figcaption></figure></div>


---

# 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://docs.foxecom.com/foxify-app/foxstudio/editor-tools/custom-codes.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.