BloggingHindi - Blogging Aur Internet Ki Sabhi Jankari

  • About Us
  • Contact Us
  • Blogging
  • WordPress
  • SEO

Blogspot Blog Me Fancy Author Box kaise Lagaye

Last Updated on January 5, 2021 by Md Arshad Noor 2 Comments

हमें अपने blog का Design करना बहुत important होता है. हर blogger चाहता है की उसके blog का look अच्छा हो. आप भी अपने blog का design अच्छा करना चाहते हो तो इस post में हम आपको Blog में Author box लगाने के बारे में बताएँगे।

Blog me author box about box kaise add kare lagaye 100% working

अगर आप एक blogger हो तो आपको आपको अपने visitors के साथ अच्छा तालमेल रखना बहुत जरुरी होता है. आपके visitors की आपके बारे में अच्छी जानकारी होने चाहिए जिससे आपके visitors के साथ अच्छा सम्बन्ध होगा और वो आपके blog को कभी भूल नहीं पाएंगे।

Author box ब्लॉग में क्यों add करें
आपके readers आपके बारे में जानने के लिए उत्सुक रहता है। आपके readers को आपके बारे में पूरी तरह से जानकारी होना बहुत जरुरी होता है की आप कौन हो,कहा से हो ये जानकारियां आपके readers को मालूम होगा तो आपको उससे relationship बढ़ेगी. और ये आपके blog की traffic बढ़ाने में मदद करेगा।

Author box कैसे Add करे?

अब में आपको एक अच्छा और fancy author box लगाने के बारे में बता रहा हूँ. आप मेरे साथ steps follow कीजिए और आसानी से आप इस widget को अपने ब्लॉग में लगा सकते हो।

Step 1: सबसे पहले blogger में जाकर login कीजिए और Blog Dashboard में जाइये।

Step 2: इस code को copy कीजिए।

 

