# How to Add Free Text to Your Page ?

**<span style="color: rgb(186, 55, 42);"><span style="color: rgb(0, 0, 0);">Through this document , you will uncover the 'Text' feature properties in site editor page through these key elements:  
  
[1. Adding a Free Text](https://kb.salerise.com/link/15#bkmrk-adding-heading)  
[2. Feature Settings Window](https://kb.salerise.com/link/15#bkmrk-feature-settings-win)  
[3. Style Settings Window](https://kb.salerise.com/link/15#bkmrk-style-settings)</span></span>**

### <span style="color: rgb(186, 55, 42);">**Adding a Free Text**</span>

- Drag the text icon from the available features


[![image.png](https://kb.salerise.com/uploads/images/gallery/2023-11/scaled-1680-/hkrimage.png)](https://kb.salerise.com/uploads/images/gallery/2023-11/hkrimage.png)

- Drop the text icon into the desired location on your website page

[![image.png](https://kb.salerise.com/uploads/images/gallery/2023-11/scaled-1680-/p99image.png)](https://kb.salerise.com/uploads/images/gallery/2023-11/p99image.png)

### <span style="color: rgb(186, 55, 42);">**Feature Settings**</span>

<span style="color: rgb(186, 55, 42);"><span style="color: rgb(0, 0, 0);">Once the text icon is activated, you can start entering your desired text directly into the text field. And upon entering text, a feature settings window will appear, providing options for customization.</span>  
</span>

[![image.png](https://kb.salerise.com/uploads/images/gallery/2023-11/scaled-1680-/CJ5image.png)](https://kb.salerise.com/uploads/images/gallery/2023-11/CJ5image.png)  
  
<span style="color: rgb(0, 0, 0);">This window includes : </span>

- <span style="color: rgb(0, 0, 0);">**Customize Font:** In the feature settings, customize your text by selecting from various font families, adjusting font sizes, and choosing different headers.</span>
- <span style="color: rgb(0, 0, 0);">**Text Alignment:** Modify the alignment of your text as needed, whether it's left-aligned, center-aligned, right-aligned, or justified.</span>
- <span style="color: rgb(0, 0, 0);">**Lists:** Utilize numbered and bullet lists to organize your text content efficiently.</span>
- <span style="color: rgb(0, 0, 0);">**Insert/Edit Links:** Add hyperlinks to your text by using the insert/edit link option, allowing users to navigate to external pages or resources.</span>
- <span style="color: rgb(0, 0, 0);">**Remove Links:** If needed, easily remove any existing links within your text.</span>
- <span style="color: rgb(0, 0, 0);">**Subscript and Superscript:** Apply subscript or superscript formatting to specific text elements for a more dynamic presentation.</span>
- <span style="color: rgb(0, 0, 0);">**Text Color:** Customize the color of your text to match your website's design or emphasize specific information.</span>
- <span style="color: rgb(0, 0, 0);">**Background Color:** Enhance the visibility of your text by adjusting the background color to create a visually appealing contrast.</span>
- <span style="color: rgb(0, 0, 0);">**Special Characters:** Access a range of special characters to enhance the richness of your text content.</span>
- <span style="color: rgb(0, 0, 0);">**Additional Features:** Explore other available features to further enhance your text, ensuring a comprehensive and polished appearance.</span>

### <span style="color: rgb(186, 55, 42);">**Style Settings**</span>

**Design Features**

- Access the "Design" feature to customize your text appearance. Within this feature, you can determine the following properties:
    
    
    - **Margin**: Set the spacing around your text to control its placement on the page.
    - **Border**: Define a border for your text to add a distinct visual element.
    - **Color**: Choose the color that best complements your website's theme or design.
    - **Style**: Apply different styles to your text, enhancing its visual appeal.
    - **Gradient**: Add gradient effects to your text for a more dynamic and modern look.

**Background Features**

- Navigate to the "Background" feature to enhance the backdrop of your text.  
      
    
    - **Upload Images**: Insert images as a background for your text, providing visual interest.
    - **Sample Images**: Explore pre-loaded image samples for quick and easy background selection.
    - **Background Styling**: Customize the text background further with options like:
        
        \- Background Repeat: Control how the background image repeats.  
        \- Background Fill: Adjust how the background fills the space around the text.  
        \- Background Position: Define the positioning of the background image for optimal display.

**Style Customization**

- Within the "Style" section, further refine your text presentation by adding classes from a dropdown list with a plethora of options
- Determine how your text is visible on devices (Mobile , Tablet , Desktop , Large desktop)

<iframe allowfullscreen="allowfullscreen" height="435" src="https://www.youtube.com/embed/Y9J8rZHs8k8?feature=shared" width="776"></iframe>