# Code snippets in custom app

### What programming languages are supported for adding code snippets in a custom app? Can you provide examples of code syntaxes?

You can enhance your custom app's functionality and appearance by adding code snippets to pages and posts. In the code snippet field, you can include HTML, JavaScript, and CSS to customize your app according to your needs.

Steps to Add Code Snippets:

* Navigate to the Page/Post: Go to the page or post where you want to add the code snippet.
* Add Code section: Add a section for the code snippet field within the page or post editor.
* Add Your Code: Enter your HTML, JavaScript, or CSS code in the respective field.

Examples and Syntax:

1. HTML: HTML can be used to structure content. Here is an example of an HTML code snippet:

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXfb4LhKYpaYnNZVXePIlv3IVAKKsWUyQOrJCfgbtdP7cBra8GE_OV8Xj5OcxTLeG_pcrkoHNU3HcXUkMzE4rTbeSLQsECmUSJZxHrStbDphv8b0cHKecsVhZ-CoFdvBcWxAWlfotxdKGPk97IxKqS4CdMA?key=n-waqS0CWkdyz5yvn3TZjw" alt=""><figcaption></figcaption></figure>

Explanation:

* **\<div class="container">:** Creates a division element with a class name of "container".
* \<h1>Welcome to Our App\</h1>: Adds a heading level 1 element.
* \<p>This is an example of HTML content.\</p>: Adds a paragraph element.

2. JavaScript: JavaScript is used to add interactivity to your web pages. Here is an example of a JavaScript code snippet:

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXcqFagDAj7d_tXYT2UBsf99gDXbD3tNoWly6jBz1Q3uCg_sEdj0k648tAIKU8YGEZCwUbrirVVvEK66BDmSXHJcAU0OghOe1uDzoKTyuTNBUrmqUrJr7LY9HVEKgHFomDv6NUzZd8epzVyMVNR1MP7mmeo?key=n-waqS0CWkdyz5yvn3TZjw" alt=""><figcaption></figcaption></figure>

Explanation:

* document.addEventListener('DOMContentLoaded', (event) => {...});: Ensures the script runs after the document has fully loaded.
* document.getElementById('button').addEventListener('click', () => {...});: Adds a click event listener to an element with the ID "button".
* alert('Button clicked!');: Displays an alert message when the button is clicked.

3. CSS: CSS is used to style your HTML elements. Here is an example of a CSS code snippet:

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXflOpVsFqSYODQQZzIN52cYxXPM-QeJwlD7aBZUR6wZMCurYLiRFjD_8KPI5FeB7T51gY4DieYTldQrAvTf--xtkfgpi6ITxQaYRYUdyIacxghoCdy4UFMmB2eEMcJRGDid6ZfctjBLMWUw3LsP4QtsoNVZ?key=n-waqS0CWkdyz5yvn3TZjw" alt=""><figcaption></figcaption></figure>

Explanation:

* container: Sets the background color, padding, and border-radius for elements with the "container" class.
* h1: Sets the color and font family for all \<h1> elements.
* p: Sets the font size and line height for all \<p> elements.

By following these steps and examples, you can effectively add HTML, JavaScript, and CSS code snippets to your app's pages and posts, enhancing both functionality and design.


---

# 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.appmysite.com/frequently-asked-questions/app-features-and-settings/code-snippets-in-custom-app.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.
