Wednesday, June 8, 2016

আপনার ব্লগস্পট সাইটে যুক্ত করুন Stastic Follow by email pop out উইগেট হুবহু ওয়ার্ডপ্রেস ডট কম সাইটের মত!

السلام عليكم আসসালামু আলাইকুম। সুপ্রিয় টেকটিউন্স সাইটের সবাইকে সালাম ও শুভেচ্ছা। আশা করি সবাই এক প্রকার কুশলেই আছেন। আজকের টিউনে আপনাদেরকে ব্লগারের একটি উইগেট বিষয়ে আলোচনা করব যাহা পোষ্টের শিরোনামে বলেছি।

মূলত Stastic Follow by email pop out উইগেট হল গুগলের ফিড বার্নার পদ্ধতির একটি প্রতিচ্ছবি। যেখানে আপনার ব্লগের ভিজিটরেরা তাদের ইমেইল দ্বারা সাবমিট করলে আপনার ব্লগে ভিজিট না করেও তাদের ইমেইলে আপনার ব্লগের পোস্টের আপডেট জানতে পারবে। অনেকেই এই ফিড বার্নার উইগেটটি আমাদে ব্লগে ব্যবহার করে থাকি। তবে এখানে যে উইগেট ব্যবহার করা হয় তা মূলত ব্লগস্পটের স্বতন্ত্র পদ্ধতি। অনেকের ইচ্ছা ইশ! ফ্রি সাইট ওয়ার্ডপ্রেস ডটকমের মত যদি ফলো আউট ইন্টারফেস সুবিধা থাকত তাহলে ব্লগস্পটের লুক ইন্টারফেস আরো সুন্দর লাগত।  হ্যা যারা ওয়ার্ডপ্রেস ডট কম সাইট দ্বারা ব্লগ চালাচ্ছে তারা নিশ্চয় লক্ষ্য করেছেন একদম ফুটার অপশনের ডান পাশে Stastic Follow উইগেটটটি পরিলক্ষিত হয়। নিচের চিত্র দেখলে বুঝতে সুবিধা হবে-



  • কাজটি করার পূর্বে পরীক্ষা মূলক ডেমো দেখুন (যেমনটি এই ব্লগে দেখছেন) এখানে 

কিভাবে আপনার ব্লগে কাজটি করবেন?

ব্লগে এটি যুক্ত করতে গেলে এর প্রথম শর্ত হল আপনার ব্লগার টেমপ্লেটে কোডিং লাইনে জেকুয়েরি কোড সংযুক্ত থাকতে হবে। যদি পূর্ব হতেই যুক্ত থাকে তাহলে নতুন করে সংযোজন না করলেও হবে। যদি সংযোজন করার প্রয়োজন হয় তাহলে আপনার ব্লগের টেমপ্লেট এডিটর অপশনে চলে যান ।  সার্চ করে </head> ট্যাগের নিচে নিম্নের কোডটুকু যুক্ত করুন।
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

কিভাবে উইগেট ইনস্টল করবেন?

১। ব্লগ লগইন করে layout অপশনে যান
২। একটি widget নিয়ে সেখানে “html/javascript” widget হিসাবে নিচের কোডটুকু যোগ করে সেইভ করুন।
অথবা, টেমপ্লেট এডিটরে </head> ট্যাগ অপশনের পূর্বে নিচের কোড যোগ করলেই হবে।

