பிளாக்கரில் Animated Popular Posts விட்ஜெட் இணைக்க...

வணக்கம் நண்பர்களே!

நம்முடைய பதிவுகளில் மிக சிறந்த பெரும்பாலானவர்களால் பார்க்க பட்ட பதிகளை Popular Posts என குறிப்பிடுகிறோம். அப்படி பிரபலமான இடுகைகளை வரிசைபடுத்தி கொடுப்பதே பிளாக்கரின் popular Posts விட்ஜெட் ஆகும். பிளாக்கர் தளம் இந்த விட்ஜெட்டை எந்த வித அனிமேட்டட் வசதியுமின்றி சிம்பிளாக வடிவமைத்துள்ளது. இப்பொழுது இந்த விட்ஜெட்டை அனிமேட்டட் வசதியுடன் பதிவுகள் நகர்ந்து செல்லும் படி எப்படி வடிவமைப்பது என காண்போம். இது போல மாற்றுவதனால் ஒரு குறிப்பிட்ட இடத்தில் எத்தனை பதிவுகளை வேண்டுமானாலும் சேர்த்து கொள்ளலாம். தேவை இல்லாமல் இடத்தை அடைத்து கொள்ளாது. மற்றும் பார்ப்பதற்கும் அழகாக இருக்கும்.

முதலில் பிளாக்கரின் Popular Posts விட்ஜெட்டை உங்கள் பிளாக்கில் இணைத்து இருக்க வேண்டும். இணைக்காதவர்கள் Design -Add a Gadget- Popular post சென்று இந்த விட்ஜெட்டை இணைத்து கொள்ளுங்கள்.

• அடுத்து Animated Effect கொண்டுவர உங்கள் பிளாக்கரில் இணைக்க Design ==> Add a Gadget ==> Html JavaScript செல்லுங்கள். 
• அங்கு கீழே உள்ள கோடிங்கை காப்பி செய்து பேஸ்ட் செய்யவும். 

<style type="text/css" media="screen">
#PopularPosts1 { 
overflow:hidden; 
margin-top:5px; 
width:100%; 
padding:0px 0px; 
height:410px;
}
#PopularPosts1 ul { 
width:310px; 
overflow:hidden; 
list-style-type: none; 
padding: 0px 0px; 
margin:10px 0px 0px 10px; 
}
#PopularPosts1 li { 
width:290px; 
padding: 5px 5px; 
margin:0px 0px 5px 0px; 
list-style-type:none; 
float:none; 
height:80px; 
overflow: hidden; 
background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzVrqE0h49OCCo_jxKErXM8v1uB_hYlLNa4Bd1uVMPbJxl6WAkscVxjDBU3nQbsPW8axKaBy_qbwwFjBN34c8VbJtS3DbpXwzgVNjpLwEpKrVDG1yeYqU0EwjeiEQbeZrWTVVfOnj4dak/s400/popular+posts.jpg) repeat-x; 
border:1px solid #ddd; 
}
#PopularPosts1 li .item-title {
font-size:1em; 
margin-bottom:0.5em; 
}
#PopularPosts1 li .item-title a { 
text-decoration:none; 
color:#7CA2C4; 
font:bold 12px verdana; 
height:18px; 
overflow:hidden; 
margin:0px 0px; 
padding:0px 0px 2px 0px; 
}
#PopularPosts1 li img { 
float:left; 
margin-right:5px; 
background:#EFEFEF; 
border:2px solid #7CA2C4; 
}
#PopularPosts1 li .item-snippet { 
overflow:hidden; 
font-family:Tahoma,Arial,verdana, sans-serif; 
font-size:10px; 
color:#289728; 
padding:0px 0px; 
margin:0px 0px; 
}
#PopularPosts1 .item-snippet a, 
#PopularPosts1 .item-snippet a:visited { 
color:#3E4548; 
text-decoration: none; 
}
#PopularPosts1 .spyWrapper { 
height: 100%; 
overflow: hidden; 
position: relative; 
}
#PopularPosts1 { 
-webkit-border-radius: 5px; 
-moz-border-radius: 5px; 
}
.tags span, 
.tags a { 
-webkit-border-radius: 8px; 
-moz-border-radius: 8px; 
}
a img { 
border: 0; 
}
--> 
</style> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script> 
<script type="text/javascript" charset="utf-8"> 
$(function () { 
$('.popular-posts ul').simpleSpy(); 
}); 
</script> 
<script src="http://accordion-for-blogger.googlecode.com/svn/trunk/simplespy.js" type="text/javascript"></script>

• அடுத்து SAVE பட்டனை அழுத்தி விட்ஜெட்டை சேமித்து கொள்ளுங்கள். 
• அடுத்து அந்த விட்ஜெட்டை நகர்த்தி popular Post விட்ஜெட்டுக்கு மேலே வைக்கவும். 

• இது போல வைத்தவுடன் SAVE பட்டனை அழுத்தி மாற்றங்களை சேமித்து கொண்டு உங்கள் பிளாக்கரில் சென்று பாருங்கள்.

உங்களுடைய Popular Posts விட்ஜெட் Animated widget ஆக மாறி இருக்கும்.

பதிவு பிடித்து இருந்தால் கீழே உள்ள ஓட்டு பட்டைகளில் ஓட்டு போட்டு செல்லுங்கள்.

/**இதையும் பாருங்கள் **/

Samsung new releases Galaxy tab 7.7 with 1.4GHz Processor



நன்றி.............வந்தேமாதரம்          http://www.vandhemadharam.com/