Как добавить пользовательские шрифты в prestashop? - PullRequest
Новая
       6

Как добавить пользовательские шрифты в prestashop?

0 голосов
/ 26 сентября 2018

У меня есть шрифт с именем FuturaPT, я хотел бы использовать этот шрифт в своей корзине,

Вот что я добавил в свой модуль корзины css 

  @font-face {
    font-family: 'FuturaPT-Book';
    src: url('../fonts/FuturaPT-Book.eot');
    src: url('../fonts/FuturaPT-Book.woff2') format('woff2'),
      url('../fonts/FuturaPT-Book.woff') format('woff'),
      url('../fonts/FuturaPT-Book.ttf') format('truetype'),
      url('../fonts/FuturaPT-Book.svg#FuturaPT-Book') format('svg'),
      url('../fonts/FuturaPT-Book.eot?#iefix') format('embedded-opentype');
    font-weight: normal;
    font-style: normal;
  }

css 

h1{
font-size: 36px;
font-family: "FuturaPT-Book";
}

Проверка сети Chrome Dev Я вижу, что шрифт загружен, но в моем h1 нет изменений,

Это правильный способ добавить пользовательские шрифты в prestashop?

Ответы [ 2 ]

0 голосов
/ 26 сентября 2018

Чтобы добавить пользовательский шрифт в Prestashop, вы можете зарегистрировать свой fonts.css, который загружает ваши пользовательские шрифты и добавить ваш CSS в custom.css файлах.

Выполните следующие шаги;

1) Зарегистрируйте свой css в theme.yml ( Подробнее здесь ), добавив код ниже под assets

themes / {your_theme} /config/theme.yml

assets:
  css:
    all:
      - id: fonts
        path: assets/css/fonts.css
        priority: 30

2) Создайте файл fonts.css под themes/{your_theme}/assets/css и добавьте в него код ниже.

themes / {your_theme} / assets / css / fonts.css 

@font-face {
    font-family: 'FuturaPT-Book';
    src: url('../fonts/FuturaPT-Book.eot');
    src: url('../fonts/FuturaPT-Book.woff2') format('woff2'),
        url('../fonts/FuturaPT-Book.woff') format('woff'),
        url('../fonts/FuturaPT-Book.ttf') format('truetype'),
        url('../fonts/FuturaPT-Book.svg#FuturaPT-Book') format('svg'),
        url('../fonts/FuturaPT-Book.eot?#iefix') format('embedded-opentype');
    font-weight: normal;
    font-style: normal;
}

3) Теперь, чтобы загрузить файл css, вам необходимо удалить файл config/themes/{your_theme}/shop1.json ( Reference )

4)Создайте папку fonts в папке themes/{your_theme}/assests и добавьте в нее все файлы, связанные со шрифтами.

5) Добавьте css в custom.css файл

themes /{your_theme} /assets/css/custom.css

h1 {
    font-size: 36px;
    font-family: "FuturaPT-Book";
}

Если это не работает, введите important, как показано ниже; 

h1 {
    font-size: 36px !important;
    font-family: "FuturaPT-Book" !important;
}

После внесения всех этих изменений проверьтемагазин.

Надеюсь, это поможет!

0 голосов
/ 26 сентября 2018

Лучший способ ожидания: D

https://github.com/PrestaShop/fontmanager

Этот бесплатный модуль находится в процессе разработки и будет доступен в ближайшее время.затем вы можете активировать его из списка модулей на BO и загрузить свой собственный шрифт.

...