Как внедрнить свой шрифт?

Alex_iPod

Захожу иногда
183
0 / 1

Друзья, подкажите пожалуйста как по простому внедрить шрифт. На форуме есть целая тема переиписки, но решения нет. Гуглфонт не поддерживает. Шрийт наывается Bicubik.OTF
Через сервис шрифтов пропустил:

@font-face {
font-family: 'bicubikregular';
src: url('../bicubik-webfont.woff2') format('woff2'),
url('../bicubik-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;

}

Что далее? Шабон от aplikko, внедрен sp page builder. В поддержке написали что свой шрифт в sp page builder внедрить нельзя. Думаю вариант просто сделать HTML модуль с нужным шрифтом и вставить в sp page builder. Прошу, помогите понять как.

Благодарю

Записан

sivers

Живу я здесь
2476
336 / 0

Re: Как внедрнить свой шрифт?

« Ответ #1 : 22.01.2022, 19:23:29 »

если шрифт отф, то и подключайте отф.

Код

        @font-face {
            font-family: 'bicubikregular';
            src: url('/font/Bicubik.OTF') format("opentype");
            font-weight: normal;
            font-style: normal;
        }

путь к файлу укажите правильный. с учетом регистра символов. если есть файлы шрифта в других форматах - можно указать через запятую.

Записан

На связи в telegram @sivers
sivers @ inbox . ru
https://sivers.su/

Alldar

Завсегдатай
1504
195 / 1

Re: Как внедрнить свой шрифт?

« Ответ #2 : 23.01.2022, 17:17:51 »

Цитата: sivers от 22.01.2022, 19:23:29

если шрифт отф, то и подключайте отф.

Плохая идея тем более уже есть woff и woff2.

Вы можете подключить просто в создав файл custom.css в папке templates/название_шаблона/css (судя по документации вашего шаблона файл подключиться автоматически)
Свой шрифт - файлы bicubik-webfont.woff2 и bicubik-webfont.woff положить можете рядом с custom.css.

Код

@font-face {
    font-family: 'bicubikregular';
    src: url('bicubik-webfont.woff2') format('woff2'),
         url('bicubik-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

Если хотите сменить на всем сайт шрифт то прописать так:

Код

body {
  font-family  : 'bicubikregular', system-ui, -apple-system, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
}

Если для какого то конкретного блока то указать его или тег или класс/id:

Код

.some-class {
   font-family : 'bicubikregular', system-ui, -apple-system, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
}

Может быть так что шрифт переопределен в билдере тогда можете через !important; повысить уровень вашего правила, вот так

Код

.some-class {
   font-family : 'bicubikregular', system-ui, -apple-system, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif !important;
}

Записан

Сайт о Joomla - CMSCafe

Alex_iPod

Захожу иногда
183
0 / 1

Re: Как внедрнить свой шрифт?

« Ответ #3 : 23.01.2022, 23:03:09 »

Друзья, спасибо вам за ответы, попробую сделать как советуете.

Записан

Helix Ultimate 2 свой хедер Автор kosh2323	Ответов: 8 Просмотров: 715	10.10.2021, 15:32:50 от kosh2323
Свой шаблон макета вывода для первой статьи в модуле новостей Автор zeus07	Ответов: 2 Просмотров: 445	22.01.2021, 15:09:42 от zeus07
Шрифт в фреймворке Helix3 Автор SeBun	Ответов: 13 Просмотров: 5174	30.11.2020, 02:45:55 от dron
Загрузка файлов через свой компонент Автор averkiev	Ответов: 1 Просмотров: 892	09.04.2018, 10:39:57 от averkiev
Добавить в свой шаблон frontend module editing Автор Zelyonkin	Ответов: 0 Просмотров: 553	20.10.2017, 19:11:54 от Zelyonkin

Как внедрнить свой шрифт? - Joomla 3.x: Шаблоны, разметка и макеты вывода

Новости Joomla

Обновление модуля WT Quick links v.2.2.0

Выпуск Joomla Community Magazine за апрель 2024

Что нового в joomla 5.1?

Alex_iPod

Как внедрнить свой шрифт?

sivers

Re: Как внедрнить свой шрифт?

Alldar

Re: Как внедрнить свой шрифт?

Alex_iPod

Re: Как внедрнить свой шрифт?

Похожие темы