# HTML

### Custom HTML <sup><sub>*<mark style="color:green;">\[Pro]</mark>*<sub></sup>

You can completely rewrite the HTML of the popup if you want, entering your own format and entering in custom tags that will insert dynamic content. [See an example here](https://wpmaps.mapster.me/examples/mapster-wp-map/sample-custom-html-popup/).

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

### Dynamic Tags <sup><sub>*<mark style="color:green;">\[Pro]</mark>*<sub></sup>

By using the tags indicated in the description of the field, you can enter in tags that will be replaced in the front end with data of that feature post. These include:

* Header Text `{header}`
* Image URL `{image_url}`
* Content `{content}`
* Button Link `{button_url}`
* Button Text `{button_text}`
* Post Title`{post_title}`&#x20;

### Custom Fields <sup><sub>*<mark style="color:green;">\[Pro]</mark>*<sub></sup>

You can also reference ACF fields or custom properties that you've added to your data, similar to elsewhere in the plugin. For custom properties, add the name of the field:

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

So, in the case of the above, if you wanted to add "name" into your popup, you would add:

```
<div>Some custom {name} HTML</div>
```

For ACF fields, use the field name (not the field ID). So for the following:

<figure><img src="/files/4ylh3PpCSJJVdut9DU0T" alt=""><figcaption></figcaption></figure>

If you wanted to add the "School name", you would add:

```
<div>My custom {school_name}</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://wpmaps-docs.mapster.me/popups/popup-templates/html.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.
