4

我们将网页固定在 Windows 8 机器上，但它显示的图像似乎是收藏图标，而不是元数据/ xml 文件中指定的图标。

我首先尝试在所有网页中将其添加到我的 head 部分：

<!--[if IE]>
<meta name="application-name" content="My App"/>
<meta name="msapplication-TileColor" content="#ffffff"/>
<meta name="msapplication-TileImage" content="http://mysite.somwhere.au/app/img/tile.png" />
<meta name="msapplication-square70x70logo" content="http://mysite.somwhere.au/app/img/tiny.png"/>
<meta name="msapplication-square150x150logo" content="http://mysite.somwhere.au/app/img/square.png"/>
<meta name="msapplication-wide310x150logo" content="http://mysite.somwhere.au/app/img/wide.png"/>
<meta name="msapplication-square310x310logo" content="http://mysite.somwhere.au/app/img/large.png"/>
<![endif]-->

由于某种原因，这不起作用。我可以成功导航到“内容”部分中所述的每个图像，并且可以很好地显示图像。

然后我尝试了 xml 希望这可能有效。我的 html head 部分看起来像这样：

<!--[if IE]>
<meta name="application-name" content="My App"/>
<meta name="msapplication-config" content="http://mysite.somewhere.au/app/browserconfig.xml" />
<![endif]-->

我知道如果我使用默认名称“browserconfig.xml”，则此处不需要 msapplication-config，但无论如何我认为 id 是明确的......

我的 xml 看起来像这样：

<?xml version="1.0" encoding="utf-8"?>
<browserconfig>
  <msapplication>
   <tile>
     <square70x70logo src="http://mysite.somewhere.au/app/img/tiny.png"/>
     <square150x150logo src="http://mysite.somewhere.com.au/app/img/square.png"/>
     <wide310x150logo src="http://mysite.somewhere.au/app/img/wide.png"/>
     <square310x310logo src="http://mysite.somewhere.au/app/img/large.png"/>
     <TileColor>#ffffff</TileColor>
   </tile>
 </msapplication>
</browserconfig>

知道为什么显示收藏图标而我的图像没有显示吗？尝试取消固定和重新固定，但没有运气。我用这个网站来帮助我：http ://www.buildmypinnedsite.com/

提前致谢！

4

3 回答 3

6

解决了。

使用 browserconfig.xml 方法时效果最佳。

将此添加到您的元数据中：

<meta name="msapplication-config" content="/app/browserconfig.xml" />

如果您之前添加了图像进行测试，然后希望更改图像，Windows 似乎会缓存此图像，而清除 Windows 缓存似乎会让某些用户感到沮丧，所以...

我在图片网址的“?1”末尾添加了一个参数。这似乎向 Windows 暗示内容是动态的，因此会重新加载图像。我想一旦它成功了，你就可以删除它......

我的 browserconfig.xml 现在看起来像这样：

<?xml version="1.0" encoding="utf-8"?>
<browserconfig>
  <msapplication>
    <tile>
      <square70x70logo src="/app/img/smalltile.png?1"/>
      <square150x150logo src="/app/img/mediumtile.png?1"/>
      <wide310x150logo src="/app/img/widetile.png?1"/>
      <square310x310logo src="/app/img/largetile.png?1"/>
      <TileColor>#ffffff</TileColor>
    </tile>
  </msapplication>
</browserconfig>

现在它完美地工作了。对此解决方案的反馈表示赞赏。

编辑：

经过严格的测试和挫折后，在使用相对路径时，它可以很好地反复工作。在我们的例子中，站点是（比如说）www.myapp.com，但是 java web 服务器被称为 /app，所以 www.myapp.com/app 是根目录。

<meta name="msapplication-config" content="/app/browserconfig.xml" />

browserconfig 中的 src 与您正在查看的页面相关！所以最好在这里使用完整路径，以防他们固定页面/app/orders/index.jsp。所以 src 变成

src="/app/img/myimage.png?2"

现在效果很好。

于 2013-12-13T01:17:32.273 回答
1

删除<!--[if IE]>和<![endif]-->，Windows 8.x 附带 IE10+，不再支持条件注释。

于 2013-11-22T03:22:31.770 回答
0

发现问题了！browserconfig.xml不在我的“登录过滤器”排除列表中，但图像是......所以访问browserconfig.xml将我重定向到登录页面。

我可以访问browserconfig.xml所有这些时间，因为我在进行测试时登录了我的浏览器。我在这里学到但未能实施的一课是在隐身模式下测试一个页面。如果我这样做了，我会更早发现这一点。

于 2013-11-25T07:20:22.330 回答