খুব সহজে পোস্টের শেষে "বিস্তারিত পড়ুন" হটলিংক স্থাপন করুন

আমরা এর আগে কিভাবে ব্লগের প্রতিটি পোস্টের (post) শেষে "বিস্তারিত পড়ুন" (Read More) হটলিংক (Hotlink) লাগানো যায় তা জেনেছি। আমার কোন কোন পাঠক এই পদ্ধতিটিকে খুব জটিল বলে মন্তব্য করেছেন। আসলে HTML এর Code বিষয়ক কাজগুলো একটু জটিলই। তবে "বিস্তারিত পড়ুন" বসানোর জন্য এবার যে পদ্ধতিটি আপনাদেরকে জানাচ্ছি, তা আগেরটার তুলনায় অনেক সহজ। একটু চেষ্টা করলে আপনি নিজেই ব্লগে তা স্থাপন করতে পারবেন। চেষ্টা করে দেখুন। না পারলে জানাতে দ্বিধা করবেন না।

নতুন পদ্ধতিটি ইতিমধ্যেই প্রখ্যাত ব্লগারদের দৃষ্টি আকর্ষণ করতে পেরেছে। ব্লগার.কম (Blogger.com) টিম এই পদ্ধতিটিকে ডিফল্ট (Default) হিসেবে গ্রহণ করার কথা ভাবছে বলেও গুঞ্জন শোনা গেছে। এই অসাধারণ কাজটির খবর প্রথম প্রকাশিত হয় BloggerSphera ব্লগে। ইংরেজি ভাষায় খবরটি প্রকাশিত হয় Quite Random ব্লগে। জাভাস্ক্রিপ্ট (Java Script) দিয়ে তৈরি করা এই পদ্ধতিটি আগের সমস্ত পদ্ধতির চাইতে বেশি সুবিধাজনক। এতে কোন পোস্টে যদি ছবি থাকে তাহলে ছবিটির একটি স্বয়ংক্রিয় (Automatic) থাম্বনেইল (Thumbnail) পোস্টের সূচনায় দেখাবে। কতটুকু সারাংশ দেখাবে, থাম্বনেইল ভিউ (Thumbnail view) এর সাইজ (Size) পরিবর্তন করা যাবে ইত্যাদি কাজগুলো আপনি নিজেই করতে পারবেন। এছাড়াও ড্যাশবোর্ডের (Dashboard) Setting এর Formatting অংশে আপনাকে কোনরকম পরিবর্তন করতে হবে না। আমার BD Nature ব্লগে এই পদ্ধতিতি প্রয়োগ করা হয়েছে, আপনি ইচ্ছে করলে ভ্রমণ করে নিজেই পরীক্ষা করে দেখতে পারেন। এই ব্লগেও এটা স্থাপন করা হয়েছে।

নতুন পদ্ধতিতে "বিস্তারিত পড়ুন" হটলিংক স্থাপন করার উপায়:

ড্যাশবোর্ডে (Dashboard) লগইন (Login) করে Layout অংশের Edit HTML অংশে যান। সেখানে Expand Widget Templates এ ক্লিক করে টিক (Tick) চিহ্ন দিয়ে দিন। ব্লগের টেমপ্লটের (Blog Template) সমস্ত কোড (Code) Expand হয়ে যাবে।

• এবার </head> অংশের ঠিক আগে / উপরে নিচের কোডটি স্থাপন করুন।

• <script src='http://sites.google.com/site/banglahacks/tools/post-summary.js' type='text/javascript'/>
  <script type='text/javascript'>
  var thumbnail_mode = "float" ;
  summary_noimg = 250;
  summary_img = 250;
  img_thumb_height = 120;
  img_thumb_width = 120;
  </script>

• উপরের প্রতিটি ভ্যালুকে নিজের ইচ্ছেমতো পরিবর্তন করতে পারবেন। যদি ছবি বাদে লেখার সারাংশর পরিমাণ কমবেশি করতে চান, তাহলে summary_noimg তে 250 এর বদলে আরও বেশি বা কম সংখ্যা দিতে পারেন। এভাবে অন্য সংখ্যাগুলোকেও কমবেশি করে নিজের মনমতো ভ্যালু খুঁজে নিন।
• 
  
• এবার <data:post.body/> লেখাটি খুঁজে বের করুন।
• এটাকে সম্পূর্ণ সিলেক্ট (Select) করে নিচের কোডটি (Code) দিয়ে প্রতিস্থাপন (Replace) করুন।
  

• <b:if cond='data:blog.pageType != "item"'>
  <div expr:id='"summary-" + data:post.id'><data:post.body/></div>
  <script type='text/javascript'>createSummaryAndThumb("summary-<data:post.id/>");</script>
  <a class='readmore' expr:href='data:post.url'>Read More ... »</a>
  </b:if>
  <b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

  এই অংশের Read More ... লেখাটি আপনি ইচ্ছে করলে পাল্টাতে (Change) পারবেন। এটা পাল্টিয়ে 'বিস্তারিত পড়ুন', 'বিস্তারিত দেখুন', 'আরও পড়ুন', 'বাকীটুকু পড়ুন' ইত্যাদি লিখে দিতে পারেন।
• SAVE TEMPLATE বোতামে ক্লিক করে আপনার ব্লগের টেমপ্লটের পরিবর্তনকে (Change) সংরক্ষণ (Save) করুন।
• অন্য ট্যাবে (Download Firefox) থাকা আপনার ব্লগটিকে একবার রিফ্রেশ করুন।
• আশা করি সমস্ত কাজগুলো সঠিকভাবে করতে পেরেছেন।
  

* মূল জাভাস্ক্রিপ্টটির লিংক: http://quiterandom.com/js/summary/summary-posts.js

উপরে দেয়া স্ক্রিপ্টটির বদলে এই স্ক্রিপ্টটিও স্থাপন করতে পারেন।