预加载链接-WordPress和Flatsome

我发现了很多不同的文章并试图实现它,但是我仍然无法使它工作。

Google pagespeed建议预先加载一些文件,但我无法弄清楚:/

我继续更新了header.php

<head>

    <!--custom preload -->
    <link rel="preload" as="font" crossorigin="anonymous" href="https://allurehemp.com/allurehemp/assets/css/icons/fl-icons.woff2" >
    <link rel="preload" as="style" crossorigin="anonymous" href="https://allurehemp.com/allurehemp/assets/css/fl-icons.css" >


    <meta charset="<?php bloginfo( 'charset' ); ?>" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" />

    <link rel="profile" href="http://gmpg.org/xfn/11" />
    <link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />

    <?php wp_head(); ?>
</head> 

现在我面临以下问题;

A preload for 'https://allurehemp.com/allurehemp/assets/css/fl-icons.css' is found,but is not used because the request credentials mode does not match. Consider taking a look at crossorigin attribute.

任何建议都值得赞赏=)

xiaozhuhechaohong 回答:预加载链接-WordPress和Flatsome

我意识到这已经很晚了,但是我只是为我的网站弄清楚了。如果OP不再需要此功能,则对其他人可能会有帮助。

这比我想象的要简单得多。下面是我所做的,并且有效。 PageSpeed Insights中不再有警告/惩罚,我的表现得分也有所提高。

  1. 在WP管理区域/仪表板中,转到Flatsome> Advanced> Global Settings(请参见下面的屏幕截图)

Screenshot of relevant Flatsome > Advanced > Global Settings area

  1. 将以下行插入“标题脚本”区域:

<link rel='preload' href='//wp-content/themes/flatsome/assets/css/icons/fl-icons.woff2' as='font' type='font/woff2' crossorigin='anonymous'>

其他说明:

A。我的代码段中的链接是相对于站点域的,因此您无需更改它并插入域或任何其他内容。双斜杠强制使用与原始站点相同的安全协议,因此,如果您的站点使用https(应使用),则它应强制加载https。

B。这可能不言而喻,但您永远不会知道:如果要在主题文件中添加任何内容,请始终使用子主题,以便更新主题时更新/更改不会被覆盖。这是我曾在WordPress中创建子主题多次使用的出色插件:https://wordpress.org/plugins/child-theme-configurator/

C。您在header.php文件中包含的链接未包含“ type =”位。我不确定,但这可能是您遇到问题的根源。

D。我没有像您那样为css文件添加预加载链接,因为我的所有css均已缩小并合并。而且,该特定文件还是只有几行,因此预加载可能不会有多大区别。

希望这会有所帮助! :)

本文链接:https://www.f2er.com/3094022.html

大家都在问