Social Icons

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":

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.

Navigation menu

Follow the Menu Social Icons tutorial in the Feast Layouts to add this to the Modern Menu.