Social links – core/social-links

Display icons linking to your social media profiles or websites.

Use the Social links block to create a block of links to your social media or external sites.

Screenshot

Example

  • To add a social link variation click on the Add block icon.
  • The block inserter will show the first 6 of the block’s variations.
  • To find more search by typing a letter.
  • If you use the Browse all link this will display the main block inserter.
  • You probably won’t be able to find the block you’re looking for because it’s not listed.
  • I raised an issue. wordpress/gutenberg#25474.

Notes

  • The Social links blocks contains one or more Social Icon – core/social-link blocks.
  • Gutenberg 6.5.0 delivered 32 new blocks – Social links.
  • Gutenberg 7.2.0 delivered 39 social link blocks.
  • Once you’ve inserted the Social links block you’ve got 38 choices for the blocks to include.
  • The default blocks are: WordPress, Facebook, Twitter, Instagram, LinkedIn and YouTube.
  • Each block requires the full URL to the social network. E.g. https://twitter.com/herb_miller.
  • Each block has a Link Label setting to Briefly describe the link to help screen reader users.
  • You can’t tell from the icon whose social network you’ll visit… You have to see the URL in the link.
  • If you don’t complete the URL for a block then the block may not display.
  • Blocks can be styled as: Default, Logos Only, Pill shape.
  • Each of the social link blocks can also be inserted individually, but they cannot be styled when you do this.
  • Change alignmentUse Change alignment to choose the alignment
    • Align leftAlign to the left
    • Align centerAlign in the center
    • Align rightAlign to the right
    • Wide widthIncrease the width of the block beyond the content size. Requires theme support.
    • Full widthExtend the block to cover the full width of the screen. Requires theme support.
  • More optionsDisplay more options
    • Show More SettingsShow the block settings in the sidebar.
    • CopyCopy the block to the clipboard.
    • DuplicateUse Duplicate to create a copy of the block.
    • Insert AfterInsert a new block after the selected block(s).
    • Insert BeforeInsert a new block before the selected block(s).
    • Move To Use Move To to move a block. Up/Down or Left/Right
    • Edit as HTMLEdit the HTML of the block.
    • GroupTransform the selected block(s) into a group.
    • Add to Reusable blocksCreate a Reusable block.
    • Remove blockDelete the block.

Social Icons transforms to:

  • Columns
  • Group

Social link blocks in Gutenberg 7.5.0

In version 7.5.0 the social link block was changed to a single block with 38 variations.

WordPress – wordpress
Display an icon linking to a social media profile or website.
500px – fivehundredpx
Display an icon linking to a social media profile or website.
Amazon – amazon
Display an icon linking to a social media profile or website.
Bandcamp – bandcamp
Display an icon linking to a social media profile or website.
Behance – behance
Display an icon linking to a social media profile or website.
Link – chain
Display an icon linking to a social media profile or website.
CodePen – codepen
Display an icon linking to a social media profile or website.
DeviantArt – deviantart
Display an icon linking to a social media profile or website.
Dribbble – dribbble
Display an icon linking to a social media profile or website.
Dropbox – dropbox
Display an icon linking to a social media profile or website.
Etsy – etsy
Display an icon linking to a social media profile or website.
Facebook – facebook
Display an icon linking to a social media profile or website.
RSS Feed – feed
Display an icon linking to a social media profile or website.
Flickr – flickr
Display an icon linking to a social media profile or website.
Foursquare – foursquare
Display an icon linking to a social media profile or website.
Goodreads – goodreads
Display an icon linking to a social media profile or website.
Google – google
Display an icon linking to a social media profile or website.
GitHub – github
Display an icon linking to a social media profile or website.
Instagram – instagram
Display an icon linking to a social media profile or website.
Last.fm – lastfm
Display an icon linking to a social media profile or website.
LinkedIn – linkedin
Display an icon linking to a social media profile or website.
Mail – mail
Display an icon linking to a social media profile or website.
Mastodon – mastodon
Display an icon linking to a social media profile or website.
Meetup – meetup
Display an icon linking to a social media profile or website.
Medium – medium
Display an icon linking to a social media profile or website.
Patreon – patreon
Display an icon linking to a social media profile or website.
Pinterest – pinterest
Display an icon linking to a social media profile or website.
Pocket – pocket
Display an icon linking to a social media profile or website.
Reddit – reddit
Display an icon linking to a social media profile or website.
Skype – skype
Display an icon linking to a social media profile or website.
Snapchat – snapchat
Display an icon linking to a social media profile or website.
SoundCloud – soundcloud
Display an icon linking to a social media profile or website.
Spotify – spotify
Display an icon linking to a social media profile or website.
Telegram – telegram
Display an icon linking to a social media profile or website.
TikTok – tiktok
Display an icon linking to a social media profile or website.
Tumblr – tumblr
Display an icon linking to a social media profile or website.
Twitch – twitch
Display an icon linking to a social media profile or website.
Twitter – twitter
Display an icon linking to a social media profile or website.
Vimeo – vimeo
Display an icon linking to a social media profile or website.
VK – vk
Display an icon linking to a social media profile or website.
Yelp – yelp
Display an icon linking to a social media profile or website.
YouTube – youtube
Display an icon linking to a social media profile or website.

Social link blocks in Gutenberg 7.2.0

  1. 500px – core/social-link-fivehundredpx
  2. Amazon – core/social-link-amazon
  3. Bandcamp – core/social-link-bandcamp
  4. Behance – core/social-link-behance
  5. CodePen – core/social-link-codepen
  6. DeviantArt – core/social-link-deviantart
  7. Dribbble – core/social-link-dribbble
  8. Dropbox – core/social-link-dropbox
  9. Etsy – core/social-link-etsy
  10. Flickr – core/social-link-flickr
  11. Foursquare – core/social-link-foursquare
  12. GitHub – core/social-link-github
  13. Goodreads – core/social-link-goodreads
  14. Google – core/social-link-google
  15. Instagram – core/social-link-instagram
  16. Last.fm – core/social-link-lastfm
  17. Link – core/social-link-chain
  18. LinkedIn – core/social-link-linkedin
  19. Mail – core/social-link-mail
  20. Mastodon – core/social-link-mastodon
  21. Medium – core/social-link-medium
  22. Meetup – core/social-link-meetup
  23. Pinterest – core/social-link-pinterest
  24. Pocket – core/social-link-pocket
  25. Reddit – core/social-link-reddit
  26. RSS Feed – core/social-link-feed
  27. Skype – core/social-link-skype
  28. Snapchat – core/social-link-snapchat
  29. SoundCloud – core/social-link-soundcloud
  30. Spotify – core/social-link-spotify
  31. Tumblr – core/social-link-tumblr
  32. Twitch – core/social-link-twitch
  33. Twitter – core/social-link-twitter
  34. Vimeo – core/social-link-vimeo
  35. VK – core/social-link-vk
  36. WordPress – core/social-link-wordpress
  37. Yelp – core/social-link-yelp
  38. YouTube – core/social-link-youtube