Textpattern CMS

#1 2022-06-28 11:06:34

Gallex

Member

Registered: 2006-10-08

Posts: 1,308

CSS: Font Awesome 5 icons

hi!

could anybody tell me, why the icon f105 doesn’t show up after ‘‘EDASI’‘ (read on) link?
my site
‘‘angle-right’‘ icon from here

css:

.edasi a:after,.tagasi a:before {
font-family: 'Font Awesome 5 Solid';
font-size:inherit;
color: #444;
font-weight:900;
transition: margin 0.15s linear 0s;
-moz-transition: margin 0.15s linear 0s;
-webkit-transition:margin 0.15s linear 0s;
-o-transition: margin 0.15s linear 0s;
}

.edasi a:after {
content: "\f105";
margin-left:7px;
}

#2 2022-06-28 12:23:13

phiw13

Plugin Author

From: Japan

Registered: 2004-02-27

Posts: 3,187

Website

Re: CSS: Font Awesome 5 icons

What you see is the “unknown character” glyph.
You ask for a font Font Awesome 5 Solid but nowhere do you connect that font to a resource (font file) to display it.

@font-face {
  font-family: "Font Awesome 5 Solid"
  scr: url(path/to/font-file.woff2)
  … etc
}

Is missing. I think, I could not find it anywhere.

---

Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern

#3 2022-06-28 12:53:08

Gallex

Member

Registered: 2006-10-08

Posts: 1,308

Re: CSS: Font Awesome 5 icons

phiw13 wrote #333646:

What you see is the “unknown character” glyph.
You ask for a font Font Awesome 5 Solid but nowhere do you connect that font to a resource (font file) to display it.

font-face {…@

Is missing. I think, I could not find it anywhere.

HTML:

<link rel=“stylesheet” href=”<txp:site_url />fontawesome-free-5.4.2/css/all.css” type=“text/css” media=“screen”>

CSS here

but font-family: 'Font Awesome 5 Free'; did the trick!

Last edited by Gallex (2022-06-28 13:45:30)