javascript - 主页(Blogspot 博客)上的缩略图突然模糊？

Question

我的 blogspot 博客使用以下模板:http://bold-bthemez.blogspot.com/正如你所看到的，首页上的图像突然变得模糊(直到昨天它们都很好，我不知道为什么突然改变了)。我猜测这与 Javascript 有关，因为类似的事情也发生在其他在这里提出问题的人身上，但答案对我的博客不起作用(我指的是这个问题:Thumbnail images on home page (grid) now appearing blurry. How to correct that?)

请帮忙，我尝试了 4 个小时来解决这个问题，但无法解决...

Answer 1

发生此问题的原因是 Blogger 更改了帖子的缩略图 URL(可通过布局标记 - <data:post.thumbnailUrl/> 访问)的结构(具体来说， s72-c 更改为 s72-c-k-no )。的 Blogger 模板创建者使用正则表达式匹配来调整图像大小(从默认分辨率 72x72px 到更大尺寸)。由于不再满足正则表达式匹配条件，图像调整大小脚本不会改变图像分辨率，并且正在渲染默认的 72x72px(由于被拉伸(stretch)到比原始分辨率大得多的分辨率，因此显得像素化/模糊)

但是，由于许多博客都使用了这个解决方案(使用正则表达式匹配来更改缩略图分辨率)，因此这影响了许多用户。鉴于此，Blogger 恢复了他们对缩略图 URL 所做的更改。这是post from a Google employee关于此事在官方博客论坛 -

Hi everyone,

It's likely that the change that caused this problem will be reverted in the near future, so I would recommend a backward-compatible solution to the problem. If this message/post does not make any sense to you, it may make sense to your custom template's author, so let them know about it, in case Blogger makes any similar changes in the future.

Blogger's Layouts engine (the template language) has a native 'resizeImage' operator, which can be used to change the size of the thumbnails. Lots of you have custom templates that are using a javascript regex to change the value. (String replacement of 's72-c'). This can be better achieved server-side, by replacing the URL part.

This tag

<data:post.thumbnailUrl />

Can be changed for a resizeImage operation, which takes the new width you want, and the new width:height ratio. e.g. for a 200x200 image

<b:eval expr='resizeImage(data:post.thumbnailUrl, 200, "1:1")' />

More documentation on the resizeImage operator can be found here: https://productforums.google.com/forum/#!topic/blogger/4R_sAkgZH9I

Hope this helps.