Nilo Velez

Social Share Block adds a customizable row of social sharing buttons to any post, page, or site editor template. Each button links directly to the corresponding network’s share dialog using the canonical URL of the current page.
Features:
<ul>
<li>Toggle each social network on or off: Facebook, X (Twitter), LinkedIn, WhatsApp, and Pinterest.</li>
<li>Inline SVG icons for crisp rendering at any size — no external icon fonts required.</li>
<li>Adjustable icon size (16–64 px) and button spacing (0–40 px) via the block inspector.</li>
<li>Automatic canonical URL detection: uses Yoast SEO or Rank Math canonical meta when available, falling back to the WordPress permalink.</li>
<li>All share links open in a new window with <code>rel="nofollow noopener noreferrer"</code> for security.</li>
<li>Works everywhere: posts, pages, and Full Site Editor templates or template parts.</li>
<li>Live preview in the editor so you see exactly what visitors will see.</li>
</ul>

Machete Social Share Block

A beautiful social share block that lets visitors share your content on Facebook, X (Twitter), LinkedIn, WhatsApp, and Pinterest.

kubiq

Easily use <code>[better_share_buttons]</code> shortcode anywhere you want. 
Create your own styles, or choose from existing ones. 
This plugin is optimized for fastest websites – it will not load any JS files and it will load CSS file only when it is needed.
This plugin allows you to:
<ul>
<li>create multiple social share icon styles</li>
<li>use shortcode to display share icons anywhere you want</li>
<li>create your own styles in your theme folder</li>
<li>customize basic settings directly in admin</li>
<li>use different icons for social networks</li>
</ul>
<h3>Hooks</h3>
customize wrapper classes
<pre><code>add_filter( 'share_buttons_classes', function( $classes, $share_buttons_settings, $share_buttons_id ){
 $classes[] = 'my-custom-class';
 return $classes;
}, 10, 3 );
</code></pre>
 
customize wrapper CSS output
<pre><code>add_filter( 'share_buttons_styles', function( $style, $share_buttons_settings, $share_buttons_id ){
 $style[] = '--my-var: 50px';
 return $style;
}, 10, 3 );
</code></pre>
 
customize html form more button
<pre><code>add_filter( 'better_share_buttons_more', function( $html, $share_buttons_settings, $share_buttons_id ){
 // replace SVG icon path with a custom one
 $html = str_replace( 'M18 14V8h-4v6H8v4h6v6h4v-6h6v-4h-6z', 'M18.2 4.2C18.2 3 17.2 2 16 2s-2.2 1-2.2 2.2v9.7H4.2C3 13.8 2 14.8 2 16s1 2.2 2.2 2.2h9.7v9.7c0 1.2 1 2.2 2.2 2.2s2.2-1 2.2-2.2v-9.7H28c1.2 0 2.2-1 2.2-2.2s-1-2.2-2.2-2.2h-9.7V4.2z', $html );
 return $html;
}, 10, 3 );
</code></pre>
 
add custom icon for any network
<pre><code>add_filter( 'share_buttons_icons', function( $icon, $slug, $share_buttons_settings, $share_buttons_id ){
 if( $slug == 'facebook' ){
 // add custom SVG path and you will be able to select it in admin
 $icon[] = 'M29.3 16c0-7.4-6-13.3-13.3-13.3C8.6 2.7 2.7 8.6 2.7 16c0 6.5 4.6 11.8 10.7 13.1V20h-2.7v-4h2.7v-3.3c0-2.6 2.1-4.7 4.7-4.7h3.3v4h-2.7c-.7 0-1.3.6-1.3 1.3V16h4v4h-4v9.3c6.7-.7 11.9-6.4 11.9-13.3z';
 }
 return $icon;
}, 10, 4 );
</code></pre>
 
control shared URL
<pre><code>add_filter( 'better_share_buttons_permalink', function( $url ){
 // ...
 return $url;
});
</code></pre>
 
control shared title
<pre><code>add_filter( 'better_share_buttons_title', function( $title ){
 // ...
 return $title;
});
</code></pre>
 
control HTML output for any network
<pre><code>add_filter( 'better_share_buttons_link', function( $html, $slug, $share_buttons_settings, $share_buttons_id ){
 if( $slug == 'facebook' ){
 $html = str_replace( 'https://facebook.com/sharer/sharer.php?', 'https://facebook.com/sharer/sharer.php?xxx=yyy&', $html );
 }
 return $html;
}, 10, 4 );
</code></pre>
 
add something before or after your share buttons
<pre><code>add_action( 'before_share_buttons', function( $share_buttons_settings, $atts ){ // or after_share_buttons
 if( $atts['id'] == 12345 ){
 echo '<div class="before-share-buttons">' . __( 'Sharing is caring', 'theme' ) . '</div>';
 }
}, 10, 2 );
</code></pre>
 
<h3>Create your own styles</h3>
Create new folder <code>better-share-buttons</code> inside your theme folder and put iniside style files <code>xyz.css</code> and <code>xyz.json</code>.
Style <code>xyz</code> will automatically appear in the admin settings.
Content of JSON file is used to manipulate settings in admin when you select that style:
<pre><code>{
 "visible_buttons": 999,
 "bsb_mx": 0,
 "bsb_my": 0,
 "bsb_px": 5,
 "bsb_py": 5,
 "bsb_br": 0,
 "bsb_fz": 0,
 "bsb_iz": 32,
 "bsb_lls": 0,
 "bsb_lrs": 0
}
</code></pre>
Content of CSS file should define your style:
<pre><code>.better_share_buttons.bsb-style-xyz{}
</code></pre>

Better Share Buttons

Easily use [better_share_buttons] shortcode anywhere you want.

Machete Social Share Block vs Better Share Buttons