লিস্ট স্টাইল Related Poast ওয়েডগেট ব্লগস্পট ব্লগের জন্য ।

বন্ধুরা আজকে আমি আপনাদের জন্য সুন্দর একটি ওয়েডগেট নিয়ে এলাম আসলে ওয়েডগেটা কি আপনারা আমার টাইটেল দেখেই বুজতে পেরে গেছেন । হুম ঠিক ধরেছেন এটা Related Post বাংলাতে এটা বিভিন্ন ব্লগে সাম্প্রতিক কিছু পোস্ট বা আপনার জন্য এই ধরনের আরও কিছু পোস্ট ভিন্ন ভিন্ন নাম দেওয়া থাকে নাম ভিন্ন থাকলেও এটা কাজ কিন্তু একি । আশাকরি নতুন করে আর কিছুই বলার নাই যে এটির কাজ কি ? তাও যারা নতুন তাদের জন্য কিছু কথা বলে রাখা ভালো তাদের কাজে এবং বুজতে অনেক সুবিধা হবে ।

Related Post এর কাজ একি ধরনের মানে একি বিভাগের বিভিন্ন পোস্ট গুলোকে পোস্ট এর নীচে দেখানো । আমার এই পোস্ট এর নীচে লক্ষ করুন Related পোস্ট নামে একটি ওয়েডগেট আছে এবং তাতে কিছু লিঙ্ক আছে তাতে ক্লিক করেলেই আপনি কাংখিত লিঙ্কে চলে যাবেন । অনেকের মনে প্রশ্ন এটা কিভাবে কাজ করে ? এটা আপনার ব্লগের বিভাগ এর উপর নির্ভর করে কাজ করে । ধরুন আপনি আপনার একটি পোস্ট এর বিভাগ দিলেন ব্লগার টিপস বা পিসি টিপস এবং অন্য একটি পোস্টে একি বিভাগ দিলেন তখুন আপনি ও দুটি পোস্ট এর মধ্যে যেকোনো একটি পোস্ট ওপেন করলে নীচে দেখবেন অন্য আর একটি সেম বিভাগের পোস্ট Related Post হিসাবে দেখাছে । আশাকরি বিষয়টি বুঝাতে পারলাম এবং আপনিও বুজতে পারলেন । 








♦ উপরের ডেমো বাটনে ক্লিক করলেই Related Post ওয়েডগেট দেখতে পাবেন ওখানে যেটা দেখতে পাবেন ঠিক সেরকম আপনার ব্লগেও দেখাবো । আগেই বলেছে এটা ভিন্ন স্টাইল এবং এটা লিস্ট আকারে দেখাবে তাই যদি আপনার পছন্দ হয় তাহলে আপনার ব্লগে অ্যাড করে দেখতে পারেন ।


কিভাবে আপনার ব্লগে যুক্ত করবেনঃ 


১// আপনার ব্লগার ব্লগ লগইন করুন তারপর ড্যাশবোর্ড থেকে Template এ ক্লিক করুন ।

২// এবার উপরের ডান পাশ থেকে আপনার থিম এর ব্যাকআপ নিয়ে নিন ।

৩// এবার একি পেজ থেকে Edit HTML এ ক্লিক করুন  ।

৪// এবার আপনার কীবোর্ড এর Ctrl+F প্রেস করে নীচের কোড খুজে বের করুন ।


]]></b:skin>


৫// উপরের কোডটি খুজে পেলে তারঠিক উপরের নীচের কোড গুলো কপি করে পেস্ট করুন ।



