Social Networks for User Profile Picture

Social Networks for User Profile Image banner

The Social Networks for User Profile Picture plugin allows users to add, edit and display their social networks. It requires using the User Profile Picture plugin.

Comes with a Gutenberg block and a template tag for outputting your social networks.

Download User Profile Picture Social Networks

Social Networks for User Profile Picture overview video

Template Tag Usage

You can use the following template tag for outputting your social networks:

global $post;
$social_networks = uppe_get_social_networks( $post->post_author, 'raw' );
 
if ( $social_networks && ! empty( $social_networks ) ) {
    echo '<div class="icons" style="text-align: center;">';
    echo '<style>';
    echo '.fab:before, .fas:before { color: #FF0000; }';
    echo '</style>';
    foreach( $social_networks as $social_network ) {
        echo sprintf(
            '<span style="display: inline-block; margin-right: 10px; font-size: 48px;"><a href="%s" title="%s"><i class="%s"></i></a></span>',
            esc_url( $social_network->url ),
            esc_html( $social_network->label ), 
            esc_html( $social_network->icon )
        );
    }
    echo '</div>';
 
}

Adding Social Networks

If you’re looking to add a new social network, you can do it using the following filter:

add_filter( 'user_profile_picture_social_networks', function( $social_networks  ) {
        $social_networks[] = array(
            'new_social_network' => array(
                'label' => 'Your Social Network',
                'fa'    => 'fab fa-social-network',
            ),
        )
    }
);