[Blogger]

針對Blogger的行動裝置版面,若要重新調整文章縮圖的大小,可參考下列步驟:

1.搜尋</head>

2.在</head>上一行,貼上下列程式碼。其中下列兩個參數可自行利用%或px調整,使縮圖尺寸有所變化。

width: 300px 
height: 150px 

<script language='javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>//<![CDATA[
/** This script was written by Confluent Forms LLC http://www.confluentforms.com for the BlogXpertise website 
http://www.blogxpertise.com any updates to this script will be posted to BlogXpertise please leave this message 
and give credit where credit is due! **/
$(document).ready(function() {
// change the dimension variable below to be the pixel size you want
var dimension = 800;
// this identifies the Mobile Index Thumbnail div element, finds each image in it, and resizes it
$('.mobile-index-thumbnail').find('img').each(function(n, image){
var image = $(image);
image.attr({src : image.attr('src').replace(/s\B\d{2,4}/,'s' + dimension)});
image.attr('width',dimension);
image.attr('height',dimension);
});
});
//]]></script>
<style>
.mobile-index-thumbnail img {
width: 300px !important;
height: 150px !important;
text-align: left;
margin: 0 0 0 0;
padding: 5px;
display: block;
}
.mobile-index-thumbnail {
float: none;
margin: 10px auto;
}
</style>

reference:

http://www.confluentforms.com
http://www.blogxpertise.com 

猜你喜欢

转载自blog.csdn.net/weixin_42008031/article/details/86560056