functions - Adding custom social icons to the social media icon block in the Gutenberg editor?

admin管理员组

文章数量:1134578

In wp-includes/blocks/social-link.php there is a function which seems to setup all the selectable icons in an array together with their names and their SVG code (lookie here on GitHub)

Is there a way I can add my own custom social links to this block (e. g. XING, which is currently missing) by adding a function to my theme's functions.php file?

I tried using add_action to add to the $services_data array without success. The added icon did not appear in the block options.

In wp-includes/blocks/social-link.php there is a function which seems to setup all the selectable icons in an array together with their names and their SVG code (lookie here on GitHub)

Is there a way I can add my own custom social links to this block (e. g. XING, which is currently missing) by adding a function to my theme's functions.php file?

I tried using add_action to add to the $services_data array without success. The added icon did not appear in the block options.

• functions
• filters
• block-editor

Share Improve this question asked Sep 20, 2021 at 12:33 cinquecentooocinquecentooo 4111 bronze badge 5

• I see no filters to modify that array in that file, have you raised a trac ticket to add one? – Tom J Nowell ♦ Commented Sep 20, 2021 at 14:35
• So it is not possible, right? I did not raise a trac ticket yet. – cinquecentooo Commented Sep 21, 2021 at 5:54
• 1 I can't be sure or I'd write an answer instead of a comment. You definitely should raise a trac ticket and get this officially supported, either that or a github issue on the gutenberg repo – Tom J Nowell ♦ Commented Sep 21, 2021 at 9:54
• here it is in gutenberg github.com/WordPress/gutenberg/blob/… – Tom J Nowell ♦ Commented Sep 21, 2021 at 9:55
• here's a GH issue someone else raised: github.com/WordPress/gutenberg/issues/34613 and here's a PR attempting to add a filter: github.com/WordPress/gutenberg/pull/30749 it looks like the main issue is React Native compatibility – Tom J Nowell ♦ Commented Sep 21, 2021 at 9:57

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 1

Just in case anyone is looking for this;

1. Use the Link icon and add a unique style to the link

2. add custom styles below for eventbrite as an example

   .eventbrite{ background-image:url('eventbrite.png'); background-size:cover; } .eventbrite svg{ opacity:0; }

本文标签： functionsAdding custom social icons to the social media icon block in the Gutenberg editor