মন্তব্য ঘরে মন্তব্যকারীর অবতার দেখানোর পদ্ধতি

no avatar on comment on blogger blogউপরের ছবিটি দেখুন। যে মন্তব্যকারীগণ লগইন না করে অথবা নিজেদের ব্লগার একাউন্টে কোন অবতার আপলোড করেননি, তাদের মন্তব্যর পাশে কোন ছবি/ অবতার দেখা যাচ্ছে না। এবার নিচের ছবিটি দেখুন।
color anonymouse avatar on comment sideএই ছবিতে মন্তব্যকারীদের নিজস্ব কোন ছবি না থাকলেও একটা পূর্বনির্ধারিত ছবি অবতার হিসেবে দেখা যাচ্ছে। আমার 'বাংলা হ্যাকস' ব্লগে এতদিন নিজস্ব ছবিবিহীন মন্তব্যকারীদের কোন অবতার মন্তব্যঘরে দেখা যেত না। এটা আমার কাছে অতটা গুরুত্বপূর্ণ মনে হয়নি। কিন্তু কোন কোন পাঠক ইমেইলে এ বিষয়ে আপত্তি জানিয়ে কোন না কোন ছবি যোগ করার কথা বলেছেন। আমি তাদের প্রতি সম্মান রেখে আমার ব্লগে ছবিবিহীন মন্তব্যকারীদের জন্য একটি কমন ছবি যোগ করে দিয়েছি। আমি এটা কিভাবে করলাম তাই আজ আপনাদের সাথে শেয়ার করব।

প্রথমে Setting> Comments ট্যাব থেকে মন্তব্যকারীর ছবি দেখানোর অপশনটি কার্যকর করেছি।
এবার Layout> Edit HTML ট্যাবে গিয়ে যে পরিবর্তনগুলো করেছি, তা নিম্নরূপ। এখানে দুটো বিষয় আছে। দেখুন তো আপনার ব্লগে মন্তব্যকারীদের কোন অবতার দেখা যায় কি না। যদি যায়, তাহলে প্রথম ধাপটি বাদ দিন। পুরনো টেমপ্লেট যাদের তাদের ক্ষেত্রে এমন হতে পারে। ব্লগার.কম মন্তব্যকারীদের ছবি দেখানোর অপশনটি চালু করার পর যারা ব্লগিং শুরু করেছেন, বা নতুন টেমপ্লেট লাগিয়ে নিয়েছেন, তারা সরাসরি দ্বিতীয় ধাপটি অনুসরণ করুন।

প্রথম ধাপঃ
নিচের কোডটি খুঁজে বের করুন।
<dl id='comments-block'>
এই লাইনটি মুছে ফেলে সেখানে নিচের লাইনটি লিখে দিন।
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
এবার <a expr:name='data:comment.anchorName'/> এই লেখাটির পরে নিচের কোডটি লিখে দিয়ে সেভ করুন।
<b:if cond='data:blog.enabledCommentProfileImages'>
<data:comment.authorAvatarImage/>
</b:if>
এবার আপনার নিজের অবতারসহ যারা লগইন করে (ব্লগার একাউন্টে ছবি আছে) মন্তব্য করেছেন, তাদের অবতার দেখা যাবে।

কিন্তু যারা লগইন করেননি বা Anonymous হিসেবে মন্তব্য করেছেন, তাদের জন্য একটি সাধারণ ছবি দেখানোর জন্য নিচের কোডগুলি স্থাপন করুন।

দ্বিতীয় ধাপঃ
</b:skin> লেখাটির উপরে নিচের কোডটি স্থাপন করুন
/* Comment Avatar */
.avatar-image-container img {
background:url(http://3.bp.blogspot.com/_C6KkooKXCEw/SrmyhPpP4mI/AAAAAAAAEvc/gQ1JKjpkULw/s320/AvatarBlogger.png);
width:35px;
height:35px;
}
এই জায়গায় এই ছবিটির বদলে নিচের যে কোন একটি ছবির লিংক ব্যবহার করতে পারেন।
1. http://sites.google.com/site/banglahacks/shrd/commentavatar.png
2. http://sites.google.com/site/banglahacks/shrd/anon_avatar.png
3. http://sites.google.com/site/banglahacks/shrd/anonymousavatar.gif
4. http://sites.google.com/site/banglahacks/shrd/anonycmtavtr.png
5. http://sites.google.com/site/banglahacks/shrd/anonymous.gif
# উপরে দেয়া ছবিগুলির মধ্যে যে কোনটি ব্যবহার করতে পারেন। কোনরকম বাধানিষেধ নেই।

এবার <a expr:name='data:comment.anchorName'/> এই লাইনটি খুঁজে বের করে সম্পূর্ণ মুছে ফেলুন। এই কোডটুকু দুই জায়গায় থাকতে পারে। প্রথমে যেটা আছে, সেটা মুছে দিবেন। সেখানে নিচের কোডটুকু লিখে দিন।
<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='35px' style='margin-bottom:-2px;' width='35px'/>
</b:if>
সেভ করুন। এবার মন্তব্যযুক্ত কোন ব্লগ পোস্ট পরীক্ষা করে দেখুন তো কাজ করছে কিনা? যদি না করে, তাহলে আমি তো আছি।
 

পাঠকের প্রতিক্রিয়া

কিছু কথা

সফটওয়ার ও ওয়েবওয়ারের বিভিন্ন টিপ্‌স, টিউটোরিয়াল, হ্যাক্‌স, টেমপ্লেট বা থিম্‌স ইত্যাদি নিয়েই আমি ব্লগ লিখছি। আমার প্রধান আগ্রহ ব্লগিং টিপস। এছাড়াও প্রযুক্তির বিচিত্র বিষয় নিয়ে মত বিনিময়, সমস্যা ও তার সমাধান এবং আলোচনা করার জন্য এই ব্লগ খুলেছি। আশা করি আপনি নিরাশ হবেন না। এই ব্লগের সব লেখাগুলো যেকোন মিডিয়ায় এই লাইসেন্সের আওতায় প্রকাশ করতে পারবেন। বিস্তারিত পড়ুন....

Search This Blog

© 2009-2014 Bangla Hacks | Design by: Bangla Hacks. Powered by: Blogger