Hi there!
Is there a way to replace icon circles with images?
I would like to use different logo images instead of icons.
Regards
Santiago
Hi Santiago,
There’s a way but it would require some CSS code.
Here’s how you can do it:
1. Edit the icon circle, then go to Advanced > Developer Settings > Custom ID Attribute, then put my-icon-circle (you can change this with any name you like but you will need to change the id of the CSS code).
2. Go to Enfold > General Styling > Quick CSS and add this CSS code:
#my-icon-circle .avia-icon-circles-icon:before {
display: none;
}
#my-icon-circle .avia-icon-circles-icon {
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
#my-icon-circle .avia-icon-circles-icon-1 {
background-image: url(https://website.com/wp-content/uploads/2023/03/logo1.png);
}
#my-icon-circle .avia-icon-circles-icon-2 {
background-image: url(https://website.com/wp-content/uploads/2023/03/logo2.png);
}
#my-icon-circle .avia-icon-circles-icon-3 {
background-image: url(https://website.com/wp-content/uploads/2023/03/logo3.png);
}
just change the background image url with the correct image url, if you use more than 3 logos/images then just follow the pattern and copy the last part of the code and replace 3 with 4.
I hope this helps.
Best regards,
Nikko
Thanks Nikko!!!