> For the complete documentation index, see [llms.txt](https://supportcenter.creatorlink.net/creatorlink-support-center/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://supportcenter.creatorlink.net/creatorlink-support-center/create-a-site/editing-blocks/text-block/using-add-button.md).

# Using add button

You can insert an image, video, table, button, and division lines into the text box by using the add button.

1\. Click the **empty text line** in the text box to activate the **add** button.

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

2\. Click the **add** button.

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

3\. Click the option you want to use.

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

**\[Details of the options]**

1\. **Image**

You can upload images from the **IMAGE LIBRARY** like image, gallery, and content blocks.

<figure><img src="/files/8YQSnvXdxNOgBXgRn7mB" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/1fXy6fWEYX9BgnEvcIWR" alt=""><figcaption></figcaption></figure>

&#x20; 1\) **Change Size**: Change the size of the image by modifying pixels. You can change the size by dragging the edge of the image.

&#x20; 2\) **Replace Image**: Change the image into another image.

&#x20; 3\) **Display**

&#x20;   a. **Inline**: The images are arranged in the same way, as the text is sorted.&#x20;

&#x20;   b. **Break Text**: The image is centered on a row of spaces between the paragraphs.

&#x20; 4\) **Style**: Set 3 types of image effects (Rounded, Bordered, Shadow). Then, effects can be overlayed.

&#x20; 5\) **Link**: Link the URL to the image.

&#x20; 6\) **Enter**: When you click the icon, line feed under the image.

&#x20; 7\) **Delete**: Delete the image.

2\. **Video**

You can embed a video on your website by copying and pasting the video link. \
Video links from **Youtube, Vimeo, Sound Cloud, Kakao tv** are available.

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

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

&#x20; 1\) **Change Size**: Change the size of the video. You cannot change the pixel, but you can modify the size by dragging the edge of the video.

&#x20; 2\) **Replace Video**: Change the video into another video

&#x20; 3\) **Display**

&#x20;   a. **Inline**: The videos are arranged in the same way, as the text is sorted.

&#x20;   b. **Break Text**: The video is centered on a row of spaces between the paragraphs.

&#x20; 4\) **Enter**: When you click the icon, line feed under the video.&#x20;

&#x20; 5\) **Delete**: Delete the videos.

3\. **Tabel**

You can create tables as you want.

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

* **Table Settings-When you insert the table**

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

&#x20; 1\) **Column, Row**: Specify the number of cells for each.

&#x20; 2\) **Style**: Select the table design.

&#x20; 3\) **Customize**: Make your design.

* **Table Settings-After inserting the table**

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

&#x20; 1\) **Column, Row**: Add or delete the cell as you want based on the selected cell.

&#x20; 2\) **Cell**: Merge or split the specified cell.

&#x20; 3\) **Color**: Change the color of the line.

&#x20; 4\) **Horizontal Align**: Align the text left, center, and right.

&#x20; 5\) **Vertical Align**: Align the text-top, middle, and bottom.

&#x20; 6\) **Line Width**: Change the width of the line.

&#x20; 7\) **Border Style**: Change the style of the border.

&#x20; 8\) **Enter**: When you click the icon, line feed under the table.

&#x20; 9\) **Delete**: Delete the table.

4\. **Button**

You can create buttons as you want.

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

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

&#x20; 1\) **Link**: Apply the URL that you want to move when you click the button.

&#x20; 2\) **Button Color**: Change the color of the button. You can change the text in the button by dragging the text and using the text editor.

&#x20; 3\) **Button Radius**: Change the edge of the button into a round.

&#x20; 4\) **Line Width**: Change the width of the line.

&#x20; 5\) **Button Align**: Align the button-top, middle, and bottom.

&#x20; 6\) **Button Padding (Horizontal/Vertical)** : Set the horizontal/vertical paddings to the button. It means that you can modify the button size.

&#x20; 7\) **Button Copy**: Duplicate the button with the same design.

&#x20; 8\) **Enter**: When you click the icon, line feed under the table.

&#x20; 9\) **Delete**: Delete the button.

5\. **Insert HR**

You can create a HR for the design you want.

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

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

&#x20; 1\) **Change Length**: Modify the length by dragging the end of the line.

&#x20; 2\) **Line Color**: Change the color of the line.

&#x20; 3\) **Line Width**: Change width of the line.

&#x20; 4\) **Align**: Align the lines left, center, and right.

&#x20; 5\) **Margin**: Modify the margin-top/bottom of the line.

&#x20; 6\) **Enter**: When you click the icon, line feed under the table.

&#x20; 7\) **Delete**: Delete the line.

{% hint style="info" %}
**NOTICE**

* <mark style="background-color:blue;">**Adding or moving text boxes is not possible in the block.**</mark>
* If you arrange the text with the spacebar and enter, it may look different on the mobile.
* The text may look different as you wanted, depending on the mobile devices.
  {% endhint %}
