Internet par aysi koi website or blog nahi hoga. Jis par social media follow button add naho. Its really impossible. Yakinan har ek site par facebook, google plus, twiiter, pinterest, instagram and other koi na koi social icon add hote hai. To chaliye kyu na aap bhi aaj apne blog par font awesome social media follow icon add kar lijiye.
Maine apni pichli post Social Follow Buttan Widget Blogger Me Kaise Add Kare post me bhi blogger me social media foolow button add karne ki jankari di hai. Usme aapko different color ke social follow button ki information milegi.
- Blog Ki Left Side Me Floating Social Media Share Buttons Kaise Add Kare
- Blog Post Ke Niche/Upar Social Share Buttan Kaise Lagate Hai
Is post me mai aapko simple social icon add karne ke bare me bta raha hu. Iska screenshot aa pupar feature image me dekh sakte hai. Yaha mai aapko jo social icon ki coding bta raha hu use aap blogger blog, WordPress blog, joomla and other kisi bhi platform par bane blog ya website me use kar sakte ho. Ye har site par work karega.
- Facebook Instant Articles Kya Hai All Feature Details in Hindi
- Top 50 Blogging Quotes in Hindi - Successful Blogger
Website me social media icon add karke aap apne reader se social sites par bhi contact kar sakte ho or apni new post ko unke sath share kar sakte ho. Isse log aapko socila media par follow karenge or aapko social media sites se quality traffic bhi milega. Iske bare me maine Social Media Sites Se Adhik Traffic Pane Ke Top 5 Clever Ways post me details se btaya hai. Aap ek bar is article ko jarur padhiye.
Font Awesome Kya Hai or Iske Social Icon Kyu Use Karne Chahiye?
Font awesome aapko site par ayse social icon add karne ko deti hai jisme aapko image use karne ki jarurat nahi hoti hai. Fon awesome sirf aapko icon deti hai uske pas CSS pwer nahi hoti hai. So aapko social icon khud design karne hote hai. Aap chahe jaise font awesome social icon ka color, style, size and other setting kar sakte ho. Font awesome icon ko use karne ke kuch fayde aapko yaha bta raha hu.
- Fast Loading: Aapne pahle bhi agar apni site par social icon use kiye honge to aapne dekha hoga ki wo icon images ke hote hai or images load hone me jyada time leti hai. Isliye images social icon se site ki loading speed kam ho jati hai. So font awesome social icon iska solution hai. Isme image ki jarurat nahi hoti hai.
- Large Connection Icon: Aap font awesome social icon hi nahi balki inke sath or bhi bahut sare icon use kar sakte ho. Isme aapko 100+ icon se bhi jyada icon milenge jaise aapko WordPress ka icon use karna hai to aao fa fa-wordpress use kar sakte ho. Isi tarah aapko jiska bhi icon add karna hai to aap <i><class="fa fa-iconname></i> coding use kar sakte ho.
- Custom CSS Support: Font awesome ki sabse achi bat ye hai ki aap iske icon ko chahe jaise design kar sakte ho. Aap uska background, color, style, size sab kuch change kar sakte ho. Bas iske liye aapko CSS coding ki jankari honi chahiye.
- Free: Mostly ayse social icon premium hote hai. But aap font awesome icon ko free me use kar sakte ho.
Ab aap jaru apni site par font awesome social icon add karna pasand karoge. So chaliye ab aage bat kartye hai blog me social icon add karne ki.
Blog Me Font Awesome Social Media Follow Icon Kaise Add Karte Hai
Font awesome social icon ko blog me add karna bahut simple hai. Iske aapke pas 2 option hai. First aap apni site ya blog me direct html widget me ye code paste kar sakte hai. Second option me aapko blog ke <head> ke niche code paste karna hoga. Mai yaha aapko second options yani direct widget add karne ke bare me details se bta raha hu. Aapko jo simple lage wo use kar sakte ho.
1. Simple Icon: Default background:
<style>
#smisocialicons {
text-align: left;
}
#smisocialicons a {
color: #font-color;
display: inline-block;
font-size: 16px;
width: 20px;
height: 20px;
line-height: 20px;
margin: 0 1px 6px;
}
</style>
<div id="smisocialicons">
<a href="https://www.facebook.com/JUMEDEENKHAN/" title="Facebook" target="_blank" rel="nofollow"><i class="fa fa-facebook"></i></a>
<a href="https://plus.google.com/+SupportMeIndia/posts" title="Google Plus" target="_blank" rel="nofollow"><i class="fa fa-google-plus"></i></a>
<a href="https://twitter.com/SupportMeIndiakhan" title="Twitter" target="_blank" rel="nofollow"><i class="fa fa-twitter"></i></a>
<a href="https://in.pinterest.com/jumedeenkhan/" title="Pinterest" target="_blank" rel="nofollow"><i class="fa fa-pinterest"></i></a>
<a href="https://www.instagram.com/jumedeenkhan/" title="Instagram" target="_blank" rel="nofollow"><i class="fa fa-instagram"></i></a>
<a href="https://www.YouTube.com/user/JUMEDEENKHAN" title="Youtube" target="_blank" rel="nofollow"><i class="fa fa-youtube"></i></a>
<a href="https://jumedeenkhan.tumblr.com/" title="Tumblr" target="_blank" rel="nofollow"><i class="fa fa-tumblr"></i></a>
<a href="https://feeds.feedburner.com/supportmeindia" title="RSS" target="_blank" rel="nofollow"><i class="fa fa-rss"></i></a>
</div>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" />
2. Awesome Background Social Icon:
<style>
#smisocialicons {
text-align: center;
}
#smisocialicons a {
background: #ae141f;
color: #fff;
display: inline-block;
font-size: 16px;
width: 30px;
height: 30px;
line-height: 30px;
margin: 0 1px 8px;
}
#smiicons a:hover{
background: #hover-color;
}
</style>
<div id="smisocialicons">
<a href="https://www.facebook.com/JUMEDEENKHAN/" title="Facebook" target="_blank" rel="nofollow"><i class="fa fa-facebook"></i></a>
<a href="https://plus.google.com/+SupportMeIndia/posts" title="Google Plus" target="_blank" rel="nofollow"><i class="fa fa-google-plus"></i></a>
<a href="https://twitter.com/SupportMeIndiakhan" title="Twitter" target="_blank" rel="nofollow"><i class="fa fa-twitter"></i></a>
<a href="https://in.pinterest.com/jumedeenkhan/" title="Pinterest" target="_blank" rel="nofollow"><i class="fa fa-pinterest"></i></a>
<a href="https://www.instagram.com/jumedeenkhan/" title="Instagram" target="_blank" rel="nofollow"><i class="fa fa-instagram"></i></a>
<a href="https://www.YouTube.com/user/JUMEDEENKHAN" title="Youtube" target="_blank" rel="nofollow"><i class="fa fa-youtube"></i></a>
<a href="https://jumedeenkhan.tumblr.com/" title="Tumblr" target="_blank" rel="nofollow"><i class="fa fa-tumblr"></i></a>
<a href="https://feeds.feedburner.com/supportmeindia" title="RSS" target="_blank" rel="nofollow"><i class="fa fa-rss"></i></a>
</div>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" />
Code ko apne blog me paste karne se pahle usme se meri social id url ki jagah apni social id url add kar le. Maine jo id change karni hai use highlight kiya hai.
WordPress: Agar aap WordPress user hai to ye step follow kare.
WordPress dashboard >> appearance >> widgets >> Select Text >> Choose widget location par ja kar code paste kare.
Blogspot: Or agar aap blogger user hai to ye step follow kare.
Blogger dashboard >> layout >> add a widget >> HTML/Javascript par ja kar code paste kare.
Now, ab aapko ek kaam or karna hai. Upar diye code me se apni social profile ke URL add kare or social icon ka background color change kare. Sath hi height or width code me 30 ki jagah aap apne hisab se size set kar sakte ho.
- SERPs Kya hai? SERP Performance Increase Karne Ki 5 Tips
- Apni English Writing Ko Behtar Kaise Banaye - Perfect English Kaise Likhe
I hope aapko ye article pasand aayega. So agar aapko ye icon sach me pasand aaye to is post ko social media par share jarur kare. Sath hi apna 2 minute ka time de kar post ke bare me comment me 2 lines jarur likhe.
Bohot accha trick hai. Mera ek question hai, apke jaisa WordPress mein ek blog banane mein kitna paisa lagega or monthly fee kitna hoga ?
Jyada nahi bas 1000-2000 monthly charnge lagta hai.
bhai aapki help chaiye me ek music website banane ki soch raah hu , kyaa ap mujhe batayenge ki music website kaise income karte hai .
Mai aapki WordPress, blogspot blog banane me help kar sakta hu. Music site banane ke liye aap wapka par contact karo.
M here bro kaisi website bnani hai.
1 . Php mein ya fir WordPress par.
Better Php rhegi.
2. For income Google absense + Uc union best hai. Agar uc union na use karo toh bhi best hai.
For more info Comment here. I will comment back ASAP :))
Sir Please Aap Mere Blog Me Visit Kar Dekhiye Ki Mera Blog Kesa He Or Mujhe Isme Or Kya Kya Improvement Karna Chahiye .
Badiya template hai. Nice look bro.
Nice Jumdeen Bro mai yahi search kar raha tha .
akhir kar apne aapne pic chnage kar hi di sir aap toh bade smart ho nice looking SiRRRRRR
ok thanx sir anyway your looking soo good broooo
Welcome bro.
sir niche WordPress mein last mein mere tamplate main Proudly powered by WordPress aa raha hai isko kasie remove karo theme editor mai jaa kr
Apnw blog ki theme me action.php file me ja kar iske link ko remove kar do.
hlo sir, blog par kaha par or kis type se AdSense lagayenge tab income hoti hai kyuki blogger hai jo per day k 1500 visitors aate hai or AdSense bhi hai but unke icome hi nahi hoti hai asha kyu
Aap blog ki sidebar widget, header widget or direct post me ads code paste karke ads laga sakte ho.
Sir kiya aap bata saktey hai ki mera tamplate thik hai ya nhi aur kiya yeh tamplate fast loading tamplate hai bhi ya nhi kyu ki Mai soch raha tha isko ab change naa hi karu ager aap final kr do ki thik hai toh mai ishe hi rahene deta hu verna koi aur dekhunga
badiya template design hai. maine check kiya ha ifast laoding ahi 3 second me open ho raha hai. Change mat karo bas iski hi ache se setting kar lo.
awesome bro. I will add this icons on my blog
sir Mike apki help chahiye
Bolo aapki kya help karu. Details me btana