> For the complete documentation index, see [llms.txt](https://docs.pixeleyes.de/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.pixeleyes.de/anleitungen-instructions/english/documentation-of-our-shopware-6-plugins/forms-manager-for-shopware-6/integrate-the-form-into-the-experience-world.md).

# Integrate the form into the experience world

You can then integrate the forms you created into a world of experiences. See also <https://docs.shopware.com/de/shopware-6-de/Inhalte/Erlebniswelten>&#x20;

{% hint style="info" %}

```
Only publish an experience with a form 
if this form is completely configured 
and has the following points:
```

```
A form field must be set as email
A form field must be set as the subject
At least one form field (not an email or subject field) must be included
```

{% endhint %}

On the right you will find a new entry **“Form Manager”** and **Form Manager Links** in the block category.<br>

### Variant Form Manager

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

If you select this, a preview image will be displayed below. You can then place it on the experience world or stage by dragging and dropping it.

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

By clicking on the placed element, you can edit it by clicking on the gear

<figure><img src="/files/W77P7dxue2KgIzZtbt45" alt="" width="375"><figcaption></figcaption></figure>

The following window opens. Then select the form you want to create

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

### Variant Forms Manager Links

When you select this entry, a preview will appear below. You can then place them on the experience world or stage by dragging and dropping them.

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

By clicking on the placed element, you can edit it by clicking on the gear&#x20;

**Headline:**&#x20;

Heading to be displayed in the experience world&#x20;

**Description:**&#x20;

Description to be displayed in the experience world&#x20;

**Select the desired form:**&#x20;

Here you can select the form you want&#x20;

**Type of execution:**&#x20;

**Modal:**&#x20;

With the modal, a modal or popup window opens with the form.&#x20;

**New window / link:**&#x20;

In this variant, the link to the form is executed&#x20;

**Open in a new window:**&#x20;

If you have selected "New window" under Type of execution, you can also set that when you click on the button, the form opens in a new window or browser tab.

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

**Button type:**&#x20;

Here you can set the button style of the button.&#x20;

See <https://getbootstrap.com/docs/5.0/components/buttons/&#x20>;

**Button size:**&#x20;

Size of the button, see <https://getbootstrap.com/docs/5.0/components/buttons/> under Sizes

&#x20;**Button text (of the form)**&#x20;

Text of the button below the description&#x20;

**Vertical orientation**&#x20;

This setting determines how the elements should be placed within the CMS element.&#x20;

**Type of (form) heading:**&#x20;

Select your desired type of headline here.&#x20;

You can select the following HTML elements:

H1, H2, H3, H4, H5, H6 or various.&#x20;

See <https://getbootstrap.com/docs/5.0/content/typography/#headings>&#x20;

**Text alignment:**&#x20;

Choose whether the heading and description are displayed left-aligned, right-aligned or centered&#x20;

**Button alignment:**&#x20;

Choose whether the button is displayed left-aligned, right-aligned or centered&#x20;

**Title color:**&#x20;

Set the heading text color&#x20;

**Color of description:**&#x20;

Set the text color of the description Additional CSS class: Setting your own CSS class

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

{% hint style="info" %}
Save the experience and clear the cache if necessary
{% endhint %}