#BloggerSpiceRP { background-color:#FFF; margin:10px 0 0 0; padding:10px; -moz-box-shadow:inset 0 0 1px #000000; -webkit-box-shadow:inset 0 1px 1px #000000; box-shadow:inset 0 0 1px #000000 }
#BloggerSpiceRP h4 { color:#fff; font-size:15px; margin:-10px -10px 10px; padding:5px 3px; text-align:center; font-weight:bold; -moz-text-shadow:2px 0 0 #333; -webkit-text-shadow:2px 0 0 #333; text-shadow:2px 0 0 #333; position:relative; background-color:#00B4FF }
#BloggerSpiceRP ul,#related_posts li { overflow:hidden; padding:0; margin:0; list-style:none }
#BloggerSpiceRP ul { margin-top:10px }
#BloggerSpiceRP li { float:left; width:100%; margin:0 0 5px}
#BloggerSpiceRP .gmbrrltd { background-color:#f7f7f7; float:left; margin:0 5px 0 0; padding:3px; border:1px solid #ddd; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px }
#BloggerSpiceRP strong { font-weight:bold; font-size:15px; line-height:1.1em }
#BloggerSpiceRP p { margin:2px 0 0; font-size:12px }
.loadingxx { width:100%; min-height:150px; background:transparent url(http://2.bp.blogspot.com/-bL-eL_VIl2A/UoHFt0i8-wI/AAAAAAAAFI8/vn7h5nIbz6A/s1600/bs+loading+dot.gif) no-repeat center; display:block; text-indent:-9999px }



৬// Save Template এ ক্লিক করে সেভ করুন । এবার নীচের দ্বিতীয় এবং শেষ স্টেপ দেখুন ।


৭// এবার আপনার একি ভাবে আপনার কীবোর্ড এর Ctrl+F প্রের করে নীচের কোড খুজে বের করুন ।


</head>


৮// উপরের কোডটি খুজে পেলে তার ঠিক উপরের নীচের কোডটি কপি করে পেস্ট করুন ।


<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>


নোটঃ উপরের মানে ৭ এবং ৮ নাম্বার স্টেপ এর কাজ মানে jquery যদি আপনি আগে থেকে আপনার টেম্পলেটে ব্যবহার করেফেলেছেন তাহলে ঐ কাজটি আবার করার কোন দরকার নেই । এবার নীচের স্টেপে চলেযান ।


৯// এবার ঠিক একি ভাবে আপনার কীবোর্ড এর Ctrl+F প্রের করে নীচের কোড খুজে বের করুন ।


<div class='post-footer-line post-footer-line-1'>  বা  <div class='post-footer-line post-footer-line-2'>


১০// উপরের দুটি কোড এর মধ্যে যেটি খুজে পাবেন তার ঠিক পরে বা নীচে নীচের কোড গুলো কপি করে পেস্ট করুন ।



<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='BloggerSpiceRP'/>
<script type='text/javascript'>
//<![CDATA[
function relatedPostsWidget(a){(function(e){var f={blogURL:"",maxPosts:5,maxTags:5,maxPostsPerTag:5,containerSelector:"",tags:null,loadingText:"",loadingClass:"",relevantTip:"",rlt_summary:150,relatedTitle:"Related Posts",readMoretext:"Read More",rlpBlank:"http://3.bp.blogspot.com/-ciCUurobkhg/UoCtFhXRBuI/AAAAAAAAFIs/9FbIqQZ3KfU/s1600/BS+No+Image+White.png",rlt_thumb:70,recentTitle:"Recent Posts",postScoreClass:"",onLoad:false};f=e.extend({},f,a);var k=0,b=null,g=null;if(!f.containerSelector){document.write('<div id="BloggerSpiceRP"></div>');f.containerSelector="#BloggerSpiceRP"}var c=function(t,n){k++;if(t.feed.entry){for(var o=0;o<t.feed.entry.length;o++){var r=t.feed.entry[o];var p="";for(var m=0;m<r.link.length;m++){if(r.link[m].rel=="alternate"){p=r.link[m].href;break}}if("content" in r){var l=r.content.$t}else{if("summary" in r){var l=r.summary.$t}else{var l=""}}var l=l.replace(/<\S[^>]*>/g,"");if(l.length>f.rlt_summary){var l=l.substring(0,f.rlt_summary)+"..."}var q=r.title.$t;if("media$thumbnail" in r){var s=r.media$thumbnail.url.replace(/\/s[0-9]+\-c/g,"/s"+f.rlt_thumb+"-c")}else{var s=f.rlpBlank}if(location.href.toLowerCase()!=p.toLowerCase()){i(p,q,s,l)}}}if(k>=f.tags.length){g.attr("class","");e("#BloggerSpiceRP-loadingtext",b).remove();if(f.maxPosts>0){e("li:gt("+(f.maxPosts-1)+")",g).remove()}}};var i=function(p,s,u,l){var q=e("li",g);for(var o=0;o<q.length;o++){var t=e("a",q.eq(o));var r=j(t);if(t.attr("href")==p){h(t,++r);for(var n=o-1;n>=0;n--){var m=e("a",q.eq(n));if(j(m)>r){if(o-n>1){q.eq(n).after(q.eq(o))}return}}if(o>0){q.eq(0).before(q.eq(o))}return}}g.append('<li><a class="jdlunya" href="'+p+'" title="'+(f.relevantTip?f.relevantTip.replace("\d",1):"")+'"><span class="gmbrrltd"><img style="width:'+f.rlt_thumb+"px;height:"+f.rlt_thumb+'px;display: block" alt="'+s+'" src="'+u+'"/></span><strong>'+s+"</strong></a><p>"+l+'<a target="_blank" title="'+s+'" href="'+p+'">'+f.readMoretext+"</a></p></li>")};var j=function(l){var m=parseInt(l.attr("score"));return m>0?m:1};var h=function(l,m){l.attr("score",m);if(f.relevantTip){l.attr("title",f.relevantTip.replace("\d",m))}if(f.postScoreClass){l.attr("class",f.postScoreClass+m)}};var d=function(){if(f.containerSelector!="#BloggerSpiceRP"){var l=e(f.containerSelector);if(l.length!=1){return}b=e('<div id="BloggerSpiceRP"></div>').appendTo(l)}else{b=e(f.containerSelector)}if(!f.tags){f.tags=[];e('a[rel="tag"]:lt('+f.maxTags+")").each(function(){var n=e.trim(e(this).text().replace(/\n/g,""));if(e.inArray(n,f.tags)==-1){f.tags[f.tags.length]=n}})}if(f.tags.length==0&&!f.recentTitle){return}if(f.tags.length==0){e("<h4>"+f.recentTitle+"</h4>").appendTo(b)}else{if(f.relatedTitle){e("<h4>"+f.relatedTitle+"</h4>").appendTo(b)}}if(f.loadingText){e('<div id="BloggerSpiceRP-loadingtext">'+f.loadingText+"</div>").appendTo(b)}g=e("<ul "+(f.loadingClass?'class="'+f.loadingClass+'"':"")+"></ul>").appendTo(b);if(f.tags.length==0){e.get((f.blogURL===""?window.location.protocol+"//"+window.location.host:f.blogURL)+"/feeds/posts/summary?max-results="+f.maxPostsPerTag+"&orderby=published&alt=json-in-script",c,"jsonp")}else{for(var m=0;m<f.tags.length;m++){e.get((f.blogURL===""?window.location.protocol+"//"+window.location.host:f.blogURL)+"/feeds/posts/summary/-/"+f.tags[m]+"?max-results="+f.maxPostsPerTag+"&orderby=published&alt=json-in-script",c,"jsonp")}}};if(f.onLoad){e(window).load(d)}else{e(document).ready(d)}})(jQuery)};
relatedPostsWidget({
related_title: "Related Posts",
containerSelector: "#BloggerSpiceRP",
maxPosts: 4,loadingClass: "loadingxx",
rlt_thumb: 70
});
//]]>
</script>
<div class='clear'/>
  </b:if>



১১// ব্যাস কাজ শেষ এবার Save Template এ ক্লিক করে সেভ করে বেরিয়ে আসুন দেখুন আপনার ব্লগে Related Post যুক্ত হয়েগেছে ।


নোটঃ যদি শো না করে তাহলে আপনার পোস্টে গিয়ে দেখুন কোন বিভাগ সিলেক্ট করা আছে কিনা । যদি না থাকে তাহলে বিভাগ সিলেক্ট করুন । দেখুন এবার শো করবো ।


♦ কোন রকম সমস্যা হলে অবশ্যই আমাকে কমেন্ট করে যানাবেন । বা আমাদের ফেসবুক ব্লগার হেল্প গ্রুপে যানাবেন । এবং পোস্টটি ভালো লাগলে একটি কমেন্ট ও বন্ধুদের সাথে শেয়ার করতে ভুলবেন না ।



▬ভালো থাকবেন সুস্থ থাকবেন▬

▬আল্লাহ্‌ হাফেজ▬

এসো বন্ধু

আমি পারভেজ ব্লগিং এর সঙ্গে যুক্ত আছি গত বেশ কিছু বছর, বাংলা ব্লগিং এর সঙ্গে সঙ্গে আমি অন্য ভাষাতেও ব্লগিং করি। সেই সব কারনে ব্লগে নিয়তম থাকা হয়না, আপনাদের ভালোবাসা যদি আগের মত আবার ফিরে পাই তাহলে অবশ্যই নিয়মত হবার চেস্ট করবো। facebook telegram youtube twitter

একটি মন্তব্য পোস্ট করুন

আপনার একটি মন্তব্য একজন লেখক কে ভালো কিছু লিখার অনুপেরনা যোগাই তাই প্রতিটি পোস্ট পড়ার পর নিজের মতামত জানাতে ভুলবেন না । তবে বন্ধুরা এমন কোন মন্তব্য পোস্ট করবেন না যার ফলে লেখকের মনে আঘাত করে ! কারণ একটা ভাল মন্তব্য আমাদের আরও ভাল কিছু লিখার অনুপেরনা যাগাই !!

নবীনতর পূর্বতন

نموذج الاتصال