Hey to all,
i am just curoius how you guys integrate selfmade icons (SVG etc.?) everytime i use them they take time in loading or do not really function when i change colour (or source) with the conditions.
Are there any best practices? I did not see anything over the years?
(And no i do not want to take the icons that are in the plattform - this thread is about individuell icons made by a designer specific to the plattforms.)
Thanks :)))
Hi there!
@buero
I remember reading a really helpful post on the forum about using option sets for SVG icons in the past. It’s a great technique because it ensures all icons are loaded upfront, solving any delay issues.
Basically, you create an option set and define the SVG field as text. Then, save the SVG HTML code as text and add it to an HTML element. To change the color of the icon, you can simply save all the icons with one color and then use the Find and Replace function to change it to another color.
Hope this helps! Let me know if you have any questions
So that i get this right - you do not upload the svg - you save the code as text als later load it as a pictures source?
Never heard of it - interesting.
Any security issues possible when someone tries to change the code of the svg?
You don’t add the code to a picture source, instead you simply put it in an html element.
The html element will then render the image.
Should be no issue security wise, since you do not upload anything to the server. Everything happens on the client side.
Greetings,
Indeed, what you have mentioned is correct. I have come across this topic on a forum post before, and credit goes to the user who posted it.
I usually use this method for all icons because it helps improve performance by not loading the icon font.
However, regarding the security risk mentioned in the article, it pertains to SVG files. I am not a security expert, but I recommend using trustworthy sources to minimize any potential security risks, even for tags.
I hope this information is helpful to you
