For any business, a strong social media presence helps reach and grow your audience faster. Social media icons on your website, linked to your profiles, allow visitors to follow you on each platform and stay updated.
With the Social Icon block from Nexter Blocks, you can add social media icons with custom links to any page or template in the WordPress block editor.
Best Used For:
- E-commerce and service businesses that need branded social profile links on landing pages and product pages
- Portfolios and agency sites that want social icons styled to match their visual identity without custom CSS
- Content creators and bloggers who want readers to follow them across multiple platforms from a single, prominent icon group
Required Setup
- Make sure the default WordPress Block editor is active.
- You need to have the Nexter Blocks plugin installed and activated.
- Make sure that the Social Icon block is activated, to verify this visit Nexter → Blocks → and Search for Social Icon and activate.
Learn via Video Tutorial
How to activate the Social Icon Block?
Go to
- Nexter → Blocks
- Search the block name and turn on the toggle.
Key Features
- Multiple Styles – Select from pre-designed Social Icon styles. Use this when you want a consistent icon appearance without custom CSS.
- Tooltip – Add a tooltip to any individual social icon. Use this when icons have no visible text label and you want visitors to identify each platform before clicking.
- Animation – Assign a hover animation to individual icons. Use this to add visual feedback that encourages visitors to interact with the icon group.
For a layout that pairs icons with text labels, see how to add an Icon List in WordPress using Nexter Blocks.
How to Use the Social Icon Block?
Add the Social Icon block to the page.
From the Style section, select a predefined style for the social icons.
From the Social Networks section, add the social media icons you want to display.
You will find three repeater items by default. Open one to configure it.
From the Social Network dropdown, select the social media platform for this icon.
In the Link field, add the URL for your social media profile or page.
In the Title field, add a label for this icon. The title appears as the tooltip text when the Tooltip toggle is enabled.
Set the icon color and background color for both normal and hover states for that icon.
Enable the Tooltip toggle to show a tooltip when visitors hover over that icon.
Configure each remaining icon the same way.
Click the + Add Network button to add more social icons to the group.
From the Alignment section, set the icon alignment for different screen sizes. To add social icons in a site header alongside a navigation menu, see how to add a navigation menu in WordPress using Nexter Blocks.
How to Style the Social Icon Block?
You will find all styling options in the Style tab.
General – Set the icon gap, size, height, width, and typography for all icons at once.
Tooltip Options – Set the tooltip trigger to hover or click, enable link interaction inside the tooltip, and adjust tooltip styling. Use this when you want to display a description or clickable link inside the tooltip rather than just a text label.
Advanced options are shared across all Nexter Blocks. Explore all options from the Advanced tab.
Also, see how to add icons in WordPress using Nexter Blocks for adding a single decorative icon to a page outside of a social media group.
