১০ জুলাই, ২০১৫

ব্লগারের জন্য আরেকটি Email Subscription Form উইজেট

ব্লগারের জন্য আরেকটি Email Subscription Form উইজেট
4/ 5 stars - "ব্লগারের জন্য আরেকটি Email Subscription Form উইজেট" আমরা ইতিপূর্বে একটি আকর্ষণীয় Email Subscription Form উইজেট আপনাদের সাথে শেয়ার করেছি। এখান থেকে ইচ্ছে করলে পোষ্টটি দেখে আসতে পারেন। আমি গত...
-
আমরা ইতিপূর্বে একটি আকর্ষণীয় Email Subscription Form উইজেট আপনাদের সাথে শেয়ার করেছি। এখান থেকে ইচ্ছে করলে পোষ্টটি দেখে আসতে পারেন। আমি গত পোষ্টেও এ কথাগুলি বলেছিলাম যে, আপনি এত কষ্টকরে স্বাদের একটি ব্লগ তৈরী করলেন, তারপর যদি ব্লগে কোন পাঠক (Reader) না থাকে তাহলে এর কোন মানেই হয় না। আপনার ব্লগের সার্থকতা তখনই পূর্ণ হবে, যখন ব্লগে প্রচুর পরিমানে পাঠক (Reader) এবং Subscribers পাবেন। তবে Subscriber পাওয়ার জন্য পাঠকদের Subscribe অপশন দিতে হবে। তা না হলে পাঠকরা ব্লগ পড়ে চলে যাবে কিন্তু Subscribe করতে পারবে না। আর এই Email Subscription হচ্ছে সাবস্ক্রাইবার বাড়ীয়ে নেওয়ার সহজ উপায়।
Blogger-Email-Subscription-Form
আমরা আজ যে, Email Subscription Form শেয়ার করবো সেটি অত্যান্ত আকর্ষণীয় একটি Form. এটিতে Email Subscription অপশন এর পাশাপাশি সোসিয়াল মিডিয়া বাটন সংযুক্ত করে দেয়া আছে, যা আপনার সোসিয়াল মিডিয়া গুলির সাব্সক্রাইবারও বাড়ীয়ে নিতে সাহায্য করবে। লাইভ ডেমো আমার ব্লগের সাইডবারেই দেখতে পাচ্ছেন।
সকল পোষ্ট দেখুন

কিভাবে ব্লগে যুক্ত করবেনঃ

  • প্রথমে আপনার ব্লগে লগইন করুন।
  • ব্লগার ড্যাশবোর্ড হতে Layout এ ক্লিক করুন।
  • এখন ডান পাশের লেআউট হতে Add Gadget এ ক্লিক করুন। নিচের চিত্রে দেখুন -
add-blogger-new-widget
  • তারপর HTML/JavaScript এ ক্লিক করুন।
  • এবার নিচের কোডগুলি কপি করে HTML/JavaScript এর ঘরে পেষ্ট করুন।
