ব্লগারে একটি আকর্ষণীয় HTML Sitemap Page তৈরী করে নিন


হ্যালো বন্ধুরা, TechRajjo.Com – Create Your Own Creativity তে আপনাকে স্বাগতম । কেমন আছেন সবাই ? নিশ্চয় ভালো আছেন । আর ভালো আছেন বলেই হয়তো আমাদের টেক রাজ্য থেকে আপনার পছন্দের এই আর্টিকেলটি পড়তে বসছেন । আমরা আমাদের টেক রাজ্যে প্রতিনিয়ত প্রযুক্তি বিষয়ক বিভিন্ন আর্টিকেল শেয়ার করে থাকি । যাতে মানুষ প্রযুক্তিকে সহজে জানতে ও বুঝতে পারে ।  তারই ধারাবাহিকতায় আজকে আপনাদের জন্য নিয়ে এসেছি প্রযুক্তি বিষয়ক আরেকটি আর্টিকেল । পোস্টের টাইটেল পড়ে এতক্ষণে নিশ্চয় বুঝে গেছেন যে, আজকে আমরা কোন বিষয় নিয়ে আলোচনা করবো ।

তার আগে আপনার কাছে আমাদের রিকুয়েস্ট, আপনি যদি আমাদের ব্লগটি সাবস্ক্রাইব না করে থাকেন, তাহলে এখনি সাবস্ক্রাইব করে নিন । তাহলে প্রযুক্তি বিষয়ক নিত্যনতুন আর্টিকেল সবার আগে পৌঁছে যাবে আপনার কাছে ।

তাহলে চলুন আর কথা না বাড়িয়ে মূল আলোচনায় ফিরে যাই ।

সাইটম্যাপ  কিঃ সাইটম্যাপ তৈরি করার আগে আমাদের জানতে হবে সাইটম্যাপ আসলে কি ? সহজ ভাষায় বলা যায় সাইটম্যাপ হচ্ছে আপনার ওয়েবসাইটের সমুদয় পোষ্ট এর সারসংক্ষেপ। সাইটম্যাপের মাধ্যমে Search Engine সহজে বুঝে নিতে পারে যে, আপনার ব্লগে/ওয়েবসাইটে কতগুলো পোষ্ট রয়েছে। যার ফলশ্রুতিতে যে কোন সার্চ ইঞ্জিন আপনার সাইটের কনটেন্ট গুলি Index করে সার্চ রেজাল্টে নিয়ে আসে। এটি হচ্ছে বিভিন্ন সার্চ ইঞ্জিনে আপনার ব্লগ/ওয়েবসাইট সাবমিটের পদ্ধতী।  আপনার ব্লগ পোষ্ট তাড়াতাড়ি সার্চ ইঞ্জিনে Index হওয়ার জন্য অবশ্যই  Google, Yahoo এবং Bing ওয়েবমাষ্টার টুলে সাবমিট করে রাখবেন। Google Webmaster Tool Url Fetch করার মাধ্যমে খুবই দ্রুত আপনার পোষ্ট সার্চ ইঞ্জিনে Index করতে পারেন। আর সাইটম্যাপ এর কাজ যদি আপনি সফলভাবে করতে পারেন তাহলে এটি আপনার ব্লগের জন্য অবশ্যই সুফল বয়ে আনবে । আর এটা আপনি নিজেই বুঝতে পারবেন যখন আপনি Google, Yahoo এবং Bing এর ওয়েবমাষ্টার টুলে প্রবেশ করবেন । তবে তার আগে অবশ্যই আপনাকে সাইটম্যাপ সাবমিট করে রাখতে হবে ।
কিন্তু আমি যে HTML Sitemap Page টি তৈরী করা দেখাবো এটি হচ্ছে আপনার পাঠকের জন্য। যার মাধ্যমে পাঠকরা জানতে পারবে আপনার ব্লগে কতগুলি পোষ্ট রয়েছে। এ ছাড়াও আর সুবিধা হচ্ছে যে, এই HTML Sitemap Page টি প্রত্যেকটি Label-কে আলাদা আলাদাভাবে দেখাবে। যার ফলে ভিজিটররা সহজে তাদের পছন্দমত লিংকগুলি ভিজিট করতে পারবে। তাছাড়া নতুন পোষ্টগুলি অটোমেটিকভাবে Indicate করবে যে, কোন গুলি নতুন পোষ্ট। এই পোষ্টটি হয়ত বিভিন্ন ব্লগে অনেকবার করা হয়েছে। তার পরও নতুন করে শেয়ার করছি, কারণ আমি এটিতে নতুন কিছু ফিচার যুক্ত করার পাশাপাশি সব ধরনের Browsers Compatibility করেছি। যা এটিকে আরও আকর্ষণীয় করে তুলবে। তাছাড়া বাংলা ব্লগের জন্য ফন্টের কিছু সমস্যা ছিল, তা Solve করেছি। আশা করি আপনাদের ভাল লাগবে।


 যে ভাবে ব্লগে যুক্ত করবেনঃ
  • প্রথমে আপনার ব্লগে লগইন করুন।
  • তারপর ব্লগার ড্যাশবোর্ড হতে Page এ ক্লি করুন।
  • এখন Create a New Page এ ক্লিক করুন।
  • এরপর পেজটির HTML এ ক্লিক করুন।
  • নিচের কোডগুলি কপি করে HTML পেজে পেষ্ট করুন।

