> For the complete documentation index, see [llms.txt](https://docs.cwicly.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.cwicly.com/advanced/tooltip/source.md).

# Source

The Source property allows you choose whether the Tooltip content source will be static or dynamic.

{% hint style="info" %}
By default, the source is set to static
{% endhint %}

## Static

A static Tooltip source will rely on content provided by the user. It will not update automatically, and relies on manual changes.

* Select a block
* Open the Advanced tab
* Open the Tooltip Tab
* Set Source to Static.

![](https://lh4.googleusercontent.com/4meo1BKdxyUj4OO4agFnzO_I0XLat8Zcdp9pSjzVRKGhPdL-12U8qQmYWNmoT_uANecrF1bIkDdA_SlpnDl2IrC6TrENkHdMy53AwUAISHj-982s_6p5_n9Muy7jpCClI0aZfnTuf5CbFYOCYMMeF6M)

### Content

The Content property allows you to input the Tooltip label.

* Open the Advanced tab.
* Open the Tooltip tab.
* Set Source to Static.
* Input required Tooltip label.

![](https://lh4.googleusercontent.com/oLibqZ3JX0UlibIAPT1yEZu2T-jI3_r10_XJkjA8Hl1F7Gjj2k7o7f11an4TZA817v84M1ohBQ4YJ9WlILft_N25mMZ_kPjyS7r2H6V_4A4G_-xnmJh7qQgO0CRg531Wqgslet6jQt5qzRd1AXvNorc)![](https://lh5.googleusercontent.com/XyCDPunKVNfbrutu-8vsVFl1I2EO2LBbQQ9wc1EHxaxCnHFpJsFjgtqB5LYmUwkqQS9eEYavM_mt2FQFFciOOeqSazqm3DrV06zNNDGl0FARkXgoF9009P5dZyYfc58ZD0rAs3CiAgrom1kl1SAHXtU)

## WordPress

The WordPress Source allows you to  choose dynamic WordPress content for your Tooltip.

* Select a block.
* Open the Advanced tab.
* Open the Tooltip tab.
* Set Source to WordPress.

![](https://lh4.googleusercontent.com/MLwoBPSSyox0IMjOIhJZ1_tCuRJZLrAUPAmYOYvibFpV8YpCk0QbRdzFv1-suXoW-oiFhOBO2MiQ2lN96qaZOXL2W0zIMGVTKmFL9foynReQKzy0OiNOuURZgNSokHFOffDkUEGhqWvL3a-KnAe9zMQ)

### Data

* Select required Data in dropdown, such as Post Date, Post Excerpt, Post ID, Post Tag etc.

![](https://lh6.googleusercontent.com/wyxVST3ZBrmR7X7A404q662qaZHSpEMU5G-2ut_FnbEwmTYTGV4du53aQEyRLjJOEEYpR9QA-heDoHlcSfcUrHSN6-oFwYFr2Ws0PlwYhNiUfUXAOic0yXJ98L9GYe6_MgkHQ01x5pp2kL0D6CNv2mk)

### Type

* Set required WordPress Type depending on the type of WordPress data.

![](https://lh4.googleusercontent.com/cYwR8JjsN9Iw2V6-_Fe1WlOvQJDVZ_gB9e_su8BpC7h9vAnZZ5ZHTG5UofgLTvr4ibKlQGSIezjgBo-UNq7bZuyrK7OfWiUea94q65Axtz8IsmkajMsrLZqzVRFYrh4v7yee02t-PBUsiCgwIWjMaio)

## ACF

The ACF Source allows you to  choose dynamic ACF content for your Tooltip.

{% hint style="warning" %}
For ACF Pro, you will need to create an ACF Field and Group (from your dashboard in the Custom Fields tab).
{% endhint %}

It will update automatically as it relies on WordPress dynamic features as well as ACF Pro.

* Select a block.
* Open the Advanced tab.
* Open the Tooltip tab.
* Set Source to ACF.

![](https://lh6.googleusercontent.com/gigGyqiZgsjisZO33ArWDSPPHEba4VKJDv8crIuWxINe7Fsh7oSot7NLWa6OUmMW0VlzZnOzM806UegcZCss7C_tOB7IaNLZ7U0aWL57gKqfGyWpvxSLTZ8FEHG4zlxlaLjj3wiW2YMSnfYq9qdSosY)

* Select Group, Field etc.

![](https://lh6.googleusercontent.com/Eh_RpcTtv-wOndy7_IghH_crPAneQExQkG8bkmUvZmFVudglkY-6G0k3N3KV0N0f6KfK9iWlRKq5DLs_5UR6J1j-G3ps23tQ-ObhuIvv9zgiLQjsFZmM6WZJt1Mw_4P8z20omsatjlTL9sRByX9fZSQ)

## WooCommerce

The ACF Source allows you to  choose dynamic WooCommerce content for your Tooltip.

* Open the Advanced tab.
* Open the Tooltip tab.
* Set Source to WooCommerce.

![](https://lh4.googleusercontent.com/TryTlX5KxCsi0_ks2GgVeR1CoszibAEreSXaTCl7RNBfhgf4m_lSI1snxw50fn-mMY8VNTdQo3Uhqv0TReHmWGTxIeYyatfHsQzMv85Wsr16oNSlnnEqUzuyTeg2ZzLjKB_05h_0DfxwbwqMk1Ny5qs)

### Data

The Data property allows you to choose the required data for your WooCommerce Tooltip.

* Choose required Data in the dropdown.

![](https://lh4.googleusercontent.com/g6MpUmptsNFkN4PeyqLhFFEM1YUz2kH1TofJkGXbD_QmsrhL6F6yaoEvrzKMdIDKB2L7s_e9hND1ErgUxpKWJdzGBE9s5Gc7piNJKSWz-A1EP6vtdAmesW1helSLwwmFZNUGhZlCrRYJP0WviMDBjNE)

## Placement

The placement property allows you to select where you want the Tooltip to appear in relation to your Mouse. These include variations on top, right, left and bottom.

![](https://lh5.googleusercontent.com/CXbM6p_9DvyqsA1X_3171D1Hw3XgFkBpgwdQPs5Fp4-xXBklsY4K_fxaLRQ_LzJzbNRauc3ekxowVhwRoP7gMpLo-5fY3MBpY6IDgtPPhPllHXKBfiIzqdfLbJIarwETOivLrBliXQedTI3Lwcmcgow)

## Theme

Allows you to choose your Tooltip's theme, which means the way it looks.

{% hint style="info" %}
The Tooltip has a default theme applied.
{% endhint %}

You can choose from several preset Tooltip Themes (light, translucent, material...)

* Choose required Theme in the dropdown.

![](https://lh4.googleusercontent.com/bmn3VsyK8Nie1GuSOeGbVyDzIruhChw4XrUPFLlwo93GUXIrrE5aCnsLUQPGr_zPTWh1Lezruocc85JfcnY-TlIFXhi_awDCqyzTWcjwkFYcyLS-5skbJSOMbzBtFi8PWgmdCTvd7U8GRWU44vBlsOg)

* For example, if we set Theme to Translucent.

<figure><img src="https://lh6.googleusercontent.com/WOt030h-fxXAktLLuDqscOr_flaa22SQFqC9Y_ZNKb7L-LBtJYcFA6cQHESVx0k4tUfEeQAwGOSGWCeMgS1qZdOX7bZUFOjtRGzpcH0650IOM0pu_iiPEzrRZfEBYxAb57Jn0xvUvACkIcCfxWtFsS4" alt=""><figcaption></figcaption></figure>

* A translucent effect is applied to the Tooltip.

<figure><img src="https://lh4.googleusercontent.com/sS7tzfT-rz1DbUqgdfgN4tDxNy51tbCw4TYSnOF1TfUVvPPyZwVfSA1uNgU5q96S8ducFtSsRIiQ_Ie2AuUezuFTk0e-uihfD_HleKW6RdgZr8r-bQGBzVciBTLB9CV-bkgxxq3ak6UAHSXgNkm0VVI" alt=""><figcaption></figcaption></figure>

## Animation

The Animation property allows you to add an Animation to your Tooltip.

* Select required Animation in the dropdown.

![](https://lh6.googleusercontent.com/Hr0RTH_8790vghJc0RX4bGMz4lZeNc8C4-f6_Up8PR4GSD68iRrRcc1nz1yt-3I3S_vhj0xpkogZt5zK2-MquCk8kS5D7bk361cNto_AkitNgA19CrhkZgwi-0PAUi-LpE-LHQAG5nT_mo0ob4_x9EI)

## Follow

The Follow property allows you to choose whether and how the Tooltip should follow the mouse or pointer.

* Set Follow to required option in dropdown.

![](https://lh5.googleusercontent.com/uu4d0QZls8hEKAO9_7DUpKaxDwy7UWCkbYDv8lt4VM4dWD0vR_pgJOlW5yWIIzHUrPXzeNfKyjIi1dXSu-E1Ir_fR_8B9UJvf9oHkMMtYHrkgGfa5hZJWMZ66RMfovZBdFgBmWbfy51_NHAKrgrqlVQ)

## Duration

The Duration property allows you to set how long you wish the animation to last.

![](https://lh4.googleusercontent.com/5HBuzFUU54bY7MAJqONXaLbDi4vS9_U3q8Xutq1jXowEhjiuDcFeS-qvckF-WG-xCjNnM13sgfmKwMVVXPBpPMCQqq5cTO1fbsElBXWXBKeCF77p6r6tku1VlcQN4zvAvz1DBFs4hhpVPXhuMXa3fGU)

## Delay

The Delay property allows you to. set a delay before the Tooltip appears.

* Set Required delay.

![](https://lh6.googleusercontent.com/9_sNxEXJBUeu7GK46-8H6X7TVb4cazr1Jb6wM_QesGK_GYnGm_Ha6r4tpNA-qtyerWZhaKemqJxdUCNTR32Q1SCoL4eYXUUsbm9odlT-xBjjsK3xGrxhzNtSEWDQHAaWwVVfheXFMfKtSSU3doii5WQ)

## Arrow

The Arrow property, really more like the tail on a speech balloon, allows you to add a pointer to the Tailtip to allow you to better see which element it is referring to.

{% hint style="info" %}
The Arrow will appear in the position set in Placement.
{% endhint %}

* Toggle Arrow as required.

![](https://lh5.googleusercontent.com/DNJxKvyYGpmsX6cBWX-Xa_C-kA3KMAS2SIWFYvlRW7WRkzEkrP8sRVgXOXTlrkbo41N_qBbQ74AMGpX88Fa3zkWduwPRYhzQLaHjWLQpCUg4-G_HCiW8DmWIGHe99_aDv-bP_1fUB59em5LBVmkMTbM)![](https://lh5.googleusercontent.com/P9AEIhT_QMViwSJ9d7B2OLM5GJOjNtRW2etIHpz4Szz-wFn7mT0kQ3SOwBjI9xA38VYlJix9ymaVr6R47YWqnXENU2Hht7_Y4FOCqGd3kOhZkIkxSRMNgpvIJAd0-oOvLZpYSim_5_qs4zRkJiAd5ro)

## Hide on Click

The Hide on Click property allows you to hide the Tooltip when you click.

{% hint style="info" %}
The Tooltip will disappear with the same Animation you have set.
{% endhint %}

* Toggle Hide and Click as required.

![](https://lh4.googleusercontent.com/-aDXOjyXfiPLg6vVCgBCKBjTftIpxMCIfW_rcFDirKMwOsCUsuRQ456HYJL-b-GBxla0543tlU0D2CQMipbhfllOyVWvEBQFhattZ7WVDGFu42yUFCx_0KOzLLcR8Z_krCq7CDHgcQE2-rNpD9zhn90)


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://docs.cwicly.com/advanced/tooltip/source.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.
