blog post look beautiful by increasing thumbnail size
many peoples want to increase popular post thumbnail size
but without having css knowledge they can't do it
but don't worry because today i will show you how to increase
popular posts thumbnail size.
How To Increase Post Thumbnail Size..
login to blogger
go to template
now save backup of your template
now click on edit html
in next page you will see your template code
click on template code and press ctrl+F
and search
How To Customize Thumbnail Size?
in above css just replace red area 120 with thumbnail size and 180 with thumbnail width
that's it if you get any error you can ask me,
many peoples want to increase popular post thumbnail size
but without having css knowledge they can't do it
but don't worry because today i will show you how to increase
popular posts thumbnail size.
How To Increase Post Thumbnail Size..
login to blogger
go to template
now click on edit html
click on template code and press ctrl+F
and search
</head>copy and past following code just before </head>
<style type='text/css'> .PopularPosts .item-thumbnail a { clip: auto; display: block; height: 120px; overflow: hidden; width: 180px; margin-left: -8px; } .PopularPosts .item-thumbnail img { position: relative; top: -30px; transition:all .2s linear; -o-transition:all .5s linear; -moz-transition:all .2s linear; -webkit-transition:all .2s linear; } .PopularPosts .item-thumbnail img:hover{ opacity:.5; filter:alpha(opacity=60) } .PopularPosts .widget-content ul li { color: #333; } .PopularPosts .item-title { clear:both; font: 12px verdana; color: #222222; text-transform: uppercase; text-align: center; margin-right: 8px
; } .PopularPosts .item-snippet { display: none; } .widget .widget-item-control a img { height: 18px; width: 18px; } </style> <script type='text/javascript'> function changeThumbSize(id,size){ var blogGadget = document.getElementById(id); var replacement = blogGadget.innerHTML; blogGadget.innerHTML = replacement.replace(/s72-c/g,"s"+size+"-c"); var thumbnails = blogGadget.getElementsByTagName("img"); for(var i=0;i<thumbnails.length;i++){ thumbnails[i].width = size; thumbnails[i].height = size; } } changeThumbSize("PopularPosts1",180); </script>
How To Customize Thumbnail Size?
in above css just replace red area 120 with thumbnail size and 180 with thumbnail width
that's it if you get any error you can ask me,
Dear readers, after reading the Content please ask for advice and to provide constructive feedback Please Write Relevant Comment with Polite Language.Your comments inspired me to continue blogging. Your opinion much more valuable to me. Thank you. Conversion Conversion Emoticon Emoticon