---
title: "WYSIWYG element"
date: "2017-11-12T09:02:06+00:00"
summary: "Create engaging, formatted content with Site Studio's WYSIWYG element. Easily add text, images, and custom styles using the intuitive CKEditor interface. Perfect for marketers and content editors looking to enhance their layouts."
image:
type: "page"
url: "/drupal-starter-kits/add-ons/site-studio/wysiwyg-element"
id: "bad42ecd-44b1-4976-997a-8d07cb1fe8f1"
---

Table of contents will be added

Use the WYSIWYG element to add formatted content to your layout using CKEditor.

Important

Only common settings are shown by default. To access additional settings, click on the **Properties** button and select the additional settings.

Locating the WYSIWYG element
----------------------------

To find the WYSIWYG element:

1.  Navigate to a component or a template with the Layout canvas
2.  Click the **+ button** on the Layout canvas
3.  Within the Elements tab, look for the WYSIWYG element.

![8995a5dd-wysiwyg.png](https://acquia.widen.net/content/2f25de19-ffa0-41ef-be96-89067514dec7/web/8995a5dd-wysiwyg.png)

The WYSIWYG element includes the following fields:

Editor
------

*   **WYSIWYG text editor -** A rich text editor for formatting text and image content. For more information, see [Editing content with the WYSIWYG.](/drupal-starter-kits/add-ons/site-studio/editing-content-wysiwyg "Editing content with the WYSIWYG")

Style
-----

*   **Style -** Select a Layout custom style. This is applied to the wrapping container <div> of the WYSIWYG content.

Match heights
-------------

*   **Match heights** \- Match the height of the element using:
    *   **None** - Removes the match heights at the specific breakpoint
    *   **Class** \- Match the height of the element with another element with the same class name.

For more information on Match heights, see [Match the heights of elements.](/drupal-starter-kits/add-ons/site-studio/match-heights-elements "Match the heights of elements")

Comments
--------

*   **Add comments -** Add comments to the Element.  For more information, see [Adding comments to an element](/drupal-starter-kits/add-ons/site-studio/adding-comments-element "Adding comments to an element").