The Feast Social Icons is a replacement for the Simple Social Icons widget, fixing long-standing duplicate ID accessibility issues in the Simple Social Icons plugin and
We opted to develop the social icons block internally instead of relying on the WordPress social icons block, because WordPress has a very nasty habit of updating and breaking their blocks.
This can be accessed in the block editor by clicking [+] > Search > "feast social":
Jump to:
Setting up
You'll head to Admin > Feast Plugin > Site Info:
Then fill in the social fields:
Feast+
With Feast+, the Feast Social Icons are automatically given the branded background color that you set.
This can still be overridden on a per-block basis using the options below.
Color
The default color is grey, however, the color can be changed on a block-by-block basis using the block sidebar settings:
Order
You can change order of the icons by using the "Order" field on the block:
The "Order" field can also be used to display only certain social platforms if needed:
Radius
Changing the "Radius" to 0px will give the icons a square corner. A default of 50% is used to create circles.
Size
The "Size" setting can change the size of the icon. The default is 36px for the icons, with 12px of padding around all sizes to create a 50px minimum which is required for minimum-tap-size requirements on mobile:
We don't recommend using an icon size below 36px.
Where is it used
The Feast Social Icons can be used on your:
- about page
- contact page
- footer
- menu
We'd generally advise against it going in the sidebar because you want to keep the sidebar short to maximize the sidebar ad revenue.
There's also no purpose in putting them into the post content because they're already found in the menu and maybe the footer.
DOM nodes
Unnecessarily adding social icons which provide no benefit, link to external sites, add excessive DOM nodes which slows pagespeed.
Adding too many social icons is not a user-first experience. We strongly recommend against using it in post content and restrict it to just the menu, and maybe the footer if you feel it's necessary.
Alignment
When you select the Feast Social Icons block, an align option is available on the block controls:
This will allow you to align them center (the default), left, or right.
New window
External links are automatically opened in new windows, per standard web practices.
The reason for this is that you earn income when a user is on your website, not on a third party website, and sending someone away from your website to a third party website goes against your best interests.
So instead of sending them away (ie. same window navigation), we open a new window so that they can achieve their goal on the social platform and still have access to your site in the original window.
There are accessibility arguments for and against using the same window vs. a new window and you're free to choose the behavior that you want.
Our stance is unconditionally that external links should open in new windows.
Navigation menu
Follow the Menu Social Icons tutorial in the Feast Layouts to add this to the Modern Menu.
Translation
If you run WPML, you'll need to enable translations on the Feast Layouts custom post type.
Multiple profiles
Unfortunately it's not possible to link to multiple social media profiles within the Social Icons block.
Our recommendation is to link to your largest social media profile, and link to the other language profiles from your main profile.