চলুন fb ফ্যান পেজ স্লাইড হিসেবে এড করি ব্লগারে।( পর্ব ১)

সবাইকে সালাম জানিয়ে ‌আমার আজকের পোষ্ট শুরু করছি। আজ আমি আপনাদের একটি ব্লগার এর উপর একটি টিউটরিয়াল দেখাব। যাদের ব্লগারে নিজে একটি ব্লগ বা সাই আছে তাদের জন্য এটি অনেক উপকারে আসবে। আসলে blogger এ fb এর ফ্যান পেজ ব্যবহার করাটা খুব একটি কঠিন কাজ না। কিন্ত আজ আমি আপনাদের দেখাব কিভাবে স্লাইড হিসেবে fb এর ফ্যান পেজ use করতে হয় । এতে আপনার ব্লগটি সুন্দরর্য বিদ্দি পাবে । চলুন দেখে নেই কিভাবে এড করবেন এটি ।



ডেমো দেখতে এখানে ক্লিক করুন।


তো চলুন দেখে নেই কিভাবে তৈরি করবেন।
ধাপ ১ :
প্রথমে আপনার ব্লগার একাউন্ট লগ‌ইন করুন। তার পর নিচের দেখান দাপ অনুযায়ি কাজ করুন।
i.  dashboard > design > edit HTML
ii. তারপর (ctrl + F) চেপে </head> কোডটি খুজে বের করুন।
iii. এবং নিচের কোডটি কপি করে </head> এই কোডটির আগে পেষ্ট করুন।

1	<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>

যেমন:

(iv) শেসে save করুন।
ধাপ 2
1//dashboard > design > page element > add a gadget > HTML/javascript
2//নিচে কোড টুকু কপি করে HTML/JAVASCRIPT এ মধ্যে পেষ্ট করুন।

কোডঃ

<script type="text/javascript">

//<!--

$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});

//-->

</script>

<style type="text/css">

.w2bslikebox{background: url("http://3.bp.blogspot.com/-KdSAuv-K7HM/To_WXoWHzJI/AAAAAAAAGvg/5UvL10LUe_k/facebook.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}

.w2bslikebox div{border:none;position:relative;display:block;}

.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}

.w2bslikebox span a{color: #808080;text-decoration:none;}

.w2bslikebox span a:hover{text-decoration:underline;}

</style><div class="w2bslikebox" style=""><div>

<span><a href="http://wp.me/p2FP68-55/">Tutorial Here</a></span></div></div>

3// এই বার SAVE করুন এবং ফলাফল দেখুন।