Blog · Gutenberg
Social Share block for WordPress
Social sharing buttons for any page or post.
Get Blockenberg
Free Gutenberg block in Blockenberg. The inspector controls and front-end behavior on this page come from this block’s source, not a shared stub.
What it actually does
Social sharing buttons for any page or post.
Inspector panels on this block: Networks, Custom Colors, Label. Those titles come from index.js, not from a shared template.
Behavior controls: “Button Style” options: Icon only, Icon + Text, Pill (icon+text); “Style — Alignment” options: Left, Center, Right.
Where to find it
Gutenberg inserter → Blog → search “Social Share” (block name `blockenberg/social-share` in block.json). Style it in the sidebar after insert.
How to use Social Share block for WordPress
- Install Blockenberg. Install from WordPress.org and activate the plugin.
- Insert the block. Edit a page, click +, search for “Social Share”, insert it. Category: Blog.
- Configure inspector controls that exist on this block. Open Networks. Set “Button Style”, “Style — Alignment”, “Button Size”, “Style — Gap”.
- Check the published page. The view script reads HTML data attributes: data-networks. The block editor preview may not run the same view script.
Inspector controls from this block’s code
| Control | What the code does |
|---|---|
| Button Style | Select control; the chosen value is saved on the block. Options: Icon only; Icon + Text; Pill (icon+text). |
| Style — Alignment | Select control; the chosen value is saved on the block. Options: Left; Center; Right. |
| Button Size | Numeric range control in the inspector. Range 24–64. |
| Style — Gap | Numeric range control in the inspector. Range 0–32. |
| Border Radius | Numeric range control in the inspector. Range 0–50. |
| Font Size | Numeric range control in the inspector. Range 10–20. |
| Use brand colors | On/off toggle in the inspector. |
| Custom Colors — Background | Color control in the inspector. |
| Icon Color | Color control in the inspector. |
| Label Color | Color control in the inspector. |
| Show label | On/off toggle in the inspector. |
| Label text | Text field in the inspector. |
What the front-end script actually does
- The view script reads HTML data attributes: data-networks.
When this is the right block
- Social sharing buttons for any page or post — that is the job of Social Share, not a generic content block.
- Use it when you need the editor control labeled “Button Style”, which exists on this block’s inspector.
- It matches pages about share, social, twitter.
- Inserter grouping: posts, magazines, and editorial WordPress pages.
Notes from the implementation
viewScript: this folder’s frontend.js is enqueued on the front end for this block.
FAQ
How do I add the Social Share block in WordPress?
Install Blockenberg from WordPress.org, edit a page in the block editor, click +, and search for “Social Share”. It sits under Blog. After insert, open Networks and set “Button Style”, “Style — Alignment”, “Button Size”, “Style — Gap”.
What makes Social Share different from other Blockenberg blocks?
Social sharing buttons for any page or post. Inspector labels on this block include “Button Style”, “Style — Alignment”, “Button Size”, “Style — Gap”.
Is the Social Share Gutenberg block free?
Yes. Social Share ships inside Blockenberg. Get the plugin from WordPress.org — no paid add-on is required for this block.
Can I style Social Share to match my theme?
Yes. Blockenberg’s shared typography and color panels apply here, plus any block-specific style controls listed on this page (panels: Networks, Custom Colors, Label).
Related blog blocks
Article Header
Rich editorial-style article/blog post header with category badge, headline, subheadline, author meta bar, and optional hero image.
Article Series
Multi-part series navigator showing all articles with the current one highlighted and progress indicator.
Book Review
Rich book review block with cover image, star rating, details grid, pros & cons, and Schema.org Book + Review structured data for SEO.
Book Shelf
A visual reading list with a realistic bookshelf view, cards layout, or list — complete with ratings, reading status, and genre tags.
Category Grid
Display WordPress post categories in a responsive grid with post counts, icons, descriptions, and rich styling options.
Changelog
Versioned release-notes block with colour-coded categories (New, Improved, Fixed, Deprecated). Perfect for SaaS product pages.
Get Blockenberg
Install Blockenberg from WordPress.org, then insert Social Share from the Gutenberg inserter.