Social buttons

Here is the code found here https://habrahabr.ru/post/156185/. As author of this article said – the code was written by unknown but in any case  very kind programmer.

HTML

<a onclick="Share.vkontakte('URL','TITLE','IMG_PATH','DESC')"> {share me}</a>
<a onclick="Share.facebook('URL','TITLE','IMG_PATH','DESC')"> {share me}</a>
<a onclick="Share.mailru('URL','TITLE','IMG_PATH','DESC')"> {share me}</a>
<a onclick="Share.odnoklassniki('URL','DESC')"> {share me}</a>
<a onclick="Share.twitter('URL','TITLE')"> {share me}</a>

JS

Share = {
	vkontakte: function(purl, ptitle, pimg, text) {
		url  = 'http://vkontakte.ru/share.php?';
		url += 'url='          + encodeURIComponent(purl);
		url += '&title='       + encodeURIComponent(ptitle);
		url += '&description=' + encodeURIComponent(text);
		url += '&image='       + encodeURIComponent(pimg);
		url += '&noparse=true';
		Share.popup(url);
	},
	odnoklassniki: function(purl, text) {
		url  = 'http://www.odnoklassniki.ru/dk?st.cmd=addShare&st.s=1';
		url += '&st.comments=' + encodeURIComponent(text);
		url += '&st._surl='    + encodeURIComponent(purl);
		Share.popup(url);
	},
	facebook: function(purl, ptitle, pimg, text) {
		url  = 'http://www.facebook.com/sharer.php?s=100';
		url += '&p[title]='     + encodeURIComponent(ptitle);
		url += '&p[summary]='   + encodeURIComponent(text);
		url += '&p[url]='       + encodeURIComponent(purl);
		url += '&p[images][0]=' + encodeURIComponent(pimg);
		Share.popup(url);
	},
	twitter: function(purl, ptitle) {
		url  = 'http://twitter.com/share?';
		url += 'text='      + encodeURIComponent(ptitle);
		url += '&url='      + encodeURIComponent(purl);
		url += '&counturl=' + encodeURIComponent(purl);
		Share.popup(url);
	},
	mailru: function(purl, ptitle, pimg, text) {
		url  = 'http://connect.mail.ru/share?';
		url += 'url='          + encodeURIComponent(purl);
		url += '&title='       + encodeURIComponent(ptitle);
		url += '&description=' + encodeURIComponent(text);
		url += '&imageurl='    + encodeURIComponent(pimg);
		Share.popup(url)
	},

	popup: function(url) {
		window.open(url,'','toolbar=0,status=0,width=626,height=436');
	}
};

Here is how to create buttons (partly from https://youtu.be/A6rx1AbQgRM?list=PLIjMj0-5C8TKR0tDqH52b2hfSBMwDIC2Q):

 _F9J_enqueue_style('cssmedia',  'https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css', array(), '4.5.0', 'all');

Next function returns an array of social buttons which we are going to show:

function supported_social_networks() {
    return array(
      'facebook'      => esc_html__('Facebook', 'text-domain'),
      'vk'            => esc_html__('Vkontakte', 'text-domain'),
      'odnoklassniki' => esc_html__('Odnoklassniki', 'text-domain'),
            );
        }

Send data and display social bottoms:

$output = '';
$social_networks = supported_social_networks();
foreach ($social_networks as $network => $value) {
    $output .= sprintf(
 '<span class="social-icons" ><a class = "social_network" href="#"  title = "%s" 
       data-network ="'.$network .'"    
       data-title ="'.get_the_title().'"  
       data-description ="'.get_post_meta($post->ID, 'short', true).'"  
       data-image =  "'.$image[0].'"   
       data-url ="'.get_permalink().'" ><i class = "fa fa-%s"></i></a></span>',  esc_attr($value), esc_attr($network));
            }
 echo $output;
 $output = '';

Class ‘fa-%s’ corresponds with icon names: ‘facebook’, ‘vk’, etc…

And here is the script:

  $('.social_network').click(function (e) {
                        var target = $(event.target).parent();

                        var network = target.data('network');
                        var url = target.data('url');
                        var title = target.data('title');
                        var img = target.data('image');
                        var desc = target.data('description');

                        switch (network) {
                            case 'facebook':
                                Share.facebook(url, title, img, desc);
                                break;
                            case 'vk':
                                Share.vkontakte(url, title, img, desc);
                                break;
                            case  'odnoklassniki':
                                Share.odnoklassniki(url, desc);
                                break;
                        }

                    });