> For the complete documentation index, see [llms.txt](https://themessupport.gitbook.io/lollipop-theme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://themessupport.gitbook.io/lollipop-theme/sections/text-with-icons.md).

# Text with icons

Display icon-based content blocks to highlight features, services, or key information.

## How to access

1. **Go to** Shopify Admin → Online Store → Themes.
2. **Click** Customize on your active theme.
3. Click **Add section** and choose **Text with icons**.

## Section Settings

<div><figure><img src="/files/XeYdbYjqywKqffOdErFV" alt=""><figcaption></figcaption></figure> <figure><img src="/files/5ROrrFst1kE6qDUPXZKv" alt=""><figcaption></figcaption></figure> <figure><img src="/files/Hj5nw2QamXOHTqQ8wq1l" alt=""><figcaption></figcaption></figure></div>

| Setting                   | Description                                                                                                                                 |
| ------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------- |
| **Layout**                |                                                                                                                                             |
| Expand to full width      | Extends the section to the full browser width.                                                                                              |
| Color scheme              | Sets the background and text colors.                                                                                                        |
| Background opacity        | Controls the background opacity.                                                                                                            |
| **Content**               |                                                                                                                                             |
| Heading                   | Sets the section heading.                                                                                                                   |
| Heading size              | Controls the size of the heading. Choose from Small, Medium, or Large.                                                                      |
| Text                      | Adds supporting text to the section.                                                                                                        |
| Text position             | Shows the text above or below the heading.                                                                                                  |
| Desktop content alignment | Aligns the section content on desktop. Choose from Left, Center, or Right. On mobile, the content is automatically centered.                |
| **Block settings**        |                                                                                                                                             |
| Block text alignment      | Aligns the content inside each block. Choose from Left, Center, or Right.                                                                   |
| Color scheme              | Sets the background and text colors for the blocks.                                                                                         |
| Enable column background  | Adds a background to each content block.                                                                                                    |
| Enable icon background    | Adds a background behind the icon.                                                                                                          |
| Border style              | Sets the block border style. Choose from None, Vertical Border or Full Border                                                               |
| **Icon settings**         |                                                                                                                                             |
| Position                  | Sets the icon position. Choose from Above text or Default.                                                                                  |
| Style                     | Sets the icon style. Choose from Rotate or Default.                                                                                         |
| Size                      | Controls the icon size.                                                                                                                     |
| **Column settings**       |                                                                                                                                             |
| Desktop columns           | Sets the number of columns displayed on desktop. Choose from 3, 4, or 5.                                                                    |
| **Carousel settings**     |                                                                                                                                             |
| Enable carousel           | Displays the content blocks in a carousel.                                                                                                  |
| Change slides every       | Automatically changes slides after the selected number of seconds. Set to 0 to disable autoplay.                                            |
| Gap                       | Controls the spacing between content blocks.                                                                                                |
| Pagination                | Sets the carousel navigation. Choose from Dots, Arrows, or None.                                                                            |
| Pagination style          | Sets the pagination style. Choose from Classic or Modern.                                                                                   |
| **Section padding**       |                                                                                                                                             |
| Top side                  | Space above the section.                                                                                                                    |
| Bottom side               | Space below the section.                                                                                                                    |
| **Section divider**       |                                                                                                                                             |
| Shapes                    | Adds a decorative divider to the section. Choose from Curve top, Curve bottom, Curve both, None, Border top, Border bottom, or Both border. |

## Blocks

Add blocks to this section in the theme editor. Each block is a separate item you can add, remove, and reorder.

### Icon

Displays an icon with supporting content.

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

| Setting      | Description                                                            |
| ------------ | ---------------------------------------------------------------------- |
| **Icon**     |                                                                        |
| Svg icon     | Selects an SVG icon.                                                   |
| Image        | Selects an image to replace the SVG icon.                              |
| **Content**  |                                                                        |
| Heading      | Sets the block heading.                                                |
| Heading size | Controls the size of the heading. Choose from Small, Medium, or Large. |
| Description  | Adds supporting text to the block.                                     |