আজ আপনাদের জন্য নিয়ে এলাম সুন্দর একটি সোশাল সাবস্ক্রিপ্সন গেজেট, যা আপনার ব্লগকে আরও সুন্দর করে তুলবে। কথা না বাড়িয়ে দেখা যাক কিভাবে ব্লগে যুক্ত করা যায়।

• সতর্কতার জন্য আপনার টেম্পলেটটি ব্যাকআপ করে রাখতে পারেন।

LIVE DEMO

• ব্লগার.কমে লগিন করে, যেই ব্লগে এটি অ্যাড করতে চান সেই ব্লগের টেমপেল্ট মেনুতে যান ও Edit HTML এ ক্লিক করুন।
• সার্চ করুন ]]></b:skin> করে এর নিচের লাইনে কোড গুলো বসিয়ে দিন।

@import url("http://fonts.googleapis.com/css?family=Oswald&text=AaBbCcEeFfIiKkLlMmOoRrSsTtWw%20");.w2bOldSocial ul {
    font - family: 'Oswald',
    sans - serif;
    margin: 15px 0;
    overflow: hidden;
}.w2bOldSocial ul li {
    float: left;
    width: 90px;
    padding: 0 0 0 55px!important;
    margin: 0 0 0 5px!important;
    line - height: 48px!important;
}.w2bOldSocial ul li a {
    font - size: 20px!important;
    text - decoration: none;
    padding: 0!important;
    margin: 0!important;
    text - decoration: none;
}.w2bOldSocial ul li a: hover {
    text - decoration: underline;
}.w2bOldSocial ul li.w2brss {
    background: url("http://2.bp.blogspot.com/-HzL4OJ6FzmE/TeTFVVR1A4I/AAAAAAAAA4g/Eiju-1UObXU/s48/RSS.png") no - repeat scroll left center transparent!important;
}.w2bOldSocial ul li.w2bmail {
    background: url("http://2.bp.blogspot.com/-YcW06xYPTM4/TeTFU1cvqbI/AAAAAAAAA4c/1fyAl6q9QRw/s48/Mail.png") no - repeat scroll left center transparent!important;
}.w2bOldSocial ul li.w2btwitter {
    background: url("http://3.bp.blogspot.com/-d8fPV2jD2p0/TeTFVkAMFOI/AAAAAAAAA4k/0jYlyJGVmXM/s48/Twitter2.png") no - repeat scroll left center transparent!important;
}.w2bOldSocial ul li.w2bfacebook {
    background: url("http://1.bp.blogspot.com/-SfiMNXFU9TE/TeTFUbgc_SI/AAAAAAAAA4Y/THAqJLoo_vg/s48/Facebook.png") no - repeat scroll left center transparent!important;
}#
w2bEmailsub {
    display: block;
    clear: both;
    margin: 10px 0;
}
form.w2bEmailform {
    margin: 20px 0 0;
    display: block;
    clear: both;
}.emailText {
    background: url("http://3.bp.blogspot.com/-SoB4RN7Bchk/TZ1ouay9q0I/AAAAAAAAAlE/dkyZEzF2HIw/s28/w2b-mail.png") no - repeat scroll 4px center transparent;
    padding: 7px 15px 7px 35px;
    color: #444; font-weight: bold; text-decoration: none; border: 1px solid # D3D3D3; - webkit - border - radius: 4px; - moz - border - radius: 4px;
    border - radius: 4px; - webkit - box - shadow: 1px 1px 2px# CCC inset; - moz - box - shadow: 1px 1px 2px# CCC inset;
    box - shadow: 1px 1px 2px# CCC inset;
}.emailButton {
    color: #444; font-weight: bold; text-decoration: none; padding: 6px 15px; border: 1px solid # D3D3D3;
    cursor: pointer; - webkit - border - radius: 4px; - moz - border - radius: 4px;
    border - radius: 4px;
    background: #fbfbfb;
    background: -moz - linear - gradient(top, #fbfbfb 0 % , #f4f4f4 100 % );
    background: -webkit - gradient(linear, left top, left bottom, color - stop(0 % , #fbfbfb), color - stop(100 % , #f4f4f4));
    background: -webkit - linear - gradient(top, #fbfbfb 0 % , #f4f4f4 100 % );
    background: -o - linear - gradient(top, #fbfbfb 0 % , #f4f4f4 100 % );
    background: -ms - linear - gradient(top, #fbfbfb 0 % , #f4f4f4 100 % );
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr = '#FBFBFB', endColorstr = '#F4F4F4', GradientType = 0);
    background: linear - gradient(top, #fbfbfb 0 % , #f4f4f4 100 % );
}

• এবার  লেআউট যান,  অ্যাড এ গেজেট এ ক্লিক করে HTML/JavaScript ক্লিক করুন।
• নিচের কোড গুলো বসিয়ে এটি সেভ করে নিন।

<div>
    <ul>
        <li>
            <a href="http://feeds.feedburner.com/bdtechzonecom">RSS</a>
        </li>
        <li>
            <a href="http://feedburner.google.com/fb/a/mailverify?uri=bdtechzonecom">Email</a>
        </li>
        <li>
            <a href="http://twitter.com/bdtechzonecom">Twitter</a>
        </li>
        <li>
            <a href="http://facebook.com/bdtechzonecom">Facebook</a>
        </li>
    </ul>
</div>
<div id="w2bEmailsub">
    <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=Way2blogging', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
        <input type="hidden" value="bdtechzonecom" name="uri" />
        <input type="hidden" name="loc" value="en_US" />
        <input type="text" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" value="Enter your email..." name="email" />
        <input type="submit" value="SignUp" title='' />
    </form>
</div>

পরিবর্তন সমূহ

• http://feeds.feedburner.com/bdtechzonecom (লিঙ্কটি আপনার ফীডবার্নার লিঙ্ক দ্বারা পরিবর্তন করে নিন)
• http://feedburner.google.com/fb/a/mailverify?uri=bdtechzonecom (bdtechzonecom এর স্থানে আপনার ফীডবার্নার ইউজারনেম লিখুন)
  
• http://twitter.com/bdtechzonecom (আপানর টুইটার ইউজারনেম দ্বারা পরিবর্তন করে নিন)
• http://facebook.com/bdtechzonecom (আপনার ফেসবুক পেজ লিঙ্ক দ্বারা পরিবর্তন করে নিন)
• <input type="hidden" value="bdtechzonecom" name="uri" /> (bdtechzone এর স্থানে আপনারফীডবার্নার ইউজারনেম লিখুন)

পূর্বে আমার দ্বারা বিডিটেকজোনে প্রকাশিত