Adding Social Icons to Blocksy

I wanted to include a social media icon for the Blocksy Theme Customizer. I contacted the theme creators to request Messenger as one of the available social icons, and they had already implemented a New Filter for that purpose the previous day (it was almost as if they anticipated my arrival).

The original code is below with my code adjustment under that to add a Facebook Messenger icon to the social list in the customizer.

I also had to adjust the width and height as having them set at 20px, hid some of the icon. 24px works well though.

The Original Code

add_filter('blocksy:social-box:dynamic-social-networks', function ($networks) {
	$networks[] = [
		'id' => 'clubhouse',
		'name' => __('Clubhouse', 'blocksy'),
		'icon' => ' <svg
		  width="20px"
		  height="20px"
		  viewBox="0 0 20 20">
			<path d="M20,10.1c0-5.5-4.5-10-10-10S0,4.5,0,10.1c0,5,3.7,9.1,8.4,9.9v-7H5.9v-2.9h2.5V7.9C8.4,5.4,9.9,4,12.2,4c1.1,0,2.2,0.2,2.2,0.2v2.5h-1.3c-1.2,0-1.6,0.8-1.6,1.6v1.9h2.8L13.9,13h-2.3v7C16.3,19.2,20,15.1,20,10.1z"/>
		</svg>',
	];

	return $networks;
});

FB Messenger Code

add_filter('blocksy:social-box:dynamic-social-networks', function ($networks) {
	$networks[] = [
		'id' => 'fb_messenger',
		'name' => __('FB Messenger', 'blocksy'),
		'icon' => ' <svg
		  width="24px"
		  height="24px"
		  viewBox="0 0 24 24">
			<path d="M.001 11.639C.001 4.949 5.241 0 12.001 0S24 4.95 24 11.639c0 6.689-5.24 11.638-12 11.638c-1.21 0-2.38-.16-3.47-.46a.96.96 0 0 0-.64.05l-2.39 1.05a.96.96 0 0 1-1.35-.85l-.07-2.14a.97.97 0 0 0-.32-.68A11.39 11.389 0 0 1 .002 11.64zm8.32-2.19l-3.52 5.6c-.35.53.32 1.139.82.75l3.79-2.87c.26-.2.6-.2.87 0l2.8 2.1c.84.63 2.04.4 2.6-.48l3.52-5.6c.35-.53-.32-1.13-.82-.75l-3.79 2.87c-.25.2-.6.2-.86 0l-2.8-2.1a1.8 1.8 0 0 0-2.61.48z"/>
		</svg>',
	];

	return $networks;
});

To activate this feature, copy and paste this code into the functions.php file of your theme..