আল্লাহ্ এর নাম নিয়ে আজকের এই পোস্ট শুরু করছি । আজকেও আপনাদের জন্য সেই ফেসবুক লাইক বক্স নিয়ে পোস্ট করতে বসে গেলাম কিন্তু আজকের টা একটু আলাদা । এই ফেসবুক লাইক বক্স টি দেখতে ক্যামন হবে দেখে নিন আমার এই ব্লগের ডান পাশ থেকে । কি পছন্দ হল তো তাহলে আর দেরি করে ভাল কি আপনিও আপনার ব্লগে এই সুন্দর Pop out ফেসবুক লাইক বক্স টি যুক্ত করে নিন । কিভাবে যুক্ত করবেন এর জন্য কষ্ট করে নীচের টিপস টি একটু লক্ষ করুন ।
* প্রথমে Jquery JavaScript Plugin যুক্ত করে নিন , আর যদি আগে থেকে Jquery JavaScript Plugin আপনার ব্লগ থাকে তাহলে দরকার নাই । সে যাই হোক যুক্ত থাকুক বা না থাকুক , কি ভাবে Jquery JavaScript Plugin যুক্ত করবেন একটু দেখেনিন ।
১) প্রথমে আপনার ব্লগার লগ অন করুন তারপর > Dashboard >Template > Edit Html এ গিয়ে যান ।
২) এবার CTRL + F চেপে </head> এটি সার্চ করে খুজে বের করুন ।
৩) এবার </head> এর পাশে বা নিচে এই কোড টি পেস্ট করুন এবং Save Templete এ ক্লিক করে বেরিয়ে আসুন ।
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
* Jquery JavaScript Plugin যুক্ত করা হয়ে গেল । আবারও বলছি Jquery JavaScript Plugin যদি আগে থেকে যুক্ত থাকে তাহলে যুক্ত করার প্রয়জন নেই । এবার বক্স যুক্ত করার পালা ।
১) আপনার ব্লগার ব্লগ লগ অন করুন তারপর ড্যাশবোর্ড থেকে Layout এ ক্লিক করুন তারপর Add a Gadget এ ক্লিক করুন । নীচের চিত্রে দেখুন ।
২) এবার যে বক্স ওপেন হবে সেখান থেকে HTML/JavaScript এ ক্লিক করুন । নীচের চিত্রে দেখুন ।
৩) এবার একটি বক্স ওপেন হবে সেখানে Title ঘর ফাকা রেখে Content ঘরে নীচের কোড গুল কপি করে পেস্ট করুন । নীচের চিত্রে দেখুন ।
*** ---কোড পেতে নীচে যান---***
<style type="text/css">
/*<![CDATA[*/
#fbplikebox{display: block;padding: 0;z-index: 99999;position: fixed;}
.fbplbadge {background-color:#3B5998;display: block;height: 150px;top: 50%;margin-top: -75px;position: absolute;left: -47px;width: 47px;background-image: url("http://3.bp.blogspot.com/-1GCgbuSZXK0/T38iRiVF41I/AAAAAAAABpg/WlGuQ3fi-Rs/s1600/vertical-right.png");background-repeat: no-repeat;overflow: hidden;-webkit-border-top-left-radius: 8px;-webkit-border-bottom-left-radius: 8px;-moz-border-radius-topleft: 8px;-moz-border-radius-bottomleft: 8px;border-top-left-radius: 8px;border-bottom-left-radius: 8px;}
/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
(function(w2b){
w2b(document).ready(function(){
var $dur = "medium"; // Duration of Animation
w2b("#fbplikebox").css({right: -250, "top" : 100 })
w2b("#fbplikebox").hover(function () {
w2b(this).stop().animate({
right: 0
}, $dur);
}, function () {
w2b(this).stop().animate({
right: -250
}, $dur);
});
w2b("#fbplikebox").show();
});
})(jQuery);
/*]]>*/
</script>
<div id="fbplikebox" style="display:none;">
<div></div>
<iframe src="http://www.facebook.com/plugins/likebox.php?href=Asobondhublog&width=250&height=250&colorscheme=light&show_faces=true&border_color=%23C4C4C4&stream=false&header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:250px;background:#FFFFFF;" allowtransparency="true"></iframe>
</div>
* এবার লাল রঙে Asobondhublog টি কে মুছে আপানর ফেসবুক ফ্যান পেজ এর URL টি বসিয়ে দিন তার পর Save বটনে ক্লিক করে বেরিয়ে আসুন ।
* আশাকরি আপনারা কাজটি করতে এতখনে সফল হয়েছেন । তাহলে আর দেরি না করে ক্যামন লাগলো আমাকে কমেন্ট করে জানান । তাহলে আজকের মতো এই পর্যন্ত আল্লাহ্ হাফেজ ।
