目前,我在Magento Go网站上工作。我从字体Spring购买了Web字体,并使用Font Assets Tool通过管理系统上传了4个字体文件(EOT,WOFF,TTF和SVG)。

当我插入字体时,将以下CSS代码添加到我的自定义CSS中:

../css_editor_fonts/ProximaNova-Sbold-webfont.eot
../css_editor_fonts/ProximaNova-Sbold-webfont.ttf
../css_editor_fonts/ProximaNova-Sbold-webfont.woff
../css_editor_fonts/ProximaNova-Sbold-webfont.svg

然后,我将这些相对路径应用于正确的跨浏览器兼容 @font-face声明,请参见下文:

@font-face {
    font-family: 'proxima_nova_ltsemibold';
    src: url('../css_editor_fonts/ProximaNova-Sbold-webfont.eot');
    src: url('../css_editor_fonts/ProximaNova-Sbold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../css_editor_fonts/ProximaNova-Sbold-webfont.woff') format('woff'),
         url('../css_editor_fonts/ProximaNova-Sbold-webfont.ttf') format('truetype'),
         url('../css_editor_fonts/ProximaNova-Sbold-webfont.svg#proxima_nova_ltsemibold') format('svg');
    font-weight: normal;
    font-style: normal;

}

该字体在我的自定义CSS中被引用:

font-family: 'proxima_nova_ltsemibold';

这在IE7/8和最新的Chrome中起作用,但在IE 9/10或Firefox中不起作用。

我认为该字体在IE9/10中不起作用和Firefox的原因是我所看到的很多讨论的交叉请求,而我的IE控制台包含此错误:

@font-face失败的交叉原始请求。资源访问受到限制。

可以对HTACCESS文件进行编辑,以使字体能够在这些浏览器中工作 - 从我阅读的内容中,它称为Access-Control-Allow-Origin。

有人知道您是否可以更新或创建Magento Go的HTACCESS文件?

干杯。

有帮助吗?

解决方案

我无法将上传的字体文件用于所有浏览器,但是我设法使用字体使用了字体 http://fontdeck.com/. 。您使用哪种字体服务服务是无关紧要的,但是我已经成功使用了。

我与Magento Go支持团队的成员(通过实时聊天)进行了交谈,并解释了由于交叉原始请求而没有在各种浏览器中提供的上传字体文件所遇到的问题。我解释了HTACCESS解决方案,以启用字体,它们的响应大致符合“我们的服务器不支持自定义HTACCESS文件”的路线。

我尝试使用 @font-face规则的SRC属性的绝对路径,但我认为Magento Go无论如何都将其添加到您的自定义CSS中,因为它似乎是从主题编辑器处理并链接到模板中的。

编辑:我忘了提到我还尝试使用字体松鼠Web Font Generator(http://www.fontsquirrel.com/tools/webfont-generator)。我上传了购买的文件,启用了必要的高级设置,下载了使用编码字体的CSS(认为只是编码的是WOFF),将CSS上传到我的主题...然后Magento Go应用了相同的绝对路径, SRC属性破坏了编码的字体,因为它的前面有一个随机的URL。

我已经用Magento Go筹集了一张支持票,解释了这些问题,并询问他们打算做些什么来使上传的字体文件向所有浏览器提供。我希望它可以提高到功能请求或类似的内容。

目前,它必须是字体服务服务。我使用了字体甲板上的JavaScript嵌入代码。我将提供的JS放在静态块中,然后使用前端应用程序添加到所有页面。您可以使用字体甲板上的HTML链接嵌入方法,但是必须在使用Magento GO的主题编辑器无法使用任何脚本标签之前将其添加到标题中。

希望这可以在短期内帮助某人。长期,我希望Magento能找到解决这个问题的解决方案。

其他提示

请尝试为字体而不是相对路径使用绝对完整路径(带有HTTPS/HTTP)。

许可以下: CC-BY-SA归因
scroll top