Blogspot ব্লগে Sitemap Widget যোগ করার সহজ নিয়ম
ইউটিউবের পাশাপাশি আপনারা যারা Blogspot ব্লগে একটি সুন্দর ওয়েব সাইট বানিয়ে এডসেন্স এর সাহায্যে টাকা ইনকাম করতে চান তাদের জন্য আজকের পোষ্ট অনেক গুরুত্বপূর্ন। কারণ আজকের পোষ্টে আমরা ব্লগারে Sitemap Widget যোগ করার সহজ নিয়ম শিখব
Blogspot বা Blogger ব্লগে Sitemap Widget যুক্ত করলে আপনার ব্লগের পোস্টগুলো ইউজার বা পাঠকদের কাছে সহজে খুঁজে পাওয়া যায়। পাশাপাশি এটি ব্লগের নেভিগেশন আরও সুন্দর করে। তাছাড়া একটি বিষয় যখন অনেক গুলো আর্টীকেল লিখা হয়, ঠিক তখন সব গুলো পোষ্ট এই সাইট ম্যাপের সাহায্যে খুব সহজেই খুজে পাওয়া যায়।
Sitemap Widget কী?
Sitemap হলো এমন একটি পেজ বা Widget যেখানে আপনার ব্লগের বিভিন্ন পোস্ট সুন্দরভাবে তালিকাভুক্ত থাকে। এর মাধ্যমে ইউজার বা পাঠক সহজেই পুরোনো ও নতুন পোস্ট খুঁজে দেখতে পারেন।
Blogspot-এ Sitemap Widget যোগ করার নিয়ম
প্রথমে আপনার Blogger Dashboard-এ লগইন করুন। এরপর Theme → Edit HTML অপশনে যান।
*/ .mapasite { margin-bottom: 10px; background-color: #F8F8F8 } .mapasite.active .mapa { display: block } .mapasite .mapa { display: none } .mapasite h2 { background-color: #EEE; color: #000; font-size: 15px; padding: 10px 20px; border-radius: 2px; margin-bottom: 0; cursor: pointer; font-weight: 700 } .mapasite h2 .botao { font-size: 18px; line-height: 1.2em } .botao .fa-minus-circle { color: #f30 } .mapapost { overflow: hidden; margin-bottom: 20px; height: 70px; background-color: #FFF } .mapa { padding: 40px } .map-thumb { background-color: #F0F0F0; padding: 10px; display: block; width: 65px; height: 50px; float: left } .map-img { width: 65px; height: 50px; overflow: hidden; border-radius: 2px } .map-thumb a { width: 100%; height: 100%; display: block; transition: all .3s ease-out!important; -webkit-transition: all .3s ease-out!important; -moz-transition: all .3s ease-out!important; -o-transition: all .3s ease-out!important } .map-thumb a:hover { -webkit-transform: scale(1.1) rotate(-1.5deg)!important; -moz-transform: scale(1.1) rotate(-1.5deg)!important; transform: scale(1.1) rotate(-1.5deg)!important; transition: all .3s ease-out!important; -webkit-transition: all .3s ease-out!important; -moz-transition: all .3s ease-out!important; -o-transition: all .3s ease-out!important } .mapapost .wrp-titulo { padding-top: 10px; font-weight: 700; font-size: 14px; line-height: 1.3em; padding-left: 25px; padding-right: 10px; display: block; overflow: hidden; margin-bottom: 5px } .mapapost .wrp-titulo a { } .mapapost .wrp-titulo a:hover { color: #f30; text-decoration: underline } .map-meta { display: block; float: left; overflow: hidden; padding-left: 25px; } .mapasite h2 .botao { float: right }
এবার উপরের কোডটি সম্পূর্ন কপি করুন। HTML-এর মধ্যে
]]></b:skin> এই কোডটি খুঁজে বের করে তার ঠিক উপরে কোডটি ]]></b:skin> লাইনের উপরে পেস্ট করুন।
<script type='text/javascript'> //<![CDATA[ var text_month = [, "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sept", "Oct", "Nov", "Dec"]; var no_image_url = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-mq-uYnI-eIHOyYkLu-ZZlw7C9xo76MQNmQCX1qK2fuSrFmTys6DNinpSCS2YT0XeC6j3JV9oerlHtJgMPKUZu6Kvx9U-schhbl5y5La9dLW-15Gdo5hqcKPeiYtY5RPlQcI1YYAM5P8/s1600-r/nth.png"; var static_page_text = $.trim($('.static_page .post-body').text()); if (static_page_text === "[sitemap]") { var postbody = $('.static_page .post-body'); $.ajax({ url: "/feeds/posts/default?alt=json-in-script", type: 'get', dataType: "jsonp", success: function(dataZ) { var blogLabels = []; for (var t = 0; t < dataZ.feed.category.length; t++) { blogLabels.push(dataZ.feed.category[t].term) } var blogLabels = blogLabels.join('/'); postbody.html('<div class="siteLabel"></div>'); $('.static_page .post-body .siteLabel').text(blogLabels); var splabel = $(".siteLabel").text().split("/"); var splabels = ""; for (get = 0; get < splabel.length; ++get) { splabels += "<span>" + splabel[get] + "</span>" } $(".siteLabel").html(splabels); $('.siteLabel span').each(function() { var mapLabel = $(this); var mapLabel_text = $(this).text(); $.ajax({ url: "/feeds/posts/default/-/" + mapLabel_text + "?alt=json-in-script", type: 'get', dataType: "jsonp", success: function(data) { var posturl = ""; var htmlcode = '<div class="mapa">'; for (var i = 0; i < data.feed.entry.length; i++) { for (var j = 0; j < data.feed.entry[i].link.length; j++) { if (data.feed.entry[i].link[j].rel == "alternate") { posturl = data.feed.entry[i].link[j].href; break } } var posttitle = data.feed.entry[i].title.$t; var author = data.feed.entry[i].author[0].name.$t; var get_date = data.feed.entry[i].published.$t, year = get_date.substring(0, 4), month = get_date.substring(5, 7), day = get_date.substring(8, 10), date = text_month[parseInt(month, 10)] + ' ' + day + ', ' + year; var tag = data.feed.entry[i].category[0].term; var content = data.feed.entry[i].content.$t; var $content = $('<div>').html(content); var src2 = data.feed.entry[i].media$thumbnail.url; htmlcode += '<div class="mapapost"><div class="map-thumb"><div class="map-img"><a href="' + posturl + '" style="background:url(' + src2 + ') no-repeat center center;background-size: cover"/></div></div><h3 class="wrp-titulo"><a href="' + posturl + '">' + posttitle + '</a></h3><div class="map-meta"><span class="p-author">' + author + '</span><span class="p-date">' + date + '</span></div></div>' } htmlcode += '</div>'; mapLabel.replaceWith('<div class="mapasite"><h2>' + mapLabel_text + '<span class="botao"><i class="fa fa-plus-circle"></i></span></h2>' + htmlcode + '</div>'); $(document).on('click', '.mapasite h2', function() { $(this).parent('.mapasite').addClass('active'); $(this).find('.botao .fa').removeClass('fa-plus-circle').addClass('fa-minus-circle'); }); $(document).on('click', '.mapasite.active h2', function() { $(this).parent('.mapasite').removeClass('active'); $(this).find('.botao .fa').addClass('fa-plus-circle').removeClass('fa-minus-circle'); }); } }); }); } }); } //]]> </script>
এবার পূনরায় উপরের কোডটি কপি করুন এবং আপনার ব্লগ সাইটের কোডের HTML এর মধ্যে </body> খুঁজে বের করে তার ঠিক উপরে কোডটি পেস্ট করতে হবে। এটা ছিলো আপনার ব্লগ সাইটের মধ্যে HTML কোডের মধ্যে কোড গুলো বসানো। এবার সেভ করে পূনরায় ব্লগারের ডেসবোর্ডে ফিরে যান।
Page এ ক্লিক করে একটি নতুন পেজ তৈরী করুন-
উপসংহার
Blogspot ব্লগে Sitemap Widget যোগ করা খুবই সহজ। সঠিকভাবে কোড যুক্ত করলে পাঠকরা আপনার ব্লগের পোস্টগুলো সহজে খুঁজে পাবেন এবং ব্লগের নেভিগেশনও আরও ব্যবহারবান্ধব হবে।
Keyword:
Blogspot ব্লগে Sitemap Widget যোগ করার সহজ নিয়ম
Blogger Sitemap Widget
Blogger ব্লগে Sitemap যোগ করার নিয়ম
Blogspot Sitemap তৈরি
Blogger Sitemap তৈরি করার নিয়ম
Blogger ব্লগে Sitemap যোগ করা
Blogspot Sitemap Code
Blogger Sitemap Widget Code
Blogspot Sitemap Tutorial
Blogger SEO SitemapSitemap Widget
Blogspot Sitemap
Blogger Sitemap
Sitemap Code
Blogger SEO
Blogspot Sitemap Widget
Blogspot Sitemap Widget
Blogger Sitemap
Blogspot ব্লগে Sitemap যোগ করার নিয়ম
No comments