আসসালামু আলাইকুম , বন্ধুরা আজকে আমি আপনাদের সঙ্গে একদম নতুন স্টাইল রিলেটেড পোস্ট ওয়েডগেট নিয়ে এলাম এটা একদম নতুন স্টাইল এটা নতুন স্টাইল কারন এটাতে আছে যুম ইফেক্ট এবং এটা আপনার ব্লগের প্রতিটি পোস্টের নিচে দেখা যাবে । নতুন যারা তাদের উদ্দেশ্য বলি এটা আপনার ব্লগের বিভাগ অনুসারে আপনার পোস্টের নিচে এটা দেখা যাবে সঙ্গে ফটো । তাহলে চলুন দেখে যাক কিভাবে এটা ব্যবহার করবেন । নিচের সাধারন স্টেপ গুল একটু লক্ষ করে আপনার ব্লগে ব্যবহার করুন এই ওয়েডগেট টি ।
Related Post Widget Zoom Effect |
কিভাবে ব্যবহার করবেন রিলেটেড পোস্ট ওয়েডগেট :
- প্রথমে আপনার ব্লগার ব্লগ লগইন করুন
- ড্যাশবোর্ড থেকে Template → Edit HTML এ যান
- এবার কীবোর্ড এর CTRL+F প্রেস করে নিচের ট্যাগ খুজুন
</head>
- উপরের ট্যাগ খুজে পেলে তার ঠিক উপরে নিচের কোড গুল বসান
<!--Related Posts with zOOm Styles Start-->
<style type='text/css'>
.post-body img{
border:none;
box-shadow:0 0 0;
}
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-right:5px;
padding-left:5px;
}
#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a {
color: black;
transition: all 0.2s ease-in 0s;
}
#related-posts a:hover {
background-color: #232A2B;
transform: scale(1.3);
z-index: 5;
}
#related-posts a:hover {
background-color:#232A2B;
}
</style>
<script type='text/javascript'>
var defaultnoimage="http://1.bp.blogspot.com/_u4gySN2ZgqE/SosvnavWq0I/AAAAAAAAArk/yL95WlyTqr0/s400/noimage.png";
var maxresults=5;
var splittercolor="#d4eaf2";
var relatedpoststitle="Related Tricks For You";
</script>
<script src='http://netoopscodes.googlecode.com/svn/netoops-related-posts-with-thumbnails-blogger.js' type='text/javascript'/>
<!--Related Posts with zOOm Styles End-->
<style type='text/css'>
.post-body img{
border:none;
box-shadow:0 0 0;
}
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-right:5px;
padding-left:5px;
}
#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a {
color: black;
transition: all 0.2s ease-in 0s;
}
#related-posts a:hover {
background-color: #232A2B;
transform: scale(1.3);
z-index: 5;
}
#related-posts a:hover {
background-color:#232A2B;
}
</style>
<script type='text/javascript'>
var defaultnoimage="http://1.bp.blogspot.com/_u4gySN2ZgqE/SosvnavWq0I/AAAAAAAAArk/yL95WlyTqr0/s400/noimage.png";
var maxresults=5;
var splittercolor="#d4eaf2";
var relatedpoststitle="Related Tricks For You";
</script>
<script src='http://netoopscodes.googlecode.com/svn/netoops-related-posts-with-thumbnails-blogger.js' type='text/javascript'/>
<!--Related Posts with zOOm Styles End-->
- এবার একি ভাবে নিচের ট্যাগ খুজুন CTRL+F প্রেস করে
<data:post.body/> or <div class='post-footer'>
- এবার উপরের ট্যাগ এর ঠিক নিচে নিচের কোড গুল বসিয়ে দিন
<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=6"' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs("<data:post.url/>");
</script>
</div><div style='clear:both'/>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
</b:if></b:if>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=6"' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs("<data:post.url/>");
</script>
</div><div style='clear:both'/>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
</b:if></b:if>
ব্যাস এবার Save Template এ ক্লিক করুন এবং আপনার ব্লগ ভিজিট করে দেখুন আশাকরি আপনি কাজটি আমার মতই করতে সফল হয়েছেন । পোস্টটি থেকে বুঝতে কোন সমস্যা হলে নিচে কমেন্ট করুন ।। পোস্টটি ভাল লাগলে বন্ধুদের সঙ্গে শেয়ার করুন । ভাল থাকবেন সুস্থ থাকবেন আবারও দেখা হবে নতুন কিছু নিয়ে । আসসালামু আলাইকুম ।