<style type="text/css">
/*<![CDATA[*/
#TOBTfollowSubscribe {background-color: #464646;width: 220px;color: #fff;position: fixed;z-index: 999999;right: 10px;bottom: 0;}
.followOpened {-webkit-border-radius: 2px 0 0;-moz-border-radius: 2px 0 0;border-radius: 2px 0 0;-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);-moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);}
.TOBTFb {background: #464646;color: #CCC !important;font-size: 13px;line-height: 28px;padding: 0 10px;text-decoration: none;position: absolute;top: -28px;right: 0;display: block;-webkit-box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.2);-moz-box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.2);box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.2);-webkit-border-radius: 2px 2px 0 0;-moz-border-radius: 2px 2px 0 0;border-radius: 2px 2px 0 0;height: 28px;}
.TOBTFb span {background: url("http://4.bp.blogspot.com/-cojt7gQfz4Q/TztYuq2TltI/AAAAAAAABcE/OTwMxjnwak8/s1600/follow-w2b.png") no-repeat scroll 0 3px transparent;padding-left: 15px;}
.TOBTFb:hover,.followActive {color: #fff !important;}
.TOBTFb:hover span,.followActive span {background-position: 0 -37px !important;}
.followactive {background-color: #333;}
.TOBTForm {padding: 15px;}
.TOBTForm h3 {font-size: 18px;margin: 0 0 10px;font-weight: normal;}
.TOBTForm p {margin: 0 0 10px;}
.TOBTForm .emailInput {width: 95%;padding: 2px 4px;margin: 0 auto;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;font-size: 15px;border: 1px solid #444;color: #888;display: block;clear: both;}
.TOBTForm form {text-align: center;}
.TOBTForm .emailInput:focus {color: #000;border-color: #000;}
.TOBTForm .emailSubmit {cursor:pointer;padding: 2px 20px;background: #333;background: -webkit-linear-gradient(top, #333 0%, #111 100%);background: -moz-linear-gradient(top, #333 0%, #111 100%);background: -o-linear-gradient(top, #333 0%, #111 100%);background: -ms-linear-gradient(top, #333 0%, #111 100%);background: linear-gradient(top, #333 0%, #111 100%);color: #ccc;text-shadow: 0 1px 0 #000;border: 1px solid #282828;-webkit-border-radius: 11px;-moz-border-radius: 11px;border-radius: 11px;-webkit-box-shadow: inset 0 1px 0 #444;-moz-box-shadow: inset 0 1px 0 #444;box-shadow: inset 0 1px 0 #444;text-decoration: none;-webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out;-o-transition: all 0.25s ease-in-out;-ms-transition: all 0.25s ease-in-out;transition: all 0.25s ease-in-out;margin: 1em 0 1em 0;}
.emailSubmit:hover {background: #222;background: -webkit-linear-gradient(top, #333 0%, #222 100%);background: -moz-linear-gradient(top, #333 0%, #222 100%);background: -o-linear-gradient(top, #333 0%, #222 100%);background: -ms-linear-gradient(top, #333 0%, #222 100%);background: linear-gradient(top, #333 0%, #222 100%);color: #fff;-webkit-box-shadow: inset 0 1px 0 #4f4f4f;-moz-box-shadow: inset 0 1px 0 #4f4f4f;box-shadow: inset 0 1px 0 #4f4f4f;text-decoration: none;}
.emailSubmit:active {background: #111;background: -webkit-linear-gradient(top, #111 0%, #222 100%);background: -moz-linear-gradient(top, #111 0%, #222 100%);background: -o-linear-gradient(top, #111 0%, #222 100%);background: -ms-linear-gradient(top, #111 0%, #222 100%);background: linear-gradient(top, #111 0%, #222 100%);color: #aaa;-webkit-box-shadow: inset 0 -1px 0 #333;-moz-box-shadow: inset 0 -1px 0 #333;box-shadow: inset 0 -1px 0 #333;text-decoration: none;}
.TOBTFF {text-align: center;font: normal 11px "Helvetica Neue", sans-serif;padding: 7px 0;margin: 0 0 -15px !important;border-top: 1px solid #3c3c3c;}
.TOBTFF a {color: #aaa;text-shadow: 0 1px 0 #262626;background: none;text-decoration: none;}
.TOBTFF a:hover {color: #fff;background: none;}
/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
;(function(w2b){w2b(document).ready(function(){w2b.extend(w2b.easing,{easeOutCubic:function(x,t,b,c,d){return c*((t=t/d-1)*t*t+1)+b}});var followBox=w2b("#TOBTfollowSubscribe");var followHeight="-"+followBox.outerHeight()+"px";followBox.hide().css({bottom:"-500px"});setTimeout(function(){followBox.show().animate({bottom:followHeight})},500);w2b(".TOBTFb").click(function(e){if(followBox.hasClass("followOpened")){w2b(this).removeClass("followActive");followBox.removeClass("followOpened").stop().animate({bottom:followHeight},{duration:300,easing:"easeOutCubic"})}else{w2b(this).addClass("followActive");followBox.addClass("followOpened").stop().animate({bottom:"0"},{duration:500,easing:"easeOutCubic"})}e.preventDefault()})})})(jQuery);
/*]]>*/
</script>
<div id="TOBTfollowSubscribe" style="display:none;">
<div class="TOBTForm">
<a class="TOBTFb" href="#" title="Follow"><span>Follow</span></a>
<h3>Follow "Tutorial Gift.Com"</h3>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri= blogspot/TutorialGift','popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input type="text" class="emailInput" name="email" placeholder="Enter Your Email..."/>
<input type="hidden" value="blogspot/TutorialGift" name="uri"/>
<input type="hidden" name="loc" value="en_US"/>
<input type="submit" value="Subscribe Now" class="emailSubmit"/>
</form>
<p class="TOBTFF">
<a href="http://theoriginalbloggertricks.blogspot.in/" target="_blank">Delivered by FeedBurner</a>
</p>
</div>
</div>

সর্বশেষ

আশা করি টিউটোরিয়াল অনুযায়ী উক্ত কাজটি করতে পারবেন। তবে উক্ত কোড প্রয়োগের পর কিছু অপশন/শব্দবলী নিম্নরুপ পরিবর্তন করতে হবে-
ক। আপনার ব্লগ উইগেট অপশনে গিয়ে সার্চ করুন > সেখানে আপনার ব্লগের টাইটেল পরিবর্তন করবেন Tutorialgift.Com“ এর পরিবর্তে অন্য আপনার পচ্ছন্দ মত লিখুন।
খ। গুগলের ফিড বার্নার ঠিকানা "TutorialGift" এর পরিবর্তে আপনার ব্লগের ফিডবার্নার ইউজার নাম দিন। সবশেষে সেইভ করে কাজটি পরীক্ষা করুন।
বিঃ দ্রঃ আপনার ফিড বার্নার ঠিকানা না থাকলে তা কাজ করবে না। যদি গুগলের মেইল থাকে তাহলে আপনি সহজেই ফিডবার্নার তৈরি করতে পারবেন এখানে

Previous Post
Next Post

2 comments: Post Yours! Read Comment Policy ▼
লক্ষ্য করুনঃ
পোষ্টের সাথে সম্পৃক্ত নয় এমন কোন কমেন্ট করা যাবে না। কোন কারণ ব্যতীত আপনার ব্লগের লিংক শেয়ার করতে যাবেন না। সবসময় গঠনমূলক মন্তব্য প্রদানের চেষ্টা করবেন। আমরা সবার মতামত সমানভাবে মূল্যায়ন করি এবং যথাসময়ে প্রতি উত্তর দেয়ার চেষ্টা করি।

  1. অনেক সুন্দর লিখছেন। চাইলে টিটিতে দেয়া আমার সব পোষ্ট আপনি এখানে শেয়ার করতে পারেন। আপনার জন্য উন্মুক্ত করে দিলাম।

    ReplyDelete
    Replies
    1. :>)অসংখ্যক ধন্যবাদ আমার ব্লগটি ভিজিট সহ মন্তব্য করার জন্য। শুকরিয়া! যথা সম্ভব চেষ্টা করব আপনার টিউনগুলো আমার সাইটে পাবলিশ করার এবং সেই সাথে অবশ্যই আপনার ক্রেডিট লিংক দেওয়া থাকবে। তথাপি আপনি ইচ্ছা করলে এই ব্লগ সাইটে আপনি লেখক হিসাবে যোগদান করতে পারেন, আপনি আমন্ত্রিত!! (o) পরিশেষে শুভ কামনা।

      Delete

 
Copyright © বিডি.পয়সা ক্লিক,নিবন্ধিত ও সংরক্ষিত. মডিফাইঃ পিসি টীম, সার্ভার হোস্টেডঃ গুগল সার্ভিস