Shopify themes, liquid, logos, and UX
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).
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.
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.
This is very close to what I'm trying to do. Do you know how to make each icon a different image?
Thank you!!!
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.
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024