I'm in the process of cutting a rather nice flat HTML design into Umbraco.
Some of the service icons on the template use SVG's. I am currently using Archetype for the site to list out site services on the service page.
In the past it has been easy to select an icon i simply provide a drop down with a list of the class names for Font Awesome icons or something (let's say i choose 15 class names for icons like lightbulb, rocket etc.).
The problem is however the SVG isnt a simple class its quite complex.
Has anybody got any experience of making an SVG a "selectable" object in the back end - Even if that is just an illusion.
Id hate to stick a massive switch statement on page or something like that
Add the SVG's to the media library as files and allow the user to
select them from there, then you can add a standard img with src tag
to that file.
List item
Use Css to seta background SVG and then you can carry on using your
class method you have been using already?
If you need the actual SVG source in the page
Add a new media type of SVG with a text area to paste the SVG code
into and then add a multinode tree picker that allows only that media
type and limit to 1 item?
Add an actual content type of SVG and keep the icons in the content
tree under a "SVG icons" parent
All of these allow content management without polluting your view with a switch statement.
Selecting an SVG
Hello fellow Umbracians!
I'm in the process of cutting a rather nice flat HTML design into Umbraco.
Some of the service icons on the template use SVG's. I am currently using Archetype for the site to list out site services on the service page.
In the past it has been easy to select an icon i simply provide a drop down with a list of the class names for Font Awesome icons or something (let's say i choose 15 class names for icons like lightbulb, rocket etc.).
The problem is however the SVG isnt a simple class its quite complex.
Has anybody got any experience of making an SVG a "selectable" object in the back end - Even if that is just an illusion.
Id hate to stick a massive switch statement on page or something like that
Cheers,
J
Few ways i can think of...
Add the SVG's to the media library as files and allow the user to select them from there, then you can add a standard img with src tag to that file.
List item
Use Css to seta background SVG and then you can carry on using your class method you have been using already?
If you need the actual SVG source in the page
All of these allow content management without polluting your view with a switch statement.
Thanks
Carl
Brilliant mate, thanks for your response!
Plenty for me to work with here!
Do you mean adding Data Type of text area and name that SVG.
How would you add that to Multinode tree picker ? do you make a new Data Type , i am little confuse here.
is working on a reply...