I use 2sxc 11 and want to use the Material Icons.
I have the Woff, Woff2 and TTF files but I dont get the icons to pick.
My thought is that it doesn't work because Material does not work with unique classes but a string in the tag.
Is there a way to configure this so I can use the Font Icon Picker?
I don't see any issues - this should work IMHO.
An important detail to note: the icon-picker scans the CSS file for the classes it should provide/show, and this only works if the CSS file is loaded from the same domain. So the WOFF can be loaded externally, and the css for the page itself can also come from google etc. but for the icon picker to work, you need a css file on the same domain (usually in the same app).
That's a security limitation in js/css.
Related
I have been surfing through the sites looking for a way to add my custom css font icons for my own application.
I have uploaded the css file in the workspace static files, and put the url in Shared Components\ Themes \ Icons \ Custom Library File URLs.
Please show my how to used my custom css font icons, for I don't want to upload images or so.
Depends on your version, but Maxime has an example here describing how to import Font APEX library for APEX 5.0
http://max-tremblay.blogspot.com.au/2017/02/using-font-apex-in-apex-50.html
You're chasing attributes in the theme settings.
Fonts like Wingdings render letters as a variety of symbols. If you look at some font websites likes dafont, you can see a lot of symbol fonts. Download the font file (ttf) and convert it to woff using some converter tool / websites like convertio. You may refer this stackoverflow question to get an idea about its usage in CSS.
Hope this helps.
Here is my Wordpress website : http://vps319156.ovh.net/
The icons are not displaying correctly since I upload a new plugin Visual line for Visual Composer.
I desinstalled the plugin and try to reinstall the font but it did not work.
The weird part is that I have one Icon working...
I tried many solutions from the web and could not find out one that is workable in my case..
You have the plugin font-awesome that is overriding iconfont.css definitions and so on, the [class^="icon-"].
It seems that the fontawesome related fonts are not found in the plugin font-awesome.
The plugins/font-awesome/assets/font-awesome.min.css couldn't find the font ../fonts/fontawesome-webfont.eot
Correct the path or copy the fonts file at this place.
In the browser dev tools, when you unclick fontawesome class, icons are display, it's just the enqueue priority to modify, it depends if you want to display, font-awesome icons or iconfonts.css icons.
We have Lean Symbol ttf file. We want to use that in our application. We have added that one in our application but don't know how to use it. Like other i.e. glyphicons ttf we use class for accessing its icon representation etc. How I can do w/ this?
We have LeanSymbol.ttf file. When I open it by double click I get this one http://snag.gy/Rwi9Q.jpg
We want use these icon in our application but don't know how to access that icons.
Go to ForntSquirrel's web font generator.
Upload your font.
Download your kit.
The zip that you download has all the fonts in web format and gives you some great examples of how to use them.
You might want to consider using font awesome, which is awesome.
Bootstrap also includes Glyphicons as one of their components.
Use something like font squirrel to convert the font into a web font. You can then add the generated font-face css to your stylesheet.
I uploaded the files to my server but I'm only using 5 icons in my site.
How can I delete the Font Awesome icons that I will never use? Like the useful and beautiful Stethoscope.
http://fortawesome.github.io/Font-Awesome/icon/stethoscope/
Thank you
It sounds like you copied the entire font-awesome directory into your project, and this isn't the result you are looking for. If you only want 5 of the Font Awesome icons in your project, and not have the balance of icons available for future use, take a look at Fontello.
Fontello is an icon fonts generator which allows you to pick and choose only the icon fonts you want for your project.
Here's a link to Fontello on GitHub, with information on how to use it:
https://github.com/fontello/fontello/wiki/Help
Another option you have if you only need a few icons, it's IcoMoon where you can choose the icons that are going to be loaded only including the ones from Font-Awesome.
Otherwise, check this blog that explains how to reduce font-awesome size.
If you are using javascript module imports try:
import { faCoffee } from '#fortawesome/free-solid-svg-icons/faCoffee' // <-- note the extra faCoffee there
I am looking for the cleanest way to use css font icons that match my site's preexisting icon pack instead of having to create images to use in the plugin folder.
I am open to writing custom solutions as well as using plugins.
I'm not sure if they have to match them 1 on 1, or you just want to have the same type of icons as you had, but I recently ran into and implemented font icons from fontello.com that have many existing icons and supports custom icons if really needed.