主图像（大尺寸）显示模糊，在同一 post 中与 youtube 视频共享时（Blogger）

Question

请问我有一个很奇怪的案例。当与 YouTube 视频共享时，我的博客在 "slide carusel' and " 相关 post 上显示模糊图像（这些是高分辨率或原始尺寸）。只有当主图像与嵌入的 YouTube 共享时才会出现这些问题视频。

例如，post 有一张主图片（例如 800x600），在第二张图片下方，并向下嵌入了一个 youtube 视频，因此第一张图片将完全失去其质量（如模糊） "slider carusel' and "相关 post”部分，

我正在用谷歌搜索这个问题，但没有找到关于它的文章。我有一个测试博客，其中显示了这个问题，..博客模板是付费版，不是免费版。

提前致谢

你可以在这里看到它http://blurryimagesblurry.blogspot.com

琼（Wendynow）

Answer 1

在模板中找到以下代码-

function getImage(sora,z){var n=sora[z].title.$t,p=sora[z].content.$t,u=$("<div>").html(p);if("media$thumbnail"in sora[z]){var w=sora[z].media$thumbnail.url.replace(/\/s[0-9]+\-c/g,"/s1600");if(p.indexOf("youtube.com/embed")>-1){w=sora[z].media$thumbnail.url.replace("/default.jpg","/mqdefault.jpg");}}else if(p.indexOf("<img")>-1){w=u.find("img:first").attr("src");}else{w=soraOptions.noThumbnail;}var code='<img class="sora-thumb" alt="'+n+'" src="'+w+'"/>';return code;}

模板中有两个 getImage 函数实例。用以下代码替换它们 -

function getImage(sora, z) {
var n = sora[z].title.$t,
    p = sora[z].content.$t,
    u = $("<div>").html(p);
if("media$thumbnail" in sora[z]) {
    var w = sora[z].media$thumbnail.url.replace(/\/s[0-9]+\-c/g, "/s1600");
    if(sora[z]["media$thumbnail"].url.indexOf("youtube.com") > -1 ) {
        w = sora[z].media$thumbnail.url.replace("/default.jpg", "/maxresdefault.jpg");
    }
} else if(p.indexOf("<img") > -1) {
    w = u.find("img:first").attr("src");
} else {
    w = soraOptions.noThumbnail;
}
var code = '<img class="sora-thumb" alt="' + n + '" src="' + w + '"/>';
return code;
}

问题的发生是因为使用了错误的 if 条件。当 YouTube 视频出现在 post 内容中时，if 条件应用了 YouTube 特定的图像分辨率更改（因此，当 post 包含 YouTube 视频并且 media$thumbnail URL 不是 YouTube 缩略图，它尝试将 YouTube 特定的图像分辨率更改应用到 Blogger 托管的图像，但失败了，导致改为使用大小为 72x72 像素的默认缩略图）。当 media$thumbnail URL 只是一个 YouTube 缩略图时，它应该应用 YouTube 特定的图像分辨率更改（也就是将 YouTube 缩略图调整为更高分辨率）。

主图像（大尺寸）显示模糊，在同一 post 中与 youtube 视频共享时（Blogger）

Main images ( large size ) display like blurry , when are shared with youtube video in same post (Blogger)

youtube

blogger

image

blurry