डिफ़ॉल्ट about me ऑथर बॉक्स को प्रोफेशनल ऑथर बॉक्स कैसे बनाए

Google About Me ऑथर box ko proffessional Auther box kaise Banaye

किसी भी ब्लॉग और उसपे साझा की जाने किया जानेवाला इनफार्मेशन कौन साझा करता है क्या साझा करता है किस-किस टॉपिक से रिलेटेड जानकारी शेयर करता है ये सब एक विजेट के द्वारा हम रीडर्स को बताते है वो widget About auther box होता है

किसी भी ब्लॉग वेबसाइट की owner और उसपे शेयर किया जाने वाला इनफार्मेशन जानने के लिए about box लगाया जाता है ताकि रीडर्स को आसानी से पता चल सके की उस ब्लॉग वेबसाइट के owner कौन है और वो क्या साझा करता है यहाँ हम बात कर रहे है Google + About me को proffessional कैसे बनाए

Google+-auther-box-ko-design-kaise-kare
Google+ about me box ko design kaise kare

Google + का डिफ़ॉल्ट ऑथर बॉक्स को प्रोफेशनल लुक देने के लिए आप नीचे दिए गए गाइड को फ़ॉलो करें HindivHelp यानी इस ब्लॉग पर भी Google  का डिफ़ॉल्ट ऑथर बॉक्स ही ऐड है सिर्फ उसे कस्टमाइज किया गया है कोडिंग की मदद से आप भी HindivHelp ब्लॉग के ऑथर बॉक्स जैसा ऑथर बॉक्स अपने ब्लॉग मे add कर सकते है
इस ऑथर बॉक्स को आप जहाँ चाहे add कर सकते है Side bar, footer Post ke niche Share button के नीचे जैसा की  Hindivhelp ब्लॉग मे है इसके लिए नीचे step बताए गए है आप उन्हें फॉलो करें और अपने ब्लॉग के डिफ़ॉल्ट ऑथर बॉक्स को preffessional ऑथर बॉक्स बना कर ब्लॉग मे add करें

आप ऑथर बॉक्स से रिलेटेड other पोस्ट भी read करें आपको जो ऑथर बॉक्स अच्छा लगे उसे अपने ब्लॉग मे Add करें

ये भी पढ़े ; 

Sabhi Post ke niche auther box kaise add kare

Simple auther box kaise add kare

Default Auther box google + ko proffessional auther box kaise banaye

Step.1 Niche दिए गए Css code Copy करें

/* CSS Author Bio Box by HvH */ .authorboxwrap{Font-family: Open Sans;background:#fff;margin:10px auto 20px;padding:20px;overflow:hidden;border:1px solid #ccc;} .avatar-container {float:left;margin-right:20px;border: 1px solid silver;padding: 3px;} .avatar-container img{width:110px;height:auto;} .author_description_container h4{font-family:Open Sans; font-weight:700;font-size:16px;display:block;margin:0;margin-bottom:2px} .author_description_container h4 a{color:#ef4824} .author_description_container h4 a:hover{color:#404040} .author_description_container p{margin:0;color:#888;font-size:95%;margin-bottom:8px;font-family: Open Sans;} .authorsocial a{display:inline-block;text-align:center;margin-right:10px} .authorsocial a i{font-family:Fontawesome;width:20px;height:20px;line-height:20px;padding:5px;display:block;opacity:1;border-radius:50%;transition:all .3s;} .authorsocial a:nth-child(1) i {background:#2d609b;color:#fff;} .authorsocial a:nth-child(2) i {background:#19bfe5;color:#fff;} .authorsocial a:nth-child(3) i {background:#eb4026;color:#fff;} .authorsocial a:hover:nth-child(1) i,.authorsocial a:hover:nth-child(2) i,.authorsocial a:hover:nth-child(3) i {opacity:0.90;}

Step.2 Blogger dashboard मे जाए >>> theme >>> Edit html >>> Theme की Coding open हो जाएगा

Step.3 Theme मे Ctrl +f की मदद से नीचे दिए गए Code Search करें

      </style>          

Code मिल जाने पर ऊपर जो Code copy किया है उस code को </style> के पहले [ ऊपर ] peste करें

Step.4 अब ये code copy करें

<div><b:if cond=’data:blog.pageType == &quot;item&quot;’> <div class=’authorboxwrap’> <div class=’authorboxfull’> <div class=’avatar-container’> <a href=”> <img class=’author_avatar’ expr:alt=’data:post.author’ expr:src=’data:post.authorPhoto.url’ height=’110′ width=’110’/> </a> </div> <div class=’author_description_container’> <h4>Author: <a href=’#’ rel=’author’><data:post.author/></a></h4> <p> <data:post.authorAboutMe/> </p> <div class=’authorsocial’> <a class=’img-circle1′ href=’#‘ rel=’nofollow’ target=’_blank’><i class=’fa fa-facebook’/></a> <a class=’img-circle2′ href=’#‘ rel=’nofollow’ target=’_blank’><i class=’fa fa-twitter’/></a> <a class=’img-circle3′ href=’#‘ rel=’nofollow’ target=’_blank’><i class=’fa fa-google-plus’/></a> <div class=’clr’/> </div> </div> </div> </div> <div style=’clear:both’/> </b:if> </div>

Code Customization ; # की जगह अपने सोशल साइट्स का लिंक add करें Facebook Twitter Google+

Step.5 अब अपने ब्लॉगर window मे जाए और theme मे नीचे दिए code सर्च करें

          <div style=’clear:both’/>      

Code मिल जाने के बाद step.5 से जो code कॉपी किया है उसे

<div style=’clear:both’/> Code के नीचे peste करें

Note ; <div style=’clear:both’/> Code नहीं मिले तो <data:post.body/> Code find करें और 3सरे  <data:post.body/> के नीचे code peste करें

फाइनली Code peste करने के बाद theme Save करें

Step.6 अब https://plus.google.com/u/0/USER-NAME/about पर जाए Story Section Edit पर Click करें अपने और अपने ब्लॉग के बारे मे लिखें उसके बाद save कर दे

Step.7 अब blogger डैशबोर्ड मे जाए Layout पर Click करें Main post उसके नीचे edit पर click करें

About-me-box-ko-proffessional-look-kaise-de

Dashboard >> Layout >> Sidebar Main post >> Edit

Step.8 Show Author Profile Below Post ✔ करें and Save कर दे

Default-authet-box-ko-customize-kaise-kare


Congrats; आपने Google + डिफ़ॉल्ट ऑथर बॉक्स को प्रोफेशनल ऑथर बॉक्स बना कर अपने ब्लॉग मे add कर लिया है Check करने के लिए अपने ब्लॉग को ओपन करके देख सकते है Code add करने मे किसी प्रकार की परेशानी हो तो नीचे Comment बॉक्स मे अपना परेशानी लिखें आपकी परेशानी दूर किया जाएगा

उम्मीद करता हूं की आपको ये आर्टिकल पसंद आया पसंद आए तो सोशल साइट्स पर शेयर जरूर करें

Share on:

My Name is manish i am the founder of this successbranch blog. the main objective this blog is to promote hindi in the world . for this, i share all kinds of information here in hindi Learn More

Leave a Comment

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