Magento 2 загрузка шрифтов Google с помощью загрузчика веб-шрифтов - PullRequest
0 голосов
/ 12 ноября 2018

Ниже приведен код загрузчика веб-шрифтов, который пытается добавить его в Magento 2?

WebFontConfig = { 
google: { 
    families: ['Montserrat:light,medium,regular,semi-bold,bold,italic,regular', 'IBM Plex Serif:light,extra-light,regular,semi-bold,bold,italic,medium-italic,regular', 'Muli:light,extra-light,regular,semi-bold,bold,italic,regular'] 
    }, 
    timeout: 2000 // Set the timeout to two seconds 
}; 
(function(d) { 
    var wf = d.createElement('script');
    s = d.scripts[0]; 
    wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js'; 
    wf.async = true; s.parentNode.insertBefore(wf, s); 
})(document);

Каков наилучший подход для этого? Попытка добавить его в "default_head_blocks.xml" не работает?

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <script src="js/googleFonts.js"></script>
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no"/>
    </head>
</page>

1 Ответ

0 голосов
/ 19 февраля 2019

Попробуйте добавить этот код непосредственно перед закрытием тега body

<script>
  WebFontConfig = {
    google: { families: ['Montserrat:light,medium,regular,semi-bold,bold,italic', 'IBM Plex Serif:light,extra-light,regular,semi-bold,bold,italic,medium-italic', 'Muli:light,extra-light,regular,semi-bold,bold,italic']  }
  };
  (function() {
    var wf = document.createElement('script');
    wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
    wf.type = 'text/javascript';
    wf.async = true;
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(wf, s);
  })(); 
</script>

Кроме того, убедитесь, что вам нужны все эти шрифты со всеми вариантами (например, light, extra-light, bold, полужирный) вваш проект.

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

...