<style type="text/css">
#pro-subscribe{height:222px;background:#FFF;color:#0c6e0c;font-family:Georgia,"Times New Roman",Times,serif;padding:3px;border:3px solid #734E76;border-radius:5px}
.pro-subscribe-rashid{color:#734E76;font-weight:500;text-align:center;padding:2px 0 10px 0}
.pro-email-field{-moz-border-radius:4px;-webkit-border-radius:4px;background:#FFF url(http://3.bp.blogspot.com/-vn3SjPzmeoE/VFzO7xAnDHI/AAAAAAAADi0/zMljRPCAYAM/s1600/Mail.png) no-repeat 10px 11px;border:1px solid #dcdcdc;border-radius:4px;color:#444;margin:0 7px 15px;padding:10px 40px;width:67%}
#pro-subscribe-submit{height:40px;width:150px;background:#734E76;color:#FFF;font-weight:bold;text-align:center;margin-left:68px;border:1px;border-radius:5px;cursor:pointer}
#pro-subscribe-submit:hover{background-color:#000000}
#pro-social-icons{height:50px;width:100%;margin-left:20px;clear:both;z-index:2;position:relative}
.pro-social-media-icons{display:table}
.pro-social-media-icons ul{text-align:center;padding:5px 5px 0 0;list-style-image:none;list-style-position:outside;list-style-type:none}.pro-social-media-icons ul{margin-bottom:0;padding:0}
.pro-social-media-icons li.media_icon{margin-left:14px;padding-left:0!important;background:none!important;display:inline;float:left}
.pro-social-media-icons li:hover{-moz-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(-360deg);-moz-transition:all 0.5s ease-in-out;-webkit-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;-ms-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out}</style>

<div id="pro-subscribe">
<div class="pro-subscribe-rashid">Write About Social Media</div>
<div class="pro-social-media-icons" id="pro-social-icons">
  <ul>
     <li class="media_icon"><a href="#" target="_blank" title="Facebook"><img border="0" src="http://1.bp.blogspot.com/-lrc2g0hw_sU/VD5oqmNLIYI/AAAAAAAADWc/5wJ5KqJEY4w/s1600/Facebook.png" /></a></li>
     <li class="media_icon"><a href="#" target="_blank" title="Twitter"><img border="0" src="http://3.bp.blogspot.com/-tXOB96gAHDw/VD5osZHxO7I/AAAAAAAADW8/I2xR2Y7ILno/s1600/Twitter.png" /></a></li>
     <li class="media_icon"><a href="#" target="_blank" title="Google+"><img border="0" src="http://4.bp.blogspot.com/-FqIofizw4c8/VD5orBp6ogI/AAAAAAAADXE/Ums6cB01Eog/s1600/Google.png" /></a></li>
     <li class="media_icon"><a href="#" target="_blank" title="Youtube"><img border="0" src="http://4.bp.blogspot.com/-Fa5cSV-VRvE/VEd2E6XXBGI/AAAAAAAADc4/9E5QBUoKcEU/s1600/Youtube.png" /></a></li>
     <li class="media_icon"><a href="#" target="_blank" title="Rss"><img border="0" src="http://4.bp.blogspot.com/-8R-8VGPvR5c/VEd1x3HRw7I/AAAAAAAADco/2edV8BCA7cg/s1600/Rss.png" /></a></li>
    </ul>
</div>
<div class="pro-subscribe-rashid">SubScribe Me<br/>Email Update</div>
 <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=prozokti', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
  <input  type="text" class="pro-email-field" name="email" autocomplete="off" placeholder="Your email adress"/><br />
  <input type="hidden" value="prozokti" name="uri"/>
  <input type="hidden" name="loc" value="en_US"/>
  <input type="submit" value="Submit" id="pro-subscribe-submit"/>
 </form>
</div>
  • সবশেষে Gadget টি Save করুন।

কাষ্টোমাইজেশনঃ

  • সোসিয়াল মিডিয়া আইকনগুলি ঠিক মাপমত না বসলে নীল কালারের margin-left:20px পরিবর্তন করে দিতে পারেন।
  • উপরের লাল কালারের # এর জায়গার সোসিয়াল মিডিয়াগুলির এড্রেস দেন।
  • পিংক কালারের prozokti এর স্থলে আপনার Feedburner একাউন্ট এর নাম দেন।
  • আপনার যদি Feedburner একাউন্ট না থাকে তাহলে এখান থেকে তৈরী করে নিতে পারেন।
Subcribe to our all updates

and Share on
পূর্ববর্তী পোষ্ট
পরবর্তী পোষ্ট

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

  1. ভাই blogolect থেকে কপি পেস্ট মারসেন। কাজ হয় না ভাই। কপি পেস্ট করবেন না। আমি আমার ২ টা ব্লগে এটা লাগিয়েছিলাম, কিন্তু যা দেখলাম, একই ইমেল দিয়ে ২ টা ব্লগ সাবস্ক্রাইব করা যাচ্ছে না। কেন যে এমন করেন।

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

      মুছুন
  2. Feedburner এর নাম বলতে কি পুরো লিংকটা দেব নাকি শুধু আমার তৈরী করা নাম দেব ?
    যেমনঃ- পুরো লিংকঃ- http://feeds.feedburner.com/freeallSolution
    শুধু নামঃ- freeallSolution

    উত্তরমুছুন
    উত্তরগুলি
    1. কোডগুলির লাল কালারের Prozokti এর স্থলে freeallSolution বসিয়ে দেন।

      মুছুন
  3. email বক্সটি ছোট হয়ে আসছে । বড় করার উপায় কি ? না বুঝলে এখানে দেখুন http://www.freesolution.net আমি সেট করেছি । সব ঠিক আছে কিন্তু মেইল লিখার বক্সটি ছোট ।

    উত্তরমুছুন
    উত্তরগুলি
    1. .pro-email-field এর Width:90% করে দেন, তাহলে কোন সমস্যা হবে না।

      মুছুন

 
Subscribe for all Updates

Subscribe Now

কপিরাইট © 2015- প্রযুক্তি ডট কম ™, সর্বস্বত্ব সংরক্ষিত

Powered by: