I have developed my own website that functions similar to fontawesome. However, after uploading it to an online server, I encountered a problem where others are unable to use my custom font icon.
In order for someone to utilize the font icon from my website, they need to link the CSS font like so:
<link rel="stylesheet" href="https://example.com/some-icons/icons/css/font.min.css">
People are facing issues when trying to add my website's font icon to their projects.
On the other hand, if someone downloads my font icon and uses it as a local file, it works perfectly fine. More information here
I have provided the CSS code below to showcase how you can define the font face of my custom font icon:
@font-face
{
font-family: 'font';
font-weight: normal;
font-style: normal;
src: url('../fonts/font.eot');
src: url('../fonts/font.eot') format('embedded-opentype'),
url('../fonts/font.woff2') format('woff2'),
url('../fonts/font.woff') format('woff'),
url('../fonts/font.ttf') format('truetype'),
url('../fonts/font.svg?#font') format('svg');
}
.font
{
font-family: 'font' !important;
font-weight: normal;
font-style: normal;
font-variant: normal;
line-height: 1;
text-rendering: auto;
display: inline-block;
text-transform: none;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
We need to find a solution so that anyone can easily use font icons from our website just like fontawesome. How can we enable font icon SVG files with .htaccess?
RewriteEngine on
RewriteCond %{THE_REQUEST} /([^.]+)\.php [NC]
RewriteRule ^ /%1 [NC,L,R]
RewriteCond %{REQUEST_FILENAME}.php -f
RewriteRule ^ %{REQUEST_URI}.php [NC,L]
Options All -Indexes
<IfModule mod_headers.c>
<FilesMatch "\.(svg|ttf|ttc|otf|eot|woff|woff2|font.css|css|js)$">
Header set Access-Control-Allow-Origin "*"
</FilesMatch>
</IfModule>