# Html Text

The html text allows you to pair an image with descriptive content, making it ideal for showcasing **products, promotions, or brand messages**.

{% hint style="success" %}

* Go to **Shopify Admin > Online Store > Themes.**
* **Click** Customize on your live theme.
* In the theme editor, **Click** **Add Section > Html text**.
  {% endhint %}

<figure><img src="https://content.gitbook.com/content/Ev2WNRGAi9vhOPUSGibm/blobs/10J62dk1ZTGT97f4sHGp/html%20text.jpg" alt=""><figcaption></figcaption></figure>

* **Show Full Width:** Expands the featured collection section across the entire screen width.
* **Enable Right & Left Spacing (Works only on Fullwidth):** Adds spacing on both sides (Works only in Full Width mode).
* **Style Value (Padding ) :** Adjust the inner spacing above and below the section. Top(px), Bottom(px).
* **Style Value (Margin ) :** Adjust the outer spacing above and below the section. Top(px), Bottom(px).
* **Enable Background Image:** Allows adding a background image for the section.
* **Background Image:** Upload the image (Recommended size based on design requirements).
* **Background Style:** Choose background style **( Fixed, Parallax, or None )**.
* **Background Size:** Choose background size **( Auto, Cover, Contain, Repeat)**. This will not apply for parallax.
* **Enable Background Color:** Enable a background color (Also used as an overlay color).
* **Background Color** : Customize the background color (Set Your Preferred Color).
* **Overlay Transparency:** Adjust the transparency of the overlay (Value between 0.01 and 1).
* **Main Heading:** Customize the Main heading.
* **Sub Heading:** Add a short text to the content.
* **Description:** Add text to share information about the collection.
* **Link Text:** Customize the text for the clickable link.
* **Link URL:** Paste a URL or search for an internal link.

### **Section Color Settings**&#x20;

* **Heading Color:** Customize the heading color (Set Your Preferred Color).
* **Sub Heading Color:** Customize the sub-heading color (Set Your Preferred Color).
* **Description Color:** Customize the description text color (Set Your Preferred Color).
* **Button Background Color:** Customize the button background color (Set Your Preferred Color).
* **Button Text Color:** Customize the button text color (Set Your Preferred Color).
* **Button Hover Background Color:** Customize the hover background color for buttons (Set Your Preferred Color).
* **Button Hover Text Color:** Customize the hover text color for buttons (Set Your Preferred Color).
* **Heading position** : Choose heading positio&#x6E;**( Left, Right, Center )**.
* **Add Your Html text here :** Add custom liquid code directly in the editor.

#### **Advanced Customization** <a href="#advanced-customization" id="advanced-customization"></a>

* [**Custom Class:**](https://wdtsupport.gitbook.io/shopify-os/custom-class) The Shopify allows you to apply unique CSS styles to specific sections, blocks, or elements within your theme.
