Blogger sabhi post ke niche about us (author box) kaise lagaye ?

Hi blogger yadi aap chahte hai ki aapke har ek post ke niche about us hona jaruri hai to aaj me aapko bataunga ki  blogger ke har ek post ke niche about auther auto kaise lagaye..

Agar aap chahate hai ki aapke visitors aapko pahchan sake or nhe pata rahe ki wo kiski website ya blog par hai. isse aapka naam bhi hoga or logo ko aapki site ko yad rakhne me aasani hogi, blog ki traffic badhane me bhi madad milegi. or bhi bahut se fayde hai author box add karne ke.
Ye bhi pade

Blogger ke sabhi post ke niche about us box kaise lagaye..

Step 1
sabse pahle apne blog ke dashboard
Blogger sabhi post ke niche about us kaise lagaye ?
Layout par jayesabse pahle apne blog ke dashboard >> Layout par jaye.
Blogger sabhi post ke niche about us kaise lagaye ?

layout select kare.

  1. blog posts widget par Edit par click kare.
Step 2:
Ab ek popup page khulega usme show author profile ke samne tick kare.
  1. save par click kar save template par click kar de.
Step 3
  • Ab apne blog ke dashboard me jaye.
  • Template >> EDIT HTML par click kare.
  • Ab code box me kahi par bhi click kare or Ctrl+F daba kar ]]></b:skin> search kare.
  • Template me ]]></b:skin>  ke upar ye code paste kare.
  1. /* css Author Box start by https://www.hindihelp4u.com */
    
     .articleAuthor{overflow:hidden;margin-bottom:10px}
    
     .authorContent{overflow:hidden;background:#f1f1f1;padding:0;margin:1px;margin-bottom:0;border-top:2px solid #e9e9e9;}
    
     .authorLeft{overflow:hidden;float:left;margin-right:10px;}
    
     .authorLeft .authorAvatar{overflow:hidden;}
    
     .authorLeft .authorAvatar img{background:#f1f1f1;display:inline-block;}
    
     .authorDetails{overflow:hidden;margin:14px 0 0 0;}
    
     .authorDetails h2{font-size:12px;color:#222;font-weight:400;text-transform:uppercase;}
    
     .authorDetails h2 a{color:#4db2ec;background:#f1f1f1;padding:4px 8px;display:inline-block;font-size:15px;margin-left:5px;border:double #f1f1f1;}
    
     .authorDetails h2 a:hover{color:#71c5f6;background:#f1f1f1;}
    
     .authorDetails span{display:block;padding-top:3px}
    
     .articleAuthor .authorContent p{color:#222;line-height:20px;margin:0 10px;font-size:15px;}
    
     /* css Author Box start by https://www.hindihelp4u.com
Background:#f1f1f1 ki jagah aap apni pasand ka color change kare.
Step 4
  • Ab ye code <data:post.body/> search kare.
  • <data:post.body/> ke niche ye code paste kare.
  1. <div class='articleAuthor'>
    <div class='authorContent'>
    <div class='authorLeft'>
    <div class='authorAvatar'>
    <img alt='' class='avatar avatar-120 photo dontshowit showit' height='120' src='https://www.hindihelp4u.com' width='120'/>
    </div>
    </div>
    <div class='authorDetails'>
    <h2>
    About Author<a href='https://www.hindihelp4u.com' rel='author' title='Admin'>your name</a></h2>
    </div>
    about you
    </div>
    </div>
  • Hindihelp4u.com ki jagah apni site ya blog ka url set kare.
  • Abot us ki jagah apni dtails likhe.
  • Codeset karne ke bad Save  Template  par click kare.

Photos/image ka URL kaise nikale ?

  • New post likhne ke option par jao or post me apna photo upload karo.
  • Ab Compose/HTML option me se HTML par click karo.
  • Abcoding me 2 tarah ke link honge href or src aapko src ke samne wala link use karna hai.
Note:-  <data:post.body/>  code blog ki template me kei jagah par hota hai. agar trick kaam na kare to dusre  <data:post.body/> ke niche code paste karke try kare.
SHARE ON SOCIAL MEADIA
Whatsapp

Leave a Reply

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