Tagged: icons
-
AuthorPosts
-
December 8, 2024 at 11:16 am #1473175
Hi,
I´ve tried to upload the icons to iconmoon, download and re-upload it to fontello. But this is still not working.
The css code from this thread is not working too.
Could you please check it on my website what is going on?
Thank you in advance.
December 8, 2024 at 1:48 pm #1473180December 9, 2024 at 2:37 pm #1473241This reply has been marked as private.December 9, 2024 at 5:59 pm #1473269Hi,
For the css, each icon has a different code number, for your shield with the check mark it is \e802div[data-av_icon="\e802"] { content: " "; background-image: url(/wp-content/uploads/2024/12/Goering_Icon1_eCheck_farbig_RGB.png) !important; background-size: contain; background-repeat: no-repeat; font-size: 0 !important }
I adjusted your css and now it works.
Please review the thread on how to find the icon code:
Best regards,
MikeDecember 10, 2024 at 1:05 pm #1473333This reply has been marked as private.December 10, 2024 at 3:56 pm #1473364i guess you have that warning on uploading your icons to fontello about compound path.
you can edit your vector based icon f.e. in illustrator – open your svg and look at Object Menu – Compound Path – create
i hope that this will be the names – because i’m working on german versions : Objekt – zusammengesetzter Pfad – erstellen.Working with Pathfinder is not enough. You had to go that way.
________
Mikes Way is to substitute an existing entypo-fontello icon by an image. Big advantage – you can use the icon font to insert even colored svg icons.
see here: https://enfold.webers-webdesign.de/colorized-font-icons/December 11, 2024 at 8:30 am #1473394Hi,
How can I place the icon in the middle?
Make sure the background-position is set to center center, and adjust the value of the background-size property if you need to reduce the size of the images.
Example:
div[data-av_icon="\e804"] { content: " "; background-image: url(/wp-content/uploads/2024/12/Goering_Icon5_eKey_farbig_RGB.png) !important; background-size: 50%; background-repeat: no-repeat; font-size: 0 !important; background-position: center center; }
Best regards,
IsmaelDecember 11, 2024 at 9:05 am #1473397This reply has been marked as private.December 11, 2024 at 9:29 am #1473405Hi,
The modifications made in the Quick CSS field should be preserved after an update. You don’t need to add it again.
Best regards,
IsmaelDecember 11, 2024 at 9:45 am #1473410This reply has been marked as private.December 11, 2024 at 11:56 am #1473419Hi,
Thanks for the update. Please let us know if you should need any further help on the topic, or if we can close it.
Best regards,
RikardDecember 11, 2024 at 5:17 pm #1473440This reply has been marked as private. -
AuthorPosts
- The topic ‘add custom icon’ is closed to new replies.