Website & Blog Typostyler
Home
Info Table List Wordpress

eighteen in one font

𝓦𝓮𝓵𝓬𝓸𝓶𝓮
wix.com
The Website-Cloud.
𝔅𝔩𝔬𝔤𝔤𝔢𝔯
The eighteen in one font has the file name "FreeSerifMath.ttf" and can be downloaded here.
The file packages have included a *.sfd file to edit the font with FontForge.
Package Information Package link Filesize md5sum
FreeSerifMath.ttf in zip: FreeSerifMath.zip 471 kb 7b5dedf761e99bd3ea94d889d78d4600
FreeSerifMath.ttf in tar.gz: FreeSerifMath.tgz 491 kb fdb2b843508841bc473814cbe6f8d4c5
FreeSerifMath.ttf in 7zip: FreeSerifMath.7z 1358 kb 30fa13c255f821965a50af061884ad90
FreeSerifMath.ttf in tar: FreeSerifMath.tar 1363 kb 2c6eaad7e72254edeaf40d5af4bd8b54

Tutorial for embedding the font

Requirement: When you use the chars in plain text, the document (*.html or *.php or similar) must be saved in UTF-8 and the charset UTF-8 must be attributed with <meta charset="UTF-8">.

On Content Management Systems: Alternatively, read point 4 on this page and the Wordpress Info page.

1.) Upload the "FreeSerifMath.ttf" font file to your webhost.

For Wordpress users who can not do that, please read the wordpress info page.

2.) CSS3 @font-face rule
Paste the CSS3 @font-face rule to the top of the css stylesheet file of your website and/or blog.
CSS
@font-face {
font-family: FreeSerifMath;
src: url(https://www.example.com/path/to/the/FreeSerifMath.ttf);
}

3.1a) CSS class attribute
Use a unique specific CSS class attribute in your CSS stylesheet for the font.
CSS
.eigtheeninonefont {
font-family: FreeSerifMath;
}

3.1b) CSS class attribute
Use the unique specific CSS class attribute in your HTML code with a HTML span Tag.
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
...
<span class="eigtheeninonefont">𝕄𝕪 𝕤𝕥𝕪𝕝𝕖𝕕 𝕥𝕖𝕩𝕥 𝕓𝕝𝕠𝕔𝕜.</span>
...
</body>
</html>

3.2) HTML style attribute
You must use single quotes, when you us it not with CSS class attribute, but with a HTML style attribute.
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
...
<span style="font-family: 'FreeSerifMath';">𝕄𝕪 𝕤𝕥𝕪𝕝𝕖𝕕 𝕥𝕖𝕩𝕥 𝕓𝕝𝕠𝕔𝕜.</span>
...
</body>
</html>

Please notice: It is possible that they will not see the copied characters in their HTML editor if the font is not enabled in their HTML editor (especially in a admin area). But that is not necessary. The characters are then not displayed or just placeholder, but on the web page they are seen. The best way to fix that is, install the font on your system.

4.) Alternative HTML hexadecimal code
If the document can not be saved in UTF-8, or can not get the attribute UTF-8, or the database can not utf8mb4, then alternatively the styled text in HTML hex code can be integrated into the website or blog. The HTML hexadecimal code will be decoded in plain text by the browsers.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
...
<span class="eigtheeninonefont">&#x1d544;&#x1d56a; &#x1d564;&#x1d565;&#x1d56a;&#x1d55d;&#x1d556;&#x1d555; &#x1d565;&#x1d556;&#x1d569;&#x1d565; &#x1d553;&#x1d55d;&#x1d560;&#x1d554;&#x1d55c;.</span>
...
</body>
</html>
For Wordpress please read the Wordpress Info-Page.

5.) Database check
Commands on the command line to check the database
mysql> SHOW VARIABLES LIKE 'char%';
+--------------------------+----------------------------+
| Variable_name            | Value                      |
+--------------------------+----------------------------+
| character_set_client     | utf8mb4                    |
| character_set_connection | utf8mb4                    |
| character_set_database   | utf8mb4                    |
| character_set_filesystem | binary                     |
| character_set_results    | utf8mb4                    |
| character_set_server     | utf8mb4                    |
| character_set_system     | utf8                       |
| character_sets_dir       | /usr/share/mysql/charsets/ |
+--------------------------+----------------------------+

mysql> SHOW TABLE STATUS FROM databasename;
+------------------------+--------+...+--------------------+
| Name                   | Engine |...| Collation          |
+------------------------+--------+...+--------------------+
| wpt_commentmeta        | InnoDB |...| utf8mb4_unicode_ci |
| wpt_comments           | InnoDB |...| utf8mb4_unicode_ci |
| wpt_links              | InnoDB |...| utf8mb4_unicode_ci |
| wpt_options            | InnoDB |...| utf8mb4_unicode_ci |
| wpt_postmeta           | InnoDB |...| utf8mb4_unicode_ci |
| wpt_posts              | InnoDB |...| utf8mb4_unicode_ci |
| wpt_term_relationships | InnoDB |...| utf8mb4_unicode_ci |
| wpt_term_taxonomy      | InnoDB |...| utf8mb4_unicode_ci |
| wpt_termmeta           | InnoDB |...| utf8mb4_unicode_ci |
| wpt_terms              | InnoDB |...| utf8mb4_unicode_ci |
| wpt_usermeta           | InnoDB |...| utf8mb4_unicode_ci |
| wpt_users              | InnoDB |...| utf8mb4_unicode_ci |
+------------------------+--------+...+--------------------+

mysql> SHOW VARIABLES LIKE 'coll%';
+----------------------+--------------------+
| Variable_name        | Value              |
+----------------------+--------------------+
| collation_connection | utf8mb4_general_ci |
| collation_database   | utf8mb4_unicode_ci |
| collation_server     | utf8mb4_unicode_ci |
+----------------------+--------------------+
Support Penultima.de
PayPal Gefällt Mir Button
© Penultima.de - All rights reserved. Data protection statement & Imprint & Contact
Cookies in use.
More Infos