Question

下面是Web字体加载器代码试图将其添加到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>

Answer 1

尝试在关闭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>

此外，请确保您的项目中是否需要所有带有所有变体（例如浅色，超浅色，粗体，半粗体）的字体。

如果您确实希望缩短网站的加载时间，请考虑将字体及其变体的数量限制为最小。

Magento 2使用网络字体加载器加载Google字体

1 个答案: