javascript - 来自外部网址的帖子缩略图不会出现在博客中

标签 javascript html blogger

有没有办法让博主从图像(已经是帖子的一部分)获取外部 URL,以便生成缩略图?

我之前使用的模板可以从外部网址或 picasa 网址生成缩略图,但我需要将模板更改为响应式模板,现在新模板仅选择上传到 picasa 的图像来生成缩略图。

以下是最近帖子列表的部分代码:

<b:if cond='data:post.thumbnailUrl'>
                        <a class='wdxthumb' expr:href='data:post.url' expr:title='data:post.title'>
                          <img class='post-thumbnail' expr:alt='data:post.title' expr:src='data:post.thumbnailUrl'/>
                        </a>
                        <b:else/>
                        <a class='wdxthumb' expr:href='data:post.url' expr:title='data:post.title'>
                          <img alt='no image' class='post-thumbnail' src='https://lh3.googleusercontent.com/-VnJqhx42r-c/UfFWlD-sF_I/AAAAAAAAAQI/rT3sYPba2dY/s271-Ic42/logo3.jpg'/>
                        </a>
                      </b:if>

相关帖子(在帖子页面中)也有同样的问题,这次是使用 javascript:

<script type = 'text/javascript'>

var relnojudul = 0;
var relmaxtampil = 6;
var numchars = 100;
var reljudul = new Array();
var relurls = new Array();
var relcuplikan = new Array();
var relgambar = new Array();

function saringtags(g, h) {
  var e = g.split("<");
  for (var f = 0; f < e.length; f++) {
    if (e[f].indexOf(">") != -1) {
      e[f] = e[f].substring(e[f].indexOf(">") + 1, e[f].length)
    }
  }
  e = e.join("");
  e = e.substring(0, h - 1);
  return e
}

function relpostimgcuplik(h) {
  for (var e = 0; e < h.feed.entry.length; e++) {
    var g = h.feed.entry[e];
    reljudul[relnojudul] = g.title.$t;
    postcontent = "";
    if ("content" in g) {
      postcontent = g.content.$t
    } else {
      if ("summary" in g) {
        postcontent = g.summary.$t
      }
    }
    relcuplikan[relnojudul] = saringtags(postcontent, numchars);
    if ("media$thumbnail" in g) {
      postimg = g.media$thumbnail.url
    } else {
      postimg = "https://lh3.googleusercontent.com/-VnJqhx42r-c/UfFWlD-sF_I/AAAAAAAAAQI/rT3sYPba2dY/s271-Ic42/logo3.jpg"
    }
    relgambar[relnojudul] = postimg;
    for (var f = 0; f < g.link.length; f++) {
      if (g.link[f].rel == "alternate") {
        relurls[relnojudul] = g.link[f].href;
        break
      }
    }
    relnojudul++
  }
}

function contains(a, e) {
  for (var f = 0; f < a.length; f++) {
    if (a[f] == e) {
      return true
    }
  }
  return false
}

function artikelterkait() {
  var v = new Array(0);
  var w = new Array(0);
  var x = new Array(0);
  var A = new Array(0);
  for (var u = 0; u < relurls.length; u++) {
    if (!contains(v, relurls[u])) {
      v.length += 1;
      v[v.length - 1] = relurls[u];
      w.length += 1;
      w[w.length - 1] = reljudul[u];
      x.length += 1;
      x[x.length - 1] = relcuplikan[u];
      A.length += 1;
      A[A.length - 1] = relgambar[u]
    }
  }
  reljudul = w;
  relurls = v;
  relcuplikan = x;
  relgambar = A;
  for (var u = 0; u < reljudul.length; u++) {
    var B = Math.floor((reljudul.length - 1) * Math.random());
    var i = reljudul[u];
    var s = relurls[u];
    var y = relcuplikan[u];
    var C = relgambar[u];
    reljudul[u] = reljudul[B];
    relurls[u] = relurls[B];
    relcuplikan[u] = relcuplikan[B];
    relgambar[u] = relgambar[B];
    reljudul[B] = i;
    relurls[B] = s;
    relcuplikan[B] = y;
    relgambar[B] = C
  }
  var r = 0;
  var D = Math.floor((reljudul.length - 1) * Math.random());
  var z = D;
  var q;
  var t = document.URL;
  while (r < relmaxtampil) {
    if (relurls[D] != t) {
      q = "<li class='news-title clearfix'>";
      q += "<a href='" + relurls[D] + "' rel='nofollow' target='_top' title='" + reljudul[D] + "'><div class='overlayb'></div><img src='" + relgambar[D] + "' /></a>";
      q += "<a class='relinkjdulx' href='" + relurls[D] + "' target='_top'>" + reljudul[D] + "</a>";
      q += "<span class='news-text'>" + relcuplikan[D] + "</span>";
      q += "</li>";
      document.write(q);
      r++;
      if (r == relmaxtampil) {
        break
      }
    }
    if (D < reljudul.length - 1) {
      D++
    } else {
      D = 0
    } if (D == z) {
      break
    }
  }
};

</script>

它也会出现在热门列表、新闻和主页底部的其他 4 个小部件上。 您可以在这里查看问题:hondanewspot.com

通过互联网,我能找到的唯一解释是,博主仅从上传到 picasa 和其他一些图片的图像生成缩略图。但奇怪的是我的另一个模板工作正常。

预先感谢您的帮助。

最佳答案

您可以使用 <data:post.firstImageUrl/> 解决此问题标签而不是 <data:post.thumbnailUrl/>在最近的帖子列表代码中

<b:if cond='data:post.firstImageUrl'>
    <a class='wdxthumb' expr:href='data:post.url' expr:title='data:post.title'>
        <img class='post-thumbnail' expr:alt='data:post.title' expr:src='data:post.firstImageUrl'/>
    </a>
    <b:else/>
    <a class='wdxthumb' expr:href='data:post.url' expr:title='data:post.title'>
        <img alt='no image' class='post-thumbnail' src='https://lh3.googleusercontent.com/-VnJqhx42r-c/UfFWlD-sF_I/AAAAAAAAAQI/rT3sYPba2dY/s271-Ic42/logo3.jpg'/>
    </a>
</b:if>

<data:post.firstImageUrl/>标记将返回 Picasa 托管图像以及外部图像。

对于相关的帖子小部件,您必须更改代码以从 HTML 响应中解析出图像 URL,以防图像未上传到 Picasa 存储

关于javascript - 来自外部网址的帖子缩略图不会出现在博客中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35470748/

相关文章:

javascript - 有没有办法让谷歌可视化表中最左边的列在横向滚动时保持固定?

javascript - 将 Basicprimitive 与 Angularjs 一起使用错误 : jQuery(. ..).orgDiagram 不是函数

html - Bootstrap CSS : align two forms buttons

html - 如何将单个 blogger.com 页面重定向到外部 URL?

blogger - 如何在带有图像的博主帖子中创建帖子列表

javascript - 按标题查找图表 (Highcharts)

javascript - 如何加快网站背景图片的加载速度?

javascript - "Object expected"尝试在 Javascript 上输入时间

javascript - 将元素宽度设置为其内部的图像

jquery - 使用 anchor href 动态环绕图像