How to make a free and stylish html sitemap in blogger or other website

ব্লগার অথবা অন্য যেকোন ওয়েব সাইটের জন্য সাইটম্যাপ খুবই গুরুত্ব পূর্ন। সাইট ম্যাপ থাকলে ভিজিটর খুব সহজেই তার পছন্দের পোস্টটি খুজে পেতে পারে। সাইট ম্যাপ সার্চ ইঞ্জিন ফ্রেন্ডলি। এস ই ও এর জন্য সাইট ম্যাপ এর প্রয়োজন। ওয়েব মাস্টারে আপনার সাইটের কন্টেন্ট জমা দিতেও সাইট ম্যাপের প্রয়োজন। আজ আপনাদের দেখাবো কিভাবে ব্লগে অথবা অন্যান্য ওয়েব সাইটে একটি স্ট্যাইলিস্ট সাইট ম্যাপ তৈরি করবেন ?

প্রথমে আপনার ব্লগে একটি সিএসএস কোড প্রতিস্থাপন করতে হবে। যা আপনার সাইট ম্যাপ এর সৌন্দর্য বৃদ্ধিতে সহায়তা করবে।

1. প্রথমে আপনার ব্লগার একাউন্টে লগ ইন করুন।

2. ড্যাসবোর্ড থেকে “থিম অথবা টেম্পলেট” এ প্রবেশ করুন

3. “Edit HTML” এ ক্লিক করুন,

4. কন্ট্রোল এফ চেপে ]]></b:skin> এই কোডটি আপনার থিম থেকে খুজে বের করুন, অথবা মেনুয়ালী ]]></b:skin> এই কোডটি আপনার থিম থেকে খুজে বের করুন।

/* Sitemap plugin By MyBloggerLab */
#bp_toc {
    color: #666;
    margin: 0 auto;
    padding: 0;
    border: 1px solid #d2d2d2;
    float: left;
    width: 100%;
}
span.toc-note {
    display: none;
}
#bp_toc tr:nth-child(2n) {
    background: #f5f5f5;
}
td.toc-entry-col1 a {
    font-weight: bold;
    font-size: 14px;
}
.toc-header-col1,
.toc-header-col2,
.toc-header-col3  {
background:#9E9E9E;
}
.toc-header-col1 {
    padding: 10px;
    width: 250px;
}
.toc-header-col2 {
    padding: 10px;
    width: 75px;
}
.toc-header-col3 {
    padding: 10px;
    width: 125px;
}
.toc-header-col1 a:link,
.toc-header-col1 a:visited,
.toc-header-col2 a:link,
.toc-header-col2 a:visited,
.toc-header-col3 a:link,
.toc-header-col3 a:visited {
    font-size: 13px;
    text-decoration: none;
    color: #fff;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.toc-header-col1 a:hover,
.toc-header-col2 a:hover,
.toc-header-col3 a:hover {
    text-decoration: none;
}
.toc-entry-col1,
.toc-entry-col2,
.toc-entry-col3 {
    padding: 5px;
    padding-left: 5px;
    font-size: 12px;
}
.toc-entry-col1 a,
.toc-entry-col2 a,
.toc-entry-col3 a {
    color: #666;
    font-size: 13px;
    text-decoration: none
}
.toc-entry-col1 a:hover,
.toc-entry-col2 a:hover,
.toc-entry-col3 a:hover {
    text-decoration:underline;
}
#bp_toc table {
    width: 100%;
    margin: 0 auto;
    counter-reset: rowNumber;
}
.toc-entry-col1 {
    counter-increment: rowNumber;
}
#bp_toc table tr td.toc-entry-col1:first-child::before {
    content: counter(rowNumber);
    min-width: 1em;
       min-height: 3em;
    float: left;
    border-right: 1px solid #fff;
    text-align: center;
    padding: 0px 11px 1px 6px;
    margin-right: 15px;
}
td.toc-entry-col2 {
    text-align: center;
}

5.উপরের বক্স থেকে কোড কপি করে ]]></b:skin> এর পূর্বে/ আগে পেস্ট করুন।

6. থিম সেভ করে বেড়িয়ে যান।

7. ড্যাসবোর্ড থেকে একটি নতুন পৃষ্ঠা খুলুন এবং পৃষ্ঠার নাম হিসাবে Sitemap লেখুন।

8. ডান পাশের “Options” মেনু থেকে Reader comments টিকে Don't allow করে দিন।

9. উপরের বক্স থেকে কোড কপি করে পেজের এইস টি এম এল এ পেস্ট করে পেজটি পাবলিশ করে দিন।

10. এখন আপনার হোম পেজে যেকোন অংশে উক্ত পেজের লিঙ্ক সাইট ম্যাপ হিসাবে ব্যবহার করতে পারবেন।

আশা করছি আপনি সফল হবেন। কোন সমস্যা হলে পুনরায় চেষ্টা করুন অথবা কমেন্ট বক্সে সমস্যা কমেন্ট করে জানাবেন। ধন্যবাদ।