Quantcast
Viewing all articles
Browse latest Browse all 39

Answer by Prayag Verma for How to replace a string in a thumbnail URL in Blogger?

In v2 Blogger templates, data:post.featuredImage is related to the Popular Posts widget, we can use the pre-existing code -

<b:with value='data:post.featuredImage.isResizable?resizeImage(data:post.featuredImage, 72, &quot;1:1&quot;):data:post.thumbnail' var='image'>

and modify the width & ratio parameters present in the resizeImage operator to meet our requirements

<b:with value='data:post.featuredImage.isResizable?resizeImage(data:post.featuredImage, 280, &quot;280:152&quot;):data:post.thumbnail' var='image'>

In v3 Blogger templates, using resizeImage operator directly would be able to accomplish the goal

<img expr:src='resizeImage(data:post.featuredImage, 280,"280:152")'/>

Normally the data:post.featuredImage data tag is used in the widgets is present within the snippetedPostThumbnail b:includable tag (There are multiple instances of this). Editing that in the specific widget (like Featured Post widget, Blog posts widget, etc) would affect all images in that particular widget. Replacing the highlighted b:with section in the definition of snippetedPostThumbnail b:includable tag with the previous image tag utilizing the resizeImage operator would have the desired effects

<b:includable id='snippetedPostThumbnail'><div class='snippet-thumbnail'><b:with value='data:post.featuredImage.isYoutube ? resizeImage(data:post.featuredImage.youtubeMaxResDefaultUrl, 945, &quot;945:600&quot;) : &quot;&quot;' var='highRes'><b:include data='{image: data:post.featuredImage, imageSizes: [256, 512, 945, 1684], imageRatio: &quot;945:600&quot;, sourceSizes: &quot;(min-width: 954px) 842px, (min-width: 801px) calc(100vw - 112px), calc(100vw - 64px)&quot;, enhancedSourceset: data:highRes}' name='responsiveImage'/></b:with></div></b:includable>

Viewing all articles
Browse latest Browse all 39

Trending Articles