WebsiteBaker Support (2.13.x) > General Help & Support

Sanco template question - the Services icons

(1/1)

seanie_morris:
Hi,
I am playing around with the Sanco template (demo here: https://template.WebsiteBaker.org/pages/frontend-templates/demo-jbd.php?template=sanco) and I have a query about the icons in the Services section, seen in the PDF attached with this post. How are these 4 icons generated, as they don't seem to be a part of the template bundle - that is, they are not in the Sanco folder of files and images. I can edit the classes no problem, and create my own versions to bring in specific icons if I want, but where are the original ones coming from?

Seanie.

dbs:
Hi, often icons will not provided as images. It is css like fontawesome.
In your case it is from here: https://boxicons.com/
You find the css in your tempalte in vendor/css/boxicons.min.css

seanie_morris:
Is that like Wingdings where icons are used instead of letters in the font face? If so, I've never seen that in action with a website before! I thought that might be the case, that it was a font icon instead of an image like jpg/svg/png etc.
 :-)

sternchen8875:
Wingdings (win 3.1) and later Webdings (Win95 && win98) were windows-fonts for printers and desktops and you can write with this fonts and the keyboard like other PC-Fonts (Arial etc).
Wingdings or Webdings are working only with Windows and it was not possible to use it in UTF8 as fonts, but in the "good old time" we use it on pictures (for buttons etc) as background picture

30 years after Windows 3.1 we've now a better version -> Icon Fonts. All this icons using the unicode-"number" in the font-file, for example, this here \000A9 is the sign for a copyright-symbol. For a better handling and a identical style in color, size, transparence etc, there work with css and aliases instead of the unicode, in the system "BoxIcons" it is bxs-copyright für the copyright-icon. Other systems like fontawesome using a database with all the 26.000 icons on a extern server (works like google-fonts)

there are a lot of systems with iconfonts on the way, here a links with "the best" of them. I have to say, i know only Fontawesome  :-o

If you want to now, what kind of fonticons are in use on a page, take a look into the source-code, you find a code like this for a icon

--- Code: ---<i bx bx-file></i>
--- End code ---

Then search for some parts of this code in the web, for example: searching for bx bx-file. Now you've the system and you can search there for some help or examples to use the icons in your project

Navigation

[0] Message Index