Social Sharing Buttons within Loop for Elementor Custom Skin
Hojt Communication is a consulting company focused on our clients need to rapidly bring the right product to the right market. We stand out due to our ability to combine skills in strategy, implementation, operations and technology with deep understanding about the connected world and the new levels of security and privacy protection that world brings.
vision,strategy,product,market,business development,marketing,mobility,Internet of Things,IoT,Security
23460
post-template-default,single,single-post,postid-23460,single-format-standard,stockholm-core-1.2.1,select-child-theme-ver-1.0.0,select-theme-ver-5.2.1,ajax_fade,page_not_loaded,wpb-js-composer js-comp-ver-6.1,vc_responsive

Social Sharing Buttons within Loop for Elementor Custom Skin

This is a post with my code that solves social sharing buttons within a loop using elementor custom skin:

https://wordpress.org/support/topic/social-sharing-buttons-within-loop/

// Function to add social sharing icons
// social links hard coded

function get_the_post_thumbnail_src($img)
{
  return (preg_match('~\bsrc="([^"]++)"~', $img, $matches)) ? $matches[1] : '';
}

function sense_social_buttons($atts, $content) {        
        $a = shortcode_atts( array(
            'posttype' => 'NULL',
        ), $atts );

        $size = "30";

        $posttype = "post";
        if($a['posttype'] != 'NULL'){
          $posttype = $a['posttype'];
        }

        // Get current page URL
        $sb_url = urlencode(get_permalink());

        // Get current page title
        $sb_title = str_replace( ' ', '%20', get_the_title());
        $sb_title = str_replace( '|', '-', get_the_title());

        // Get Post Thumbnail for pinterest
        $sb_thumb = get_the_post_thumbnail_src(get_the_post_thumbnail());

        // Construct sharing URL without using any script
        $twitterURL = 'https://twitter.com/intent/tweet?text='.$sb_title.'&url='.$sb_url.'&via=XXXXXXXXXX';
        $facebookURL = 'https://www.facebook.com/sharer/sharer.php?u='.$sb_url;
        $bufferURL = 'https://bufferapp.com/add?url='.$sb_url.'&text='.$sb_title;
        $whatsappURL = 'whatsapp://send?text='.$sb_title . ' - ' . $sb_url;
        $linkedInURL = 'https://www.linkedin.com/shareArticle?mini=true&url='.$sb_url.'&title='.$sb_title;

       if(!empty($sb_thumb)) {
            $pinterestURL = 'https://pinterest.com/pin/create/button/?url='.$sb_url.'&media='.$sb_thumb[0].'&description='.$sb_title;
        }
        else {
            $pinterestURL = 'https://pinterest.com/pin/create/button/?url='.$sb_url.'&description='.$sb_title;
        }

        $pinterestURL = 'https://pinterest.com/pin/create/button/?url='.$sb_url.'&media='.$sb_thumb[0].'&description='.$sb_title;

        // Add sharing button at the end of page/page content
        $content .= '<div class="social-box"><div class="social-btn">';
        $content .= '<a class="sbtn" href="'. $twitterURL .'" target="_blank" onclick="window.open(&#39;'. $twitterURL .'&#39;, &#39;newwindow&#39;,&#39;width=800,height=200&#39;);return false;" rel="nofollow" alt="share XXXXXXXXXX'.$posttype.'" title="Tweet Sensative '.$posttype.'"><img width="'.$size.'" height="'.$size.'" src="https://XXXXXXXXXX.com/wp-content/uploads/2019/04/social-twitter.svg"></a>';

        $content .= '<a class="sbtn" href="'.$facebookURL.'" target="_blank" onclick="window.open(&#39;'. $facebookURL .'&#39;, &#39;newwindow&#39;,&#39;width=560,height=620&#39;);return false;" rel="nofollow" alt="share XXXXXXXXXX'.$posttype.'" title="Share Sensative '.$posttype.' on Facebook"><img width="'.$size.'" height="'.$size.'" src="https://XXXXXXXXXX.com/wp-content/uploads/2019/04/social-facebook.svg"></a>';

//        $content .= '<a class="sbtn" href="'.$whatsappURL.'" data-action="share/whatsapp/share" target="_blank" rel="nofollow" alt="share sensative '.$posttype.'" title="Share Sensative '.$posttype.' on WhatsApp"><img width="'.$size.'" height="'.$size.'" src="https://XXXXXXXXXX.com/wp-content/uploads/2019/04/social-whatsapp.svg"></a>';

        $content .= '<a class="sbtn" href="'.$pinterestURL.'" data-pin-custom="true" onclick="window.open(&#39;'. $pinterestURL .'&#39;, &#39;newwindow&#39;,&#39;width=800,height=70&#39;);return false;" target="_blank" rel="nofollow" alt="pin sensative '.$posttype.'" title="Pin XXXXXXXXXX'.$posttype.' on Pinterest"><img width="'.$size.'" height="'.$size.'" src="https://XXXXXXXXXX.com/wp-content/uploads/2019/04/social-pinterest.svg"></a>';

        $content .= '<a class="sbtn" href="'.$linkedInURL.'" target="_blank" onclick="window.open(&#39;'. $linkedInURL .'&#39;, &#39;newwindow&#39;,&#39;width=600,height=500&#39;);return false;" rel="nofollow" alt="share sensative '.$posttype.'" title="Share XXXXXXXXXX'.$posttype.' on LinkedIn"><img width="'.$size.'" height="'.$size.'" src="https://XXXXXXXXXX.com/wp-content/uploads/2019/04/social-linkedin.svg"></a>';

        $content .= '<a class="sbtn" href="'.$bufferURL.'" target="_blank" onclick="window.open(&#39;'. $bufferURL .'&#39;, &#39;newwindow&#39;,&#39;width=750,height=500&#39;);return false;" rel="nofollow" alt="share sensative '.$posttype.'" title="Share XXXXXXXXXX'.$posttype.' on Buffer"><img width="'.$size.'" height="'.$size.'" src="https://XXXXXXXXXX.com/wp-content/uploads/2019/04/social-buffer.svg"></a>';

        $content .= '</div></div>';

        return $content;

};

// Enable the_content if you want to automatically show social buttons below your post.
// add_filter( 'the_content', 'sense_social_buttons');

// This will create a wordpress shortcode [social].
// Place it in any widget and social buttons appear there.
// You will need to enabled shortcode execution in widgets.
add_shortcode('social','sense_social_buttons');


All links hardcoded and masked with XXXXXXXXXX 🙂 I then use the plugin 🙂   https://wordpress.org/plugins/ele-custom-skin/

where you can create custom post skins for using in loops.

I there add my shortcode [social posttype=”buzz”] where buzz is the post type that I created with

I hope this points you in the right direction