<script>
jQuery(document).ready(function(a){a(".ts-fab-tabs > div").hide();a(".ts-fab-tabs > div:first-child").show();a(".ts-fab-list li:first-child").addClass("active");a(".ts-fab-list li a").click(function(){a(this).closest(".ts-fab-wrapper").find("li").removeClass("active");a(this).parent().addClass("active");var b=a(this).attr("href");if(b.indexOf("#")!=-1){currentTabExp=b.split("#");b="#"+currentTabExp[1]}a(this).closest(".ts-fab-wrapper").find(".ts-fab-tabs > div").hide();a(b).show();return false})});</script>
<style>.ts-fab-wrapper{margin:0 0 2em;clear:both}.ts-fab-wrapper a{text-decoration:none!important}.ts-fab-wrapper img{border:none!important}.ts-fab-list{overflow:hidden;padding:0 0 0 5px!important;margin:0!important}.ts-fab-list li{display:block;float:left;list-style:none;margin:0 5px 0 0!important}.ts-fab-list li a{display:block;line-height:16px;height:16px;padding:8px 12px;background-color:#e9e9e9;border:1px solid #e9e9e9;border-bottom:none!important;text-decoration:none;font-size:13px;color:#333;font-weight:bold;outline:0;text-shadow:none!important;border-radius:5px 5px 0 0;-webkit-border-radius:5px 5px 0 0;-moz-border-radius:5px 5px 0 0}.ts-fab-list li a:hover{color:#333}.ts-fab-list li.active a{background-color:#333;color:#fff;border-color:#333}.ts-fab-list li a{background-image:url('http://www.pagetrafficbuzz.com/wp-content/plugins/fanciest-author-box/images/fab_tab_icons.png')}.ts-fab-list li.ts-fab-bio-link a{background-position:8px 8px;background-repeat:no-repeat;padding-left:27px}.ts-fab-list li.ts-fab-bio-link.active a{background-position:-280px 8px;background-repeat:no-repeat;padding-left:27px}.ts-fab-list li.ts-fab-twitter-link a{background-position:8px -42px;background-repeat:no-repeat;padding-left:35px}.ts-fab-list li.ts-fab-twitter-link.active a{background-position:-270px -42px;background-repeat:no-repeat;padding-left:35px}.ts-fab-list li.ts-fab-facebook-link a{background-position:8px -92px;background-repeat:no-repeat;padding-left:23px}.ts-fab-list li.ts-fab-facebook-link.active a{background-position:-284px -92px;background-repeat:no-repeat;padding-left:23px}.ts-fab-list li.ts-fab-googleplus-link a{background-position:8px -142px;background-repeat:no-repeat;padding-left:30px}.ts-fab-list li.ts-fab-googleplus-link.active a{background-position:-276px -142px;background-repeat:no-repeat;padding-left:30px}.ts-fab-list li.ts-fab-linkedin-link a{background-position:8px -242px;background-repeat:no-repeat;padding-left:30px}.ts-fab-list li.ts-fab-linkedin-link.active a{background-position:-276px -242px;background-repeat:no-repeat;padding-left:30px}.ts-fab-list li.ts-fab-latest-posts-link a{background-position:8px -192px;background-repeat:no-repeat;padding-left:27px}.ts-fab-list li.ts-fab-latest-posts-link.active a{background-position:-280px -192px;background-repeat:no-repeat;padding-left:27px}.ts-fab-list li.ts-fab-custom-link a,.ts-fab-list li.ts-fab-additional-link a{background-image:none!important}.ts-fab-widget .ts-fab-list li a,.ts-fab-icons-only .ts-fab-list li a{text-indent:-9999em;padding:8px 12px!important}.ts-fab-widget .ts-fab-list li.ts-fab-bio-link a,.ts-fab-icons-only .ts-fab-list li.ts-fab-bio-link a{width:4px}.ts-fab-widget .ts-fab-list li.ts-fab-twitter-link a,.ts-fab-icons-only .ts-fab-list li.ts-fab-twitter-link a{width:12px}.ts-fab-widget .ts-fab-list li.ts-fab-googleplus-link a,.ts-fab-icons-only .ts-fab-list li.ts-fab-googleplus-link a{width:8px}.ts-fab-widget .ts-fab-list li.ts-fab-linkedin-link a,.ts-fab-icons-only .ts-fab-list li.ts-fab-linkedin-link a{width:8px}.ts-fab-widget .ts-fab-list li.ts-fab-facebook-link a,.ts-fab-icons-only .ts-fab-list li.ts-fab-facebook-link a{width:0}.ts-fab-widget .ts-fab-list li.ts-fab-latest-posts-link a,.ts-fab-icons-only .ts-fab-list li.ts-fab-latest-posts-link a{width:4px}.ts-fab-widget .ts-fab-list li.ts-fab-custom-link a,.ts-fab-icons-only .ts-fab-list li.ts-fab-custom-link a{text-indent:0!important}.ts-fab-tab{display:none;border:2px solid #333;padding:12px;background:#fff;min-height:80px}.ts-fab-tab:after{content:'';display:table;clear:both}.ts-fab-tab:first-child{display:block}.ts-fab-widget .ts-fab-tab{padding:8px}.ts-fab-avatar{display:block;float:left;width:64px;height:64px}.ts-fab-no-float .ts-fab-avatar{float:none;margin:0 0 12px}.ts-fab-avatar img{display:block;border:none!important}.ts-fab-text{margin-left:104px;line-height:1.5}.ts-fab-no-float .ts-fab-text{margin-left:0}.ts-fab-header{margin-bottom:10px}.ts-fab-text h4{clear:none;font-size:18px;line-height:1!important;font-weight:bold;margin:0 0 .2em!important;line-height:1;padding:0}.ts-fab-description{font-size:12px}.ts-fab-follow{margin-top:10px}.ts-fab-latest{margin:0!important;padding:0!important}.ts-fab-latest li{list-style:none!important;line-height:1.1;margin:0 0 .6em!important}.ts-fab-latest li span,.ts-fab-twitter-time{font-size:12px}.latest-see-all{font-weight:normal}.ts-fab-wrapper iframe{margin-bottom:0!important}body.rtl .ts-fab-avatar{float:right}body.rtl .ts-fab-text{margin-left:0;margin-right:76px}body.rtl .ts-fab-list{padding:0 5px 0 0!important}body.rtl .ts-fab-list li{float:right;margin:0 0 0 5px!important}.fb_iframe_widget>span,.fb_iframe_widget>span iframe{min-height:64px!important}
</style>
<div style='position: fixed; bottom: 2%; left: 2%;'>
<div class='shareEgg' id='shareThisShareEgg'/>
</div>

 

 

 

Step 3: अब Layout>>HTML/Javascript में जाइये और copy किये हुआ code को past करके save कर दीजिए।

Step 4: अब template>>Edit HTML में जाइये और ctrl+f दबा के <div class=”post-footer”>    search कीजिए।

Step 5: अब निचे दिए गए code को  <div class="post-footer"> के निचे past कर दीजिए

 

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<br/>
<div class='ts-fab-wrapper ts-fab-icons-text' id='ts-fab-below-16747'>
<ul class='ts-fab-list'>
<li class='ts-fab-bio-link'><a href=' #ts-fab-bio-below-16747'>Bio</a></li>
<li class='ts-fab-twitter-link'><a href='http://www.blogger.com/blogger.g?blogID=Apna blog id likhe yaha #ts-fab-twitter-below-16747'>Twitter</a></li>
<li class='ts-fab-facebook-link'><a href='http://www.blogger.com/blogger.g?blogID=Apna blog id likhe yaha #ts-fab-facebook-below-16747'>Facebook</a></li>
<li class='ts-fab-googleplus-link'><a href='http://www.blogger.com/blogger.g?blogID=Apna blog ID likhe yaha #ts-fab-googleplus-below-16747'>Google+</a></li>
<li class='ts-fab-latest-posts-link'><a href='http://www.blogger.com/blogger.g?blogID=Apna blog id likhe yaha #ts-fab-latest-posts-below-16747'>Latest Posts</a></li>
</ul>
<div class='ts-fab-tabs'>
<div class='ts-fab-tab' id='ts-fab-bio-below-16747'>
<div class='ts-fab-avatar'>
<img alt='Image alt text yaha likhe' class='photo' height='80' src='Apna image link likhe' width='80'/></div>
<div class='ts-fab-text'>
<div class='ts-fab-header'>
<h3>Apna nam yaha likhe</h3>
</div>
<div class='ts-fab-content'>
Apne baare me yaha likhe</div>
</div>
</div>
<div class='ts-fab-tab' id='ts-fab-twitter-below-16747'>
<div class='ts-fab-avatar'>
<img alt='Image alt text likhe' class='photo' height='80' src='Apna photo link dijiye' width='80'/></div>
<div class='ts-fab-text'>
<div class='ts-fab-header'>
<h3>
<a href='http://twitter link yaha likhe'>Twitter user name likhe</a></h3>
<div class='ts-fab-description'>
CEO &amp; Editor, <a href='http://Apne website ka url likhe/ ' target='_blank' title=' http://Apne site ka url likhe '>Apne site title likhe </a></div>
</div>
<br/>
<div class='ts-fab-follow'>
<a class='twitter-follow-button' data-lang="en_US data-show-count=’true’ href="Twitter link'>Follow @Twitter user name</a></div>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement
(s);js.id=id;js.src=&quot;//platform.twitter.com/widgets.js&quot;;fjs.parentNode.insertBefore(js,fjs);}}(document,&quot;script&quot;,&quot;twitter-wjs&quot;);</script>
</div>
</div>
<div class='ts-fab-tab' id='ts-fab-facebook-below-16747'>
<div class='ts-fab-avatar'>
<img alt='Image alt text' class='photo' height='80' src='Image link' width='80'/></div>
<div class='ts-fab-text'>
<div id='fb-root'>
</div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = &quot;//connect.facebook.net/en_US/all.js#xfbml=1&quot;; fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));</script> <br/>
<div class='ts-fab-header'>
<h3>
<a href='http://Facebook link'>
Apka nam</a></h3>
</div>
<div class='fb-subscribe' data-href='http://Facebook link' data-layout='standard' data-show-faces='false' data-width='320'>
</div>
</div>
</div>
<div class='ts-fab-tab' id='ts-fab-googleplus-below-16747'>
<div class='ts-fab-avatar'>
<img alt='Image alrt text' class='photo' height='80' src='Image link' width='80'/></div>
<div class='ts-fab-text'>
<div class='ts-fab-header'>
<h3>
<a href='https://Google plus limk?rel=author">Apka nam</a></h3>
</div>
<!-- /.ts-fab-header -->
<g:plus height='69' href='https://Google plus link' width='320'/>
</div>
</div>
<div class='ts-fab-tab' id='ts-fab-latest-posts-below-16747'>
<div class='ts-fab-avatar'>
<img alt='image alt text' class='photo' height='80' src='image link ' width='80'/></div>
<div class='ts-fab-text'>
<div class='ts-fab-header'>
<h3>
Latest posts by Apka nam <span class='latest-see-all'>(<a href='http://apka website url'>see all</a>)</span></h3>
</div>
<ul class='ts-fab-latest'>
<div id='hlrpsa'>
<script src='http://helplogger.googlecode.com/svn/trunk/recent-posts-with-snippets.js'>
</script>
<script>
var numposts = 3;var showpostdate = false;var showpostsummary = false;var numchars = 100;var standardstyling = true;
</script>
<script src='http://www.yoursite.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts'>
</script>
</div>
</ul>
</div>
</div>
</div>
</div>
</b:if>

 

अब जहा जहा red colour है वहां आप setup कर लीजिए उसके बाद template save कर दीजिए।

 

You May Also Like

  • Blogger Se “Powered By Blogger” Kaise Remove Kare

    Blogger Se “Powered By Blogger” Kaise Remove Kare

  • Blogger Me Syntax Highlighter Add Karke Post Me Code Kaise Dikhaye

    Blogger Me Syntax Highlighter Add Karke Post Me Code Kaise Dikhaye

  • Blogger Me Multiple Authors Ko Kaise Add Kare

  • Blogspot Blog me Error 404 Not Found Ko Custom Redirect Kaise Kare

About Md Arshad Noor

हेलो दोस्तों, मेरा नाम मोहम्मद अरशद नूर है. में इस ब्लॉग में रेगुलर नई नई आर्टिकल्स लिखता हूँ. यहाँ पर हम ज्यादातर Blogging, Make Money, SEO, WordPress आदि से सम्बंधित Article मिलेगी. आपको हमारी लेख पसंद आती है तो इसे सोशल मीडिया में शेयर करें। अगर आपको कोई सहायता चाहिए तो कमेंट कीजिए।

COMMENTs ( 2 )

  1. SHAILENDRA KUMAR says

    bro is post me code to copy he nhi ho rha hai

    Reply
    • Md Arshad Noor says

      Ab ckeck karo bhai.

      Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Please do not spam! otherwise your comment will be removed.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Get it on Google Play

Useful Articles

Khush Nahi Rahne Wale Logo Ki 5 Buri Aadte

Revenue Hits kya hai aur isme Account kaise banaye

Blogspot Blog me Country Specific Redirect Disable kaise Kare

Spam Mail Sender Se Unsubscribe Karke Spam Mail Se Kaise Bache

Google Me Search Karne Ke Top 10 Tips & Trick – [Get Right Results Fast]

Google Search Results Me Blog Ke Sabhi Posts Me Star Rating Kaise Dikhaye

Blog Homepage Me Only Post Title Kaise Dikhaye

Blogging me fail hone ka 10 sabse Bada Karan

Social Media se More Traffic Pane ke Liye 10 Important Tips

Quora Se Blog Ki Traffic Kaise Badhaye? 5 Tips

Blog Post me Keyboard key kaise lagaye

YouTube Se PR9 Dofollow Backlink Kaise Receive Kare

Blog Post Copy Hone Par Copyright Post Me Automatic Apne Blog Ki Link Add Kare

About Us

mdarshadnoorहेल्लो दोस्तों, मेरा नाम मोहम्मद अरशद नूर है. में अररिया, बिहार का रहने वाला हूँ. मुझे नयी चीजें सीखना-सिखाना बहुत पसंद है. में पिछले 5 सालों से ब्लॉगिंग के फील्ड में हूँ. इस ब्लॉग में आपको ब्लॉगिंग और इन्टरनेट से सम्बन्धित जानकारी मिलेगी.

SUBSCRIBE OUR NEWSLATTER

हमारे ब्लॉग के रेगुलर विजिटर हो तो अभी Subscribe कर लीजिए ताकि आप हमारे नए पोस्ट को सबसे पहले पढ़ पाएँ!

Posts for WP Users:

WordPress Me Spam Comment Se Bachne Ke Liye 10 Smart Ways

Apko Blog Me Genesis Theme Kyu Use Karna Chahiye? [10 Reasons]

Security Ke Liye WordPress Login URL Me Key Aur Value Kaise Add Kare

Blog Ki HeatMap Banane Ke Liye 5 Free Plugins

Hosting Buy Karte Time Paise Kaise Bachaye? 8 Tips [Save Money Upto 80%]

More Posts from this Category

Recommended For You

WordPress vs Blogger: Apke liye kaun behtar hai

QR Code Kya Hai? QR Code Kaise Banaye aur Scan Kaise Kare

India Me Bitcoin Kaise Kharide [Buy Bitcoin]

Blog me Email Subscription widget Kaise Add Kare 2 Tarike

WordPress Toolbar/Adminbar Ko Hide Aur Customize Kaise Kare

Adsense se related 30+ important questions & Answers

Youtube se paise kaise kamaye- A to Z puri jankari

Revenue Hits kya hai aur isme Account kaise banaye

WordPress Install karne Ke Baad 10 Jaruri Sittings Kare

Copyright © 2020 - All rights reserved.AboutContactSitemapDisclaimer