CODEWITHSUNDEEP
javascriptyoutubethumbnailsbloggervideo-thumbnails
Dvolatility
Dvolatility

Reputation: 93

Trying to resize Youtube thumbnails from default.jpg to 0.jpg in my popular post widget (I resized imgs to 300px)

I'm trying to make it so my popular post widget on Blogger pulls the youtube thumbnail that ends in 0.jpg and not default.jpg to make my thumbnails clearer. I manually expanded the popular post images to a width of 300px (from the default 120px). I've been trying to figure out how to do this with javascripts that change the url of youtube thumbnails to 0.jpg from default.pg, but I have no idea where to put the codes in my html template. The blog I'm doing this on is https://qwerltube.blogspot.com

A site said that this would change the thumbs, but I didn't know where to put this in order to change the youtube thumbs in my popular post widget. Does anyone know the solution? Thanks for the help.

<!-- / General thumbnail / -->
<b:if cond='data:blog.pageType != &quot;item&quot;'>
   <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
      <b:if cond='data:post.thumbnailUrl'>
         <div class='thumbs'>
            <a expr:href='data:post.url'>
               <script type='text/javascript'>
                  //<![CDATA[
                    function bp_thumbnail_resize(image_url,post_title) {
                       var image_size=240;
                       var show_default_thumbnail=true;
                       var default_thumbnail="http://1.bp.blogspot.com/-4fqrt2MACHQ/UADPlJjibiI/AAAAAAAAAcc/FBN03q3jT2A/s1600/blank_post_thumbnail.png";
                       if(show_default_thumbnail == true && image_url == "") image_url= default_thumbnail;
                       image_tag='<img src="'+image_url.replace('/s72-c/','/s'+image_size+'-c/')+'" alt="'+post_title+'"/>';
                       yimage_tag = '<img src="' + image_url.replace('default', '0') + '" alt="' + post_title + '"/>';
                       if (image_url.indexOf("img.youtube.com")!= -1){
                          return yimage_tag;
                       }
                       else if (image_url != "") {
                          return image_tag;
                       }
                       else return "";
                    }
                  //]]>
               </script>
               <script type='text/javascript'>
                  document.write(bp_thumbnail_resize(&quot;<data:post.thumbnailUrl/>&quot;,&quot;<data:post.title/>&quot;));
               </script>
            </a>
         </div>
         <!-- ### akhir .thumbs, sesuatu -->
      </b:if>
   </b:if>
</b:if>

Upvotes: 1

Views: 470

Answers (1)

Our_Benefactors
Our_Benefactors

Reputation: 3539

Here is the page on how to edit your blog. Look at "Edit the HTML of your blog layout"

https://support.google.com/blogger/answer/43708?hl=en

Paste that code where the existing HTML for the thumbnail is on your blog.

Upvotes: 0

Related Questions