Як вставити власні шрифти в шаблон
Остання актуалізація: 23.07.2024
Якщо ми створюємо власний шаблон рахунка-фактури і хочемо вшити в нього спеціальні шрифти, то можна додати їх двома способами:
Додати шрифти до файлу CSS, як описано нижче
@font-face {
font-family: 'NAZVA-SHRYFTU';
src: url('SHLYAKH-DO-FAYLU-SHRYFTU.eot');
src: url('SHLYAKH-DO-FAYLU-SHRYFTU.eot') format('embedded-opentype'),
url('SHLYAKH-DO-FAYLU-SHRYFTU.woff') format('woff'),
url('SHLYAKH-DO-FAYLU-SHRYFTU.ttf') format('truetype'),
url('SHLYAKH-DO-FAYLU-SHRYFTU.svg') format('svg');
font-weight: normal;
font-style: normal;
}
або завантажити шрифти з google fonts як зазначено нижче:
<link href="//fonts.googleapis.com/css?family=NAZVA-SHRYFTU:400,700" rel="stylesheet" type="text/css" />
Завантажений шрифт може виглядати так:
https://fonts.google.com/share?selection.family=Montserrat:ital,wght@0,100..900;1,100..900
Нам потрібно створити новий шаблон через Налаштування > Налаштування акаунта > Шаблони вибрати базовий шаблон, і на самому верху CSS додати рядки з імпортом та:
*{
font-family:'nazva shryftu';
УВАГА:
при додаванні шрифтів з власного сервера необхідно належним чином налаштувати власний сервер. Цей метод називається CORS (Cross-origin resource sharing). Тут описано, що потрібно налаштувати на власному сервері:
http://enable-cors.org/server.html
Загальний опис CORS:
http://en.wikipedia.org/wiki/Cross-origin_resource_sharing
Зразок CORS для AWS S3:
<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
<AllowedOrigin>*</AllowedOrigin>
<AllowedMethod>GET</AllowedMethod>
<MaxAgeSeconds>3000</MaxAgeSeconds>
<AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>
Назад
Додати коментар