ব্লগে যুক্ত করুন ছবি ছাড়া related post widget (ব্লগার দিয়ে প্রফেশনাল ওয়েবসাইট তৈরি পর্ব-৫)

ads

খুব সহজে ওয়েবসাইটের তৈরির পঞ্ঝম পর্বে আপানাদের স্বাগতম।এই পর্বে দেখাবো কিভাবে ছাড়া সহ রিলেটেড পোস্ট যোগ করতে হয়।এটি ব্লগের জন্য খুবই গুরুত্বপূর্ণ।একজন ভিজিটরকে অনেক সময়
ব্লগে ধরে রাখার জন্য টি খুবই কার্যকর।যার ফ্রলশ্রুতিতে দেখা যায় আপনার ব্লগের পেজ ভিউ অনেকগুনে বেড়ে যায়।এছারা ছবি ছবি ছাড়া রিলেটেড পোস্ট এড করলে ব্লগের লোডীং স্পিড বেরে অনেকটা যায়।
ব্লগার নিয়ে সবগুলি ধারাবাহিক টিউটোরিয়াল দেখুন ব্লগার টিউটোরিয়াল

ব্লগে যুক্ত করুন ছবি ছাড়া related post widget

কিভাবে Blogger Default Featured Post Widget,ব্লগে যুক্ত করুন ছবি সহ related post widget,ব্লগ পোষ্টের নিচে যুক্ত করুন আকর্ষণীয় Related Posts Widget,আসুন গুগুল ব্লগ দিয়ে নিজের ওয়েব সাইট তৈরি করি,কিভাবে ব্লগ/ওয়েব সাইট তৈরি করবেন ও সেখান হতে আয় করবেন,ওয়েবসাইট তৈরি করার নিয়ম,ওয়েবসাইট তৈরি করুন,ফ্রি ওয়েব সাইট তৈরি,বিনা খরচে তৈরী করুন ওয়েব সাইট,বিনামূল্যে বানান নিজের ওয়েবসাইট,ব্লগ, ব্লগার এবং ব্লগিং কি? ব্লগিং করার জন্য সেরা ১২ টি ব্লগিং সাইট,একটি নতুন ব্লগের জন্য backlink বৃদ্ধি করার ৫টি পদ্ধতি ,নিয়ে নিন কিছু অসাধারন টেমপ্লেট আপনার ব্লগার ব্লগের জন্য,bd tech tunes,trick bangla,bd tech blog

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

প্রথমে আপনার ব্লগে লগইন করুন।

এরপর Template এ ক্লিক করে টেম্পলেট ব্যাকাপ নিয়ে নিন।তারপর  Edit Html এ ক্লিক করুন।

তারপর কিবোর্ড হতে Ctrl+F চেপে </head> অংশটি সার্চ করুন।

এখন নিচের কোডগুলি

<!--Related Posts Scripts and Styles Start-->
    <style>
    #related-posts {
    float : left;
    width : 350px;
    margin-top:20px;
    margin-left : 5px;
    margin-bottom:20px;
    font : 11px Verdana;
    margin-bottom:10px;
    }
    #related-posts .widget {
    list-style-type : none;
    margin : 5px 0 5px 0;
    padding : 0;
    }
    #related-posts .widget h2, #related-posts h2 {
    font-size : 20px;
    font-weight : normal;
    margin : 5px 7px 0;
    padding : 0 0 5px;
    }
    #related-posts a {
    text-decoration : none;
    }
    #related-posts a:hover {
    text-decoration : none;
    }
    #related-posts ul {
    border : medium none;
    margin : 10px;
    padding : 0;
    }
    #related-posts ul li {
    display : block;
    background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCNvf42Flwyi19QPzv7IY5iIHOutdHZWLpZN7IEyWyuB0yDpBrsf2cEP52mB5UZysKDBCR6odu6D_7K711AnvsWcwVUZizi2CMbRv-J4aCeyqlVcuAZM7x_pNKhwgizlyqwd6RtSEESQw/s200/greentickbullet.png) no-repeat 0 0;
    margin : 0;
    padding-top : 0;
    padding-right : 0;
    padding-bottom : 1px;
    padding-left : 21px;
    margin-bottom : 5px;
    line-height : 2em;
    border-bottom:1px dotted #cccccc;
    }
    </style>
    <script type='text/javascript'>
    //<![CDATA[
    var relatedTitles = new Array();
    var relatedTitlesNum = 0;
    var relatedUrls = new Array();
    function related_results_labels(json) {
    for (var i = 0; i < json.feed.entry.length; i++) {
    var entry = json.feed.entry[i];
    relatedTitles[relatedTitlesNum] = entry.title.$t;
    for (var k = 0; k < entry.link.length; k++) {
    if (entry.link[k].rel == 'alternate') {
    relatedUrls[relatedTitlesNum] = entry.link[k].href;
    relatedTitlesNum++;
    break;
    }
    }
    }
    }
    function removeRelatedDuplicates() {
    var tmp = new Array(0);
    var tmp2 = new Array(0);
    for(var i = 0; i < relatedUrls.length; i++) {
    if(!contains(tmp, relatedUrls[i])) {
    tmp.length += 1;
    tmp[tmp.length - 1] = relatedUrls[i];
    tmp2.length += 1;
    tmp2[tmp2.length - 1] = relatedTitles[i];
    }
    }
    relatedTitles = tmp2;
    relatedUrls = tmp;
    }
    function contains(a, e) {
    for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
    return false;
    }
    function printRelatedLabels() {
    var r = Math.floor((relatedTitles.length - 1) * Math.random());
    var i = 0;
    document.write('<ul>');
    while (i < relatedTitles.length && i < 20) {
    document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>');
    if (r < relatedTitles.length - 1) {
    r++;
    } else {
    r = 0;
    }
    i++;
    }
    }
    //]]>
    </script>
    <!--Related Posts Scripts and Styles End-->

এবার সার্চ করুন   

<b:includable id='postQuickEdit' var='post'>

এটি।আপনি দুই বার পাবেন দ্বিতীয়টির উপরে নিচের কোডটী পেস্ট করুন.এই কোডটি দুই বার পেতে পারেন।একটি মোবাইল ভিউ অপরটি ডেস্কটপ ভিউ এর জন্য।

<!-- Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<font face='Arial' size='5'><b>You May Also Like: </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if><b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div>
</b:if>
<!-- Related Posts with Thumbnails Code End-->

এগুলি দেখুন
 কিভাবে আপনার ব্লগের post a comment message চেঞ্জ করবেন 
  আপণার ব্লগে যোগ করুন feature post widget 
  ব্লগে যুক্ত করুন TOTAL POST AND COMMENT WIDGET 

কাষ্টমাইজেশনঃ max-results=5 এর জায়গায় আপনি যতগুলি পোস্ট দেখাতে চান তা সংখ্যায়  লিখুন।

আশাকরি পোস্টটি আপনাদের ভাল লেগেছে।শেয়ার এবং কমেন্ট করে যাবেন।আমাদের আমাদের পোস্টগুলি আপনি চাইলে ইমেইলের মাধ্যমে পেতে পারেন এর জন্য নিচে ইমেইল বক্সে সাসক্রাইব করুন।ধন্যবাদ।