<style type="text/css">
#sitemap {
   width:100%;
   margin:5px auto;
   margin-left: 4px;
   border:1px solid #23A839;
   border-top:0px solid #2D96DF;
}
.label {
   color:#FF5F00;
   font-weight:bold;
   margin: -16px -1px 0px;
   padding:1px 0 2px 11px;
   background: -webkit-linear-gradient(right,#6DFC85 0%,#23A839 40%); /* For Safari 5.1 to 6.0 */
   background: -o-linear-gradient(right,#6DFC85 0%,#23A839 40%); /* For Opera 11.1 to 12.0 */
   background: -moz-linear-gradient(right,#6DFC85 0%,#23A839 40%); /* For Firefox 3.6 to 15 */
   background: linear-gradient(right,#6DFC85 0%,#23A839 40%); /* Standard syntax */
   border:1px solid #23A839;
   border-radius:0px;
   -moz-border-radius:0px;
   -webkit-border-radius:0px;
   display:block;
}
.label a {color:#fff;}
.label:first-letter {text-transform:uppercase;}
.new {
   color:#FF5F00;
   font-weight:bold;
   font-style:italic;
}
.postname {
   font-weight:normal;
   background: -webkit-linear-gradient(right,#6DFC85 0%,#FFF 40%); /* For Safari 5.1 to 6.0 */
   background: -o-linear-gradient(right,#6DFC85 0%,#FFF 40%); /* For Opera 11.1 to 12.0 */
   background: -moz-linear-gradient(right,#6DFC85 0%,#FFF 40%); /* For Firefox 3.6 to 15 */
   background: linear-gradient(right,#6DFC85 0%,#FFF 40%); /* Standard syntax */
}
.postname li {
   border-bottom: #DDD 1px dotted;
   margin-right:5px
}
a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {text-decoration:underline;}
</style>

<div id="sitemap">
<script type="text/javascript" src="https://cdn.rawgit.com/prozokti/rashid/master/sitemap.js"></script>
<script src="https://www.techrajjo.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadsitemap"></script>
</div>
Code ID No. TRCN-5190001

Downoad
  • এখন www.techrajjo.com  এর জায়গায় আপনার ব্লগের এড্রেস দিয়ে দিন।
  • সবশেষে Publish বাটনে ক্লিক করলেই তৈরি হয়ে গেলো আপনার ব্লগের জন্য আকর্ষণীয় একটি সাইটম্যাপ ।
  • এবার যদি আপনি পেজটি ভিউ করেন তাহলে আপনি নিজেই দেখতে পারবেন যে কত আকর্ষণীয় একটি সাইটম্যাপ তৈরি করে ফেলেছেন আপনি । আর সেটা করতে আপনার ৫ মিনিট সময়ও হয়তো লাগে নি ।
  • আরেকটি কথা - আপনি যদি আমাদের ব্লগটি সাবস্ক্রাইব না করে থাকেন, তাহলে এখনি সাবস্ক্রাইব করে নিন । তাহলে প্রযুক্তি বিষয়ক নিত্যনতুন আর্টিকেল সবার আগে পৌঁছে যাবে আপনার কাছে ।
শেষ কথাঃ আপনার মূল্যবান সময় ব্যয় করে আলোচ্য আর্টিকেলটি পড়ার জন্য আপনাকে অসংখ্য ধন্যবাদ । আমি আশা করবো উক্ত আর্টিকেলটির মাধ্যমে আপনি সামান্য কিছু হলেও জানতে, বুঝতে ও শিখতে পেরেছেন । তারপরও যদি কারও বুঝতে অসুবিধা হয় কিংবা কোন প্রকার সমস্যা হয় তাহলে কমেন্ট করে আমাদের জানাতে পারেন। আমরা আপনার সমস্যা সমাধানের জন্য চেষ্টা করবো, ইনশাআল্লাহ।
আজ এ পর্যন্তই । আবার আপনাদের সামনে হাজির হবো অন্য কোন প্রযুক্তি বিষয়ক আর্টিকেল নিয়ে । ততদিন সবাই ভালো থাকুন, সুস্থ্য থাকুন আর টেক রাজ্যের সাথেই থাকুন । ধন্যবাদ...

ব্লগারে একটি আকর্ষণীয় HTML Sitemap Page তৈরী করে নিন ব্লগারে একটি আকর্ষণীয় HTML Sitemap Page তৈরী করে নিন Reviewed by CEO on Friday, May 10, 2019 Rating: 5

No comments:

It can be commented that the post was good. You can also comment on any problem. We will try to solve as much as possible.

Powered by Blogger.