Blogger相关的帖子小工具图片调整大小s72-c [需要专家帮助]

I run a Blogger blog and I use follow code JavaScript code (requires no jQuery) to show the related post with labels/categories of the post.

我运行Blogger博客,并使用跟随代码JavaScript代码(不需要jQuery)来显示帖子标签/类别的相关帖子。

        <script type='text/javascript'>
    var defaultnoimage=&quot;http://1.bp.blogspot.com/-M72rpgunTq0/VUOKijudN_I/AAAAAAAABoI/LQ18scEunSg/w72/favicon-TIK.png&quot;;
    var maxresults=16;
    var splittercolor=&quot;#d4eaf2&quot;;
    var relatedpoststitle=&quot;Related Posts&quot;;
    </script>
    <script type='text/javascript'>//<![CDATA[
    var relatedTitles = new Array();
    var relatedTitlesNum = 0;
    var relatedUrls = new Array();
    var thumburl = new Array();

    function related_results_labels_thumbs(json) {
        for (var i = 0; i < json.feed.entry.length; i++) {
            var entry = json.feed.entry[i];
            relatedTitles[relatedTitlesNum] = entry.title.$t;
            try {
                thumburl[relatedTitlesNum] = entry.media$thumbnail.url
            } catch (error) {
                s = entry.content.$t;
                a = s.indexOf("<img");
                b = s.indexOf("src=\"", a);
                c = s.indexOf("\"", b + 5);
                d = s.substr(b + 5, c - b - 5);
                if ((a != -1) && (b != -1) && (c != -1) && (d != "")) {
                    thumburl[relatedTitlesNum] = d
                } else {
                    if (typeof(defaultnoimage) !== 'undefined') {
                        thumburl[relatedTitlesNum] = defaultnoimage
                    } else {
                        thumburl[relatedTitlesNum] = "http://1.bp.blogspot.com/_u4gySN2ZgqE/SosvnavWq0I/AAAAAAAAArk/yL95WlyTqr0/s400/noimage.png"
                    }
                }
            }
            if (relatedTitles[relatedTitlesNum].length > 80) {
                relatedTitles[relatedTitlesNum] = relatedTitles[relatedTitlesNum].substring(0, 80) + "..."
            }
            for (var k = 0; k < entry.link.length; k++) {
                if (entry.link[k].rel == 'alternate') {
                    relatedUrls[relatedTitlesNum] = entry.link[k].href;
                    relatedTitlesNum++
                }
            }
        }
    }
    function removeRelatedDuplicates_thumbs() {
        var tmp = new Array(0);
        var tmp2 = new Array(0);
        var tmp3 = new Array(0);
        for (var i = 0; i < relatedUrls.length; i++) {
            if (!contains_thumbs(tmp, relatedUrls[i])) {
                tmp.length += 1;
                tmp[tmp.length - 1] = relatedUrls[i];
                tmp2.length += 1;
                tmp3.length += 1;
                tmp2[tmp2.length - 1] = relatedTitles[i];
                tmp3[tmp3.length - 1] = thumburl[i]
            }
        }
        relatedTitles = tmp2;
        relatedUrls = tmp;
        thumburl = tmp3
    }
    function contains_thumbs(a, e) {
        for (var j = 0; j < a.length; j++) {
            if (a[j] == e) {
                return true
            }
        }
        return false
    }
    function printRelatedLabels_thumbs(current) {
        var splitbarcolor;
        if (typeof(splittercolor) !== 'undefined') {
            splitbarcolor = splittercolor
        } else {
            splitbarcolor = "#d4eaf2"
        }
        for (var i = 0; i < relatedUrls.length; i++) {
            if ((relatedUrls[i] == current) || (!relatedTitles[i])) {
                relatedUrls.splice(i, 1);
                relatedTitles.splice(i, 1);
                thumburl.splice(i, 1);
                i--
            }
        }
        var r = Math.floor((relatedTitles.length - 1) * Math.random());
        var i = 0;
        if (relatedTitles.length > 0) {
            document.write('<div class="title">' + relatedpoststitle + '</div>')
        }
        document.write('<div style="clear: both;"/>');
        while (i < relatedTitles.length && i < 20 && i < maxresults) {
            document.write(' <a href="' + relatedUrls[r] + '"><img src="' + thumburl[r] + '"/><br/><div class="relatedpostitle" >' + relatedTitles[r] + '</div></a>');
            i++;
            if (r < relatedTitles.length - 1) {
                r++
            } else {
                r = 0
            }
        }
        document.write('</div>');
        relatedUrls.splice(0, relatedUrls.length);
        thumburl.splice(0, thumburl.length);
        relatedTitles.splice(0, relatedTitles.length)
    }
    //]]></script>

<div id='related-posts'>

<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'/>
<script expr:src='&quot;/feeds/posts/summary/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/>
</b:loop>
<script defer='defer' type='text/javascript'>removeRelatedDuplicates_thumbs();printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);</script>
</div>
<div style='clear:both'/>

This code works fine except one problem. The code generates small images ( in default blogger thumbnail size which is s72-c) and there is no way to customize the size for (to change s72-c to s200/s200-c/w200).

除了一个问题,此代码工作正常。代码生成小图像(默认博客缩略图大小为s72-c),无法自定义大小(将s72-c更改为s200 / s200-c / w200)。

I have found a image re-sizing solution script for Blogger but they are not helping. Here is it

我找到了一个针对Blogger的图像重新调整大小的解决方案脚本,但他们没有帮助。就这个

    function resizeThumb(size) {
    var popularPost = document.getElementById('PopularPosts1');
    var image = popularPost.getElementsByTagName('img');
    for (var i = 0; i < image.length; i++) {
        image[i].src = image[i].src.replace(/\/s72\-c/g, "\/s" + size + "-c")
    }
}
resizeThumb(200);

This is for Popular post widget. And I know if I change the ID in the first line this will replace the image. But this is not solution but a cover up. And this also means the two images are loaded on is s72-c and the replaced one.

这是针对热门帖子小部件。我知道如果我在第一行更改ID,它将替换图像。但这不是解决方案,而是掩盖。这也意味着加载了两个图像是s72-c和被替换的图像。

I want to integrate it (something like this) in the first related post script. I have tried hard with very very little knowledge of javascript I have but fail. So I signed up to * and this is my question post.

我想在第一个相关的帖子脚本中集成它(类似这样)。我很努力,只有很少的javascript知识但我失败了。所以我注册了*,这是我的问题帖子。

Thank you in advance for trying to the help me.

提前谢谢您试图帮助我。

2 个解决方案

#1

function code for image size s200-c

function resizeThumb(size) {
    var popularPost = document.getElementById('PopularPosts1');
    var image = popularPost.getElementsByTagName('img');
    for (var i = 0; i < image.length; i++) {
        image[i].src = image[i].src.replace(/\/s200\-c/g, "\/s" + size + "-c")
    }
}
resizeThumb(200);

---

function code for image size s200

function resizeThumb(size) {
    var popularPost = document.getElementById('PopularPosts1');
    var image = popularPost.getElementsByTagName('img');
    for (var i = 0; i < image.length; i++) {
        image[i].src = image[i].src.replace(/\/s200\/g, "\/s" + size + "")
    }
}
resizeThumb(200);

---

#2

first,add

var thumb = 200;

after

var thumburl = new Array();

then

add

 thumburl[relatedTitlesNum] = thumburl[relatedTitlesNum].replace("/s72-c/","/s"+thumb+"/");

after

 thumburl[relatedTitlesNum] = entry.media$thumbnail.url;

hope you like it

希望你喜欢