У меня проблема с получением эскиза постов блоггера в шаблоне Soho. Код работал в другом шаблоне, но когда я изменил на Soho, картинки уменьшенного изображения не соответствуют ожидаемому размеру, они возвращают очень маленькое изображение.
Размер должен быть таким:
Это не относится к конфигурации css ...
Код blogger
страница, на которую я звоню:
<div class='post'>
<b:class cond='data:view.isMultipleItems and data:post.featuredImage' name='has-featured-image'/>
<b:class cond='data:view.isMultipleItems and not data:post.featuredImage' name='no-featured-image'/>
<b:include data='post' name='postMeta'/>
<b:if cond='data:view.isSingleItem'>
<b:include name='headerByline'/>
<b:include data='post' name='postTitle'/>
<div class='post-body-container'>
<b:include data='post' name='postBody'/>
</div>
<b:else/>
<b:if cond='data:post.featuredImage'>
<div class='snippet-thumbnail'>
<a expr:href='data:post.url'>
<b:comment>Max width is 576, so max size @ 2x is 1152.</b:comment>
<b:include data='{ image: data:post.featuredImage, imageSizes: [320,490,576,1152], sourceSizes: "(max-width: 576px) 100vw, (max-width: 1024px) 576px, 490px" }' name='responsiveImage'/>
</a>
<b:include name='headerByline'/>
</div>
<b:else/>
<b:include name='headerByline'/>
</b:if>
<b:include data='post' name='postTitle'/>
</b:if>
<b:include data='post' name='postFooter'/>
</div>
</b:includable>
<b:includable id='feedLinks'>
И я называю эту конфигурацию сообщений в следующем блоге:
<div id="demo"></div>
<script>
function getPosts(json){
var list = [];
var data = json.feed.entry;
list.push("<section class='colorlib-blog' data-section='blog'>");
list.push("<div class='colorlib-narrow-content'>");
list.push("<div class='row'>");
list.push("<div class='col-md-6 col-md-offset-3 col-md-pull-3 animate-box' data-animate-effect='fadeInLeft'>");
list.push("<span class='heading-meta'></span>");
list.push("<h2 class='colorlib-heading'>Recent Blog</h2>");
list.push("</div>");
list.push("</div>");
for (var i = 0; i < data.length; i++) {
var title = "<h3>" + data[i].title.$t + "</h3>";
var link = data[i].link.pop().href;
var summary = "<p>" + data[i].content.$t.replace(/<\/?[^>]+(>|$)/g, "").substr(0, 120) + "</p>";
var dateT = data[i].published.$t.substr(0, 10);
if (data[i].media$thumbnail) {
var img = "<img src='" + data[i].media$thumbnail.url + "' class='img-responsive' alt='HTML5 Bootstrap Template by colorlib.com'>";
} else {
var doc = new DOMParser().parseFromString(data[i].content.$t, "text/html");
var imgtag = doc.querySelector('img');
if (imgtag) {
var img = "<img src='" + imgtag.src + "' class='img-responsive' alt='HTML5 Bootstrap Template by colorlib.com'>";
} else {
var img = "";
}
}
list.push("<div class='row'>");
list.push("<div class='col-md-4 col-sm-6 animate-box' data-animate-effect='fadeInLeft'>");
list.push("<div class='blog-entry'>");
list.push("<div class='feed-post'>");
list.push("<a href='"+link+"' class='blog-img'>"+img+"</a>");
list.push("<div class='desc'>");
list.push("<span><small>"+dateT+"</small> | <small> Angélica Ribeiro </small> | <small> <i class='icon-bubble3'></i> 4</small></span>");
list.push("<h3><a href='"+link+"'>"+title+"</a></h3>");
list.push(summary);
list.push("</div>");
list.push("</div>");
list.push("</div>");
list.push("</div>");
}
list.push("</div>");
list.push("<div class='row'>");
list.push("<div class='col-md-12 animate-box'>");
list.push("<p><a href='https://angelribeirocomp.blogspot.com/' class='btn btn-primary btn-lg btn-load-more'>Load more <i class='icon-reload'></i></a></p>");
list.push("</div>");
list.push("</div>");
list.push("</div>");
list.push("</section>");
document.getElementById('demo').innerHTML = list.join('');
}
</script>
<script src="https://www.blogger.com/feeds/614640065733671379/posts/default?alt=json&max-results=3&callback=getPosts"></script>
Спасибо большое