Awesome! টিউনস
সকল Awesome! টিউনস

অসাধারণ একটি ব্লগার WIDGET! জলদি নিন! একের ভিতর অনেক!

3,136 দেখা 7 টিউমেন্টস জোসস
টিউন বিভাগ ওয়েব ডিজাইন
প্রকাশিত
Level 0

27 টিউনস 93 টিউমেন্টস 1 ফলোয়ার

আসালামুয়ালাইকুম, কেমন আছেন? হইত TITLE দেখে কিছুটা বুজতে পারছেন আমি কি নিয়ে লিখব, আজকে যা নিয়ে লিখব টা হল,  অসাধারণ একটি ব্লগার WIDGET! একের ভিতর অনেক!

নিছে ফটো টা দেখেন, কি কি আছে, অনেক কিছু,  Subscription box, Facebook like box, Social Sharing buttons, Follow us.

এইবার আসল কথগাই আসি, কিভাবে এইটা আপনার ব্লগ এ এড করবেন।

এইটা একদম সোজা, সব কোড কপি করে TEMPLATE>LAYOUT>ADD A GADGET> HTML/JAVASCRIPT > এ গিয়ে কোড গুলা পেস্ট করুন, কিন্তু সমস্যা হইল, এই WDIGET এর WIDTH একটু বেশিই বড়, , তাই এইটা আপনার টিউনের নিছে বসানো সব চেয়ে BETTER.

কিভাবে এইটা আপনার ব্লগের টিউনের নিছে বসাবেন, , ,  ্‌, ,  ্‌্‌ ্‌্‌

  • প্রথমে BLOGGER > TEMPLATE> EDIT HTML > CTRF+F এবং এই কোড টা সার্চ করে বের করুন <data:post.body/>

Note: আপনি এই কোড <data:post.body/> ৩ বার খুঁজে পেতে পারেন, কিন্তু আপনি ২য় অথবা ৩য়  <data:post.body/> এর ঠিক নিছে/পরে WIDGET কোড গুলা পেস্ট করবেন।

যদি আপনি চান এই WIDGET টিউন TITLE এর নিছে দেখা যাক, তাহলে  <data:post.body/>এর উপরে/আগে WIDGET কোড গুলা পেস্ট করবেন।

  • নিছে WIDGET CODE দিলাম, এইগুলা কপি করে <data:post.body/> এর নিছে পেস্ট করুন।
<!-Rashedul Islam Social Subscription Widget->
<b:if cond='data:blog.pageType = &quot;item&quot;'>
<style>.tbibox {background: #fff;
border: 1px solid #ddd;
height: 360px;
margin: 10px auto;
padding: 10px;
width: 572px;
-webkit-border-radius: 10px;
border-radius: 10px;}.tbisubscribe {border: 1px solid #D3D3D3;
padding: 8px;
width: 300px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;}.tbisubscribe:hover {-moz-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
-webkit-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);}.tbimailbox {border: 1px solid #D3D3D3;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 1px 1px 1px 1px rgba(255, 172, 84, 0.4) inset;
-webkit-box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
color: #666;
font: 14px "trebuchet ms", sans-serif;
padding: 7px 15px;
width: 160px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;}.tbimailbox:hover {-webkit-box-shadow: none;
box-shadow: none;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;}.tbisubmit {font: bold 12px Tahoma, Geneva, sans-serif;
font-style: normal;
color: #ffffff;
background: #ff5714;
border: 0px solid #ffffff;
text-shadow: 0px -1px 1px #222222;
box-shadow: 2px 2px 5px #000000;
-moz-box-shadow: 2px 2px 5px #000000;
-webkit-box-shadow: 2px 2px 5px #000000;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
padding: 8px 15px;
cursor: pointer;
margin: 0 auto;}.tbisubmit:active {cursor: pointer;
position: relative;
top: 2px;}.tbisubmit::-moz-focus-inner {border: 0;
padding: 0;
margin: 0;}.tbisharebox {border: 1px solid #D3D3D3;
margin: -157px 0 0 330px;
padding: 8px;
width: 225px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;}.tbisharebox:hover {-moz-box-shadow: 1px 1px 2px #CCC inset;
-webkit-box-shadow: inset 1px 1px 55px 1px rgba(249, 215, 126, 1);
box-shadow: inset 1px 1px 55px 1px rgba(249, 215, 126, 1);
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;}
</style>
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css' />
<div class='tbibox'>
<div class='tbisubscribe'>
<div style='color: #666666; font-weight: bold; font: 22px Oswald, cursive; margin: 0px 0px 10px 15px;'>Get Free Updates in your Inbox</div>
<div style='margin: 10px 0 0 6px;'>
<form action='http://feedburner.google.com/fb/a/mailverify' class='emailform'
method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=LiveMecca&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes, width=550, height=520&apos;);return true'
style='margin: 0pt;' target='popupwindow'>
<input name='uri' type='hidden' value='LiveMecca' />
<input name='loc' type='hidden' value='en_US' />
<input class='tbimailbox' name='email' 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;}'
type='text' value='Enter your email.' />
<input alt='' class='tbisubmit' title='' type='submit' value='Subscribe'/>
</form>
</div>
<div style='border: none; color: #666666; font: 22px Oswald, cursive; margin: 25px 0 0 5px;'>Follow us on:</div>
<div style='margin: -32px 0 0 120px;'>
<a href='https://www.facebook.com/Mecca.Live' target='_blank' title='Join us on Facebook'><img src='https://lh5.googleusercontent.com/-hbgtzN6sfys/UC_Rt4HCCUI/AAAAAAAAGI4/sNVfSO9oubo/s32/facebook500.png' alt='facebook'/></a>
<a href='https://twitter.com/LiveMeccaBD' rel='nofollow' target='_blank'
title='Follow us on Twitter'><img src='https://lh5.googleusercontent.com/-cBjXpo4xiHA/UC_RvG1JfwI/AAAAAAAAGJI/cQF9OReQCog/s32/twitter.png' alt='twitter'/></a>
<a href='https://plus.google.com/u/0/+RashedulIslamCTG' rel='nofollow' target='_blank'
title='Follow us on Google+'><img src='https://lh4.googleusercontent.com/-dzFCD4A8UqU/UC_Rtz0xGDI/AAAAAAAAGI8/iz4dYkboPZ0/s32/googleplus-revised.png' alt='gplus'/></a>
<a href='PINTEREST URL' rel='nofollow' target='_blank'
title='Follow us on Pinterest'><img src='https://lh3.googleusercontent.com/-VHXyLvPpEBg/UC_Rt63AIdI/AAAAAAAAGJA/xMdGrSFINE4/s32/pinterest.png' alt='pinterest'/></a>
<a href='RSS URL' rel='nofollow' target='_blank'
title='Subscribe to RSS'><img src='https://lh6.googleusercontent.com/-14vjEhUXrMk/UC_RuxvrOgI/AAAAAAAAGJQ/OQT6x8yxTXY/s32/rss.png' alt='rss'/></a>
</div>
</div>
<div class='tbisharebox'>
<script type='text/javascript'>
var switchTo5x = true;
</script>
<script src='http://w.sharethis.com/button/buttons.js' type='text/javascript'/>
<script type='text/javascript'>
stLight.options({onhover: false});
</script>
<div style='margin: 5px 5px;'>
<span class='st_fblike_hcount' displaytext=''></span>
</div>
<div style='margin: -30px -20px 0 0; float: right;'>
<a href='http://twitter.com/share' rel='nofollow' class='twitter-share-button'
expr:data-url='data:post.canonicalUrl' expr:data-text='data:post.title'
data-count='horizontal' data-lang='en'></a>
<b:if cond='data:post.isFirstPost'>
<script type='text/javascript' src='http://platform.twitter.com/widgets.js'></script>
</b:if>
</div>
<div class='addthis_toolbox addthis_default_style' style='margin: 10px 0 12px 85px;'>
<a class='addthis_counter'></a>
<script type='text/javascript' src='http://s7.addthis.com/js/250/addthis_widget.js'></script>
</div>
<div style='margin: 5px 5px;'>
<su:badge layout='1'></su:badge>
<script type='text/javascript'>
(function () {var li = document.createElement('script');
li.type = 'text/javascript';
li.async = true;
li.src = ('https:' = document.location.protocol? 'https:' : 'http:') + '//platform.stumbleupon.com/1/widgets.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(li, s);})();
</script>
</div>
</div>
<div style='float: right; margin: -40px -5px 0 0;'>
<div class='g-plusone' data-size='medium' expr:data-href='data:post.url'></div>
<script type='text/javascript'>
(function () {var po = document.createElement('script');
po.type = 'text/javascript';
po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(po, s);})();
</script>
</div>
<div style='margin-top: 20px;'>
<iframe allowTransparency='true' frameborder='0' scrolling='no' src='http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com/Mecca.Live&amp;width=570&amp;colorscheme=light&amp; show_faces=true&amp;stream=false&amp;header=false&amp;height=180'
style='border:none; overflow:hidden; width:570px; height:180px;' />
</div>
</div>
</b:if>
<a href='http://livemecca.blogspot.com/' target='_blank'><img alt='Live Mecca' src='http://4.bp.blogspot.com/-SuSOXujAicI/U0U2XyaiZiI/AAAAAAAAC2w/6vtimxREFjk/s1600/m.jpg' style='border: 0'/></a><a href='http://livebloggertricks.blogspot.com/2014/04/Add-Subscription-social-share-Widget-Blogger.html' target='_blank'><img alt='Live Blogger Tricks' src='http://4.bp.blogspot.com/-SuSOXujAicI/U0U2XyaiZiI/AAAAAAAAC2w/6vtimxREFjk/s1600/m.jpg' style='border: 0'/></a>
<!-Rashedul Islam Social Subscription Widget->

এইবার কিছু CUSTOMIZATION এর পালা।

  • LiveMecca কোড ২ টা আপনার FEEDBURNER USERNAME দিয়ে REPLACE করুন।
  • u/0/+RashedulIslamCTG আপনার GOOGLE  + USERNAME দিয়ে REPLACE করুন।
  • LiveMeccaBD আপনার Twitter USERNAME দিয়ে REPLACE করুন।
  • Mecca.Live আপনার Facebook page USERNAME দিয়ে REPLACE করুন।
  • Pinterest url আপনার Pinterst url  দিয়ে REPLACE করুন।

এইবার সেভ করুন।

কেমন লাগলো জানাবেন কিন্তু, সমস্যা হইলে অথবা আমার কোন ভুল হইলে জানাবেন, ধন্যবাদ,

 সৌজন্যে আমার ব্লগ.......

Level 0

আমি রাশেদুল ইসলাম। বিশ্বের সর্ববৃহৎ বিজ্ঞান ও প্রযুক্তির সৌশল নেটওয়ার্ক - টেকটিউনস এ আমি 12 বছর 5 মাস যাবৎ যুক্ত আছি। টেকটিউনস আমি এ পর্যন্ত 27 টি টিউন ও 93 টি টিউমেন্ট করেছি। টেকটিউনসে আমার 1 ফলোয়ার আছে এবং আমি টেকটিউনসে 0 টিউনারকে ফলো করি।

Something about me and my blog http://livemecca.blogspot.com/p/about_16.html

টিউনস

আরও টিউনস

টিউনারের আরও টিউনস

টিউমেন্টস

Level 0

eto JavaScript widget add korle blog er loading time 2x bere jabe. simple widget use kora e best.

Level 0

aito to simple e,,,,,,apni blog e 3-4 ta different widget use naa kore,,,,aksathe sob kora valo na ???

Level 0

এই টা ওয়াডপেস?

    Level 0

    @www.bangladesh.usa.cc: এইটা আমি আমার ব্লগার ব্লগ এ এড করসি, আপনি ওয়াডপেস এ করে দেখতে পারেন,

Level 0

@রাশেদুল ইসলাম: সুযোগ ফেলে আমার সাইট ঘুরে আসবেন

Level 2

খারাপ না, নতুনদের জন্য ভালো হবে। ধন্যবাদ