Blog

Recently I migrated my WordPress-based site to the free version of the great OceanWP theme.
While many social icons are already supported, Mastodon is currently not supported.

So I filed a feature request here: https://github.com/oceanwp/oceanwp/issues/433

The friendly guys from OceanWP the explained, how I could add a Mastodon link with icon today.
After fiddling around a bit, their solution worked well for me:

• Save your OceanWP customizer settings
• Create an OceanWP child theme (you can use the Ocean Extra plugin for that task)
• Import your saved customizer settings => Now your website should look the same as before
• Activate child theme
• The theme icons to “Font Awesome”
• Open the Appearence/Theme File Editor
• Add the following code to functions.php and save

function my_ocean_social_options( $array ) {
	// Mastodon icon
	$array['mastodon'] = array(
		'label' => 'Mastodon',
		'icon_class' => oceanwp_icon( 'mastodon', false)
	);

	return $array;

}
add_filter( 'ocean_social_options', 'my_ocean_social_options' );

function add_new_icons( $icons ) {
	$icons['mastodon']= array(
                'sili' => 'fab fa-mastodon',
                'fai'  => 'fab fa-mastodon',
                'svg'  => 'fab fa-mastodon',
            ); 

	return $icons;
}
add_filter( 'oceanwp_theme_icons', 'add_new_icons' );

Now, whenever you want to add a social link, you will find “Mastodon” at the end and you can add your Mastodon link.
Mine is https://mastodon.social/@kaitoedter and you can see a live version of this at https://toedter.com.