Debut theme - add image icon in rich text section

Store Design
1

Hello! Does anyone know how to add a small image icon next to the title? I’ve included a screenshot of where I would like to add the icon (highlighted in yellow).

Capture.PNG
Capture.PNG1626×741 60.7 KB

2

Hi @bw-cn

This is PageFly, I would love to provide the solution to this issue, please send the page URL here so I can check, thank you.

3

@PageFly-Victor

https://briowell.com/pages/ingredients

Thanks for your help!

4

Hi @bw-cn

This is PageFly. Please add the code below

.text-center h2{
	position: relative;
}
.text-center h2:before {
    content: "";
    width: 15px;
    height: 15px;
    position: absolute;
    background-image: url(https://www.flaticon.com/svg/static/icons/svg/16/16410.svg);
    top: 50%;
    transform: translateY(-50%);
    left: -20px;
}

and follow this path to add the code

Themes => edit code => asset =>theme.css
and add this code to the bottom of the theme.css file

If you want to add another icon, you just need to replace this link https://www.flaticon.com/svg/static/icons/svg/16/16410.svg with your link.

Hope my answer helps you. If you find it helpful, just like it or give it a thumb up. Let me know if you need help

PageFly.

5

@PageFly-Victor

This is very close to what I’m trying to do. Do you know how to make each icon a different image?

Thank you!!!

6

Thanks for the update and quick reply.

7

Hi @bw-cn

As I mentioned in my previous answer, if you want to replace an icon by an image, you just need to replace the link URL

url(https://www.flaticon.com/svg/static/icons/svg/16/16410.svg)

If you want to change to any image, you can send me so I can write the code for you. Give my answer a like if you find it helpful.

PageFly.