-
AuthorPosts
-
August 2, 2022 at 6:25 pm #1360341
Hi, I have designed a set of icons, how do I upload these icon, and how do I access them in then design.
Alan ;)
August 3, 2022 at 4:02 am #1360389Hi Alan,
Is it in webfont format? (file types: .eot, .svg, .ttf, .woff, and .woff2)
If yes, then you can go to Enfold > Import/Export > Iconfont Manager, then upload the fonts in zip form, for further information you can check our documentation: https://kriesi.at/documentation/enfold/icon/#adding-your-own-fontello-or-flaticon-icons-
Also, you can try to download icons in https://fontello.com/ and see the format.Best regards,
NikkoAugust 4, 2022 at 10:24 am #1360586Hi Nikko,
Ok, but I need to upload and use my own designs.
I have a set of 7 icons saved as svg, in a zipped folder, but I can not add them to enfold.
How are they added to EnfoldAlan ;)
August 4, 2022 at 4:30 pm #1360659are your svg’s monochrome black?
then go to fontello.com – and drag&drop the svg’s to the input field on top of that page.
give a name to your set and download the zip from there. this zip upload to enfold.if fontello got some error warnings – f.e. on compound path – this little detour can help: https://kriesi.at/support/topic/custom-icons-showing-blank/#post-1357932
if not ( multicolor svg’s) we had to find a different solution.
August 6, 2022 at 2:23 am #1360873Hi Alan,
Please follow @Guenni007’s suggestion :)
@Guenni007 thanks for helping out :)Best regards,
NikkoAugust 8, 2022 at 3:04 pm #1361126Hi, that´s not a useable way for me, the design changes to one color design and no fill color, I need colors to make my design work
August 8, 2022 at 4:01 pm #1361130did you read further on: https://kriesi.at/support/topic/ajout-dicones-dans-enfold/#post-1356658
you can upload your svg files to media-library and replace existing font-icons. So you can use the enfold insertion of font-icons – and replace them by css:
f.e. with an unimated svg or gif: https://webers-testseite.de/
webdesing columnafter my posting i recognized that some icons are in span etc. you had to adjust the replacement code then
[data-av_icon="\e837"] { content: " "; background-image: url(/wp-content/uploads/ezgif-4-64b6614e32.gif); background-size: contain; background-repeat: no-repeat; font-size: 0 !important }
_______
Yes – it’s a bit of work, but it’s worth doing this way.
You convert your colored svgs in icomoon app to black svgs – upload them to fontello and then import them into Enfold. Then you replace the black pendents with the colored svgs via css. Then you have the advantage to use these colored icons like font-icons everywhere where they can be positioned in Enfold Alb elements.and btw. if you only like to have colorized icons f.e. with gradient:
( You need to be more specific with this selector here – to not address all icons on the page )[data-av_icon]:before { background: linear-gradient(135deg,rgb(74,234,220) 0%,rgb(151,120,209) 20%,rgb(207,42,186) 40%,rgb(238,44,130) 60%,rgb(251,105,98) 80%,rgb(254,248,76) 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-stroke: 0px blue; /*** you even can have strokes on the icons ***/ -webkit-text-fill-color: transparent; }
for example: https://enfold.webers-webdesign.de/colorized-font-icons/
i named the svgs analog to the code the black icons have on the fontello font -
AuthorPosts
- You must be logged in to reply to this topic.