Tuesday, 26 September 2017

Wordpress Blog me Social Media Share Button Add Kaise Kare? Without plugins


Website owners and bloggers ke liye social media ek big platform hai, kyoki yaha se acchi website traffic increase ki ja sakti hai. Social media ke jariye website/blog ko popular kar sakate hai, to in this post hum wordpress website/blog me social share button without plugin ke add kaise kare is bare me janege.
How to add social media share buttons without plugins in wordpress website

Aapne dekha hoga ki har website par facebook, twitter, Google+, whatsapp, jaise social share button post/content me hote hai. Jaha se users content ko social media platform par share kar sakate hai. Agar visitor aapke blog ki post like karata hai to use social media par bhi share karata hai. So blog/website par social share button ka function hona chahiye. Jaha se users direct apne social profile ke through aapki post ko easly share kar sake.

Hum yaha par wordpress blog me social share button bina plugin ke add karne ke bare me bat kar rahe hai. Ab aap sochege ki wordpress par already lots of plugins available hai jiski help se hum easly social media share button blog me add kar sakate hai. Lekin jyada plugins ka use karne se wordpress blog ki loading speed slow hogi aur bandwidth bhi jyada spend hogi. Kyoki plugins se extra javascript aur https request add hoti hai, so website/blog loading speed ke liye better yahi rahega ki jyada plugins ka istemal na kare.


WordPress blog me social media share button without plugin ke add kaise kare?

Apne wordpress blog ka dashboard open kare. Ab menu me appearance >> editor me jaha blog ki core files hoti hai waha par functions.php folder ko open Karna hai aur niche diya gaya code is folder me add karna hai. Aap hosting cpanel me public_html >> wp-content >> themes >> choose your theme me jakar bhi social share button ka code add kar sakate hai.


function my_share_btn($content)
{
global $post;
if(is_single())
{
// Get the post's URL that will be shared
$permalink=urlencode(get_the_permalink());
// Get the post's title
$title=str_replace(' ', '%20', get_the_title());
// Compose the share links for Facebook, Twitter, Google+ and Whatsapp
$tw = 'https://twitter.com/intent/tweet?text='.$title.'&url='.$permalink.'&via=solutionsoul';
$fb = 'https://www.facebook.com/sharer/sharer.php?u='.$permalink;
$gp = 'https://plus.google.com/share?url='.$permalink;
$wp = 'whatsapp://send?text=*'.$title.'*'.$permalink; 

$content.='<div class="social-box">';
$content.='<div class="sb-title"> <i class="fa fa-share-alt" aria-hidden="true"></i> Share this Post </div>';
$content.='<div class="fb sb-icon"> <a href="'.$fb.'" target="_blank" title="Share this post on Facebook"> <i class="fa fa-facebook" aria-hidden="true"></i> </a> </div>';
$content.='<div class="tw sb-icon"> <a href="'.$tw.'" target="_blank" title="Share this post on Twitter"> <i class="fa fa-twitter" aria-hidden="true"></i> </a> </div>';
$content.='<div class="gp sb-icon"> <a href="'.$gp.'" target="_blank" title="Share this post on Google Plus"> <i class="fa fa-google-plus" aria-hidden="true"></i> </a> </div>';
$content.='<div class="wp sb-icon"> <a href="'.$wp.'" target="_blank" title="Share this post on Whatsapp"> <i class="fa fa-whatsapp" aria-hidden="true"></i> </a> </div>';
$content.='</div>';
return $content;
}
else
{
return $content;
}
}
add_filter( 'the_content', 'my_share_btn');
Code source: Gyanians.com


Ab aapke wordpress blog me social share button add ho chuke hai. Aap blog ke har post aur pages ke niche ise dekh sakate hai.

Now aapki site par social share button to add ho gaye hai, lekin abhi ise design karna baki hai. Iske liye aap css ka use kar sakate hai. Agar aapko CSS aati hai to aap apni requirement ke anusar social media share button ko design kar sakate hai. Hum niche ek css code de rahe hai jisse aap is button ko design kar sake.

WordPress website dashboard me Apearance >> Editor par ja kar style.css folder me niche diya gaya code copy karke paste karna hai.


.social-box {
margin-top:10px;
margin-bottom:10px;
}

.social-box .sb-title
{
font-weight:bold;
font-size:18px;
    margin-bottom:5px;
}

.social-box .sb-icon
{
background-color:green;
display:inline-block;
padding:8px 15px;
margin:3px;
border-radius:50%;
}

.social-box .sb-icon a
{
color:#fff;
}

.social-box .fb 
{
background-color:#3b5998;
}
.social-box .fb:hover 
{
background-color:#324b81;
}

.social-box .tw 
{
background-color:#55acee;
}
.social-box .tw:hover 
{
background-color:#178de8;
}

.social-box .gp
{
background-color:#dd4b39;
}
.social-box .gp:hover 
{
background-color:#ae2e1e;
}

.social-box .wp
{
background-color:#4dc247;
}
.social-box .wp:hover 
{
background-color:#3fac39;
}

Ab aap apni website/blog open karke dekh sakte hai ki social share button show ho rahe hai ya nahi. Post aur pages ke niche yah buttons show hoge. Agar aapko post ke pahle buttons ko show karna hai to niche diya gaya code ko uper diya first code se replace kare. Jaha aap is code ko badal de.


add_shortcode('social','my_share_btn');

Share plugins se accha manually code add karke social share button add karna better hota hai, kyoki social share button plugin me extra social share sites ki extra coding add hoti hai jiski koi jarurat nahi hoti jisse jyada script load hone se blog ki loading speed slow ho jati hai. Bahut jyada social share plugins use karne se kae bar hosting server unnecessary http requests add hoti hai.

Is post me Humne wordpress blog me social media share button without plugins ke add kaise kare? Is bare me jankari share ki hai. Like it? Share it!
Nitesh kumar
Nitesh kumar

Hello Friends! My Self Nitesh Kumar, From India Gujarat. I Am Passionate Blogger. I Am Author Of SolutionSoul Blog. In This Blog I'll Give U Information About New Technology, Various Technical Tricks, Mobile And Computer Tricks, Knowledge And News Etc.

4 comments: