Creating a Custom User Profile Shortcode
Custom Code Solution
This solution creates a shortcode [user_profile]
that displays user information. Place this code in your theme's functions.php
file or in a site-specific plugin:
Register the shortcode and define the display function:
add_shortcode('user_profile', 'display_user_profile_shortcode');
function display_user_profile_shortcode($atts) {
// Parse shortcode attributes
$atts = shortcode_atts(array(
'user_id' => get_current_user_id(),
'show_avatar' => 'true',
'show_bio' => 'true',
'avatar_size' => 150
), $atts);
// Get user data
$user = get_userdata($atts['user_id']);
if (!$user) return 'User not found.';
// Start output buffering
ob_start();
echo '<div class="user-profile-container">';
if ($atts['show_avatar'] === 'true') {
echo get_avatar($user->ID, $atts['avatar_size']);
}
echo '<div class="user-info">';
echo '<h3>' . esc_html($user->display_name) . '</h3>';
if ($atts['show_bio'] === 'true' && $user->description) {
echo '<div class="user-bio">' . wp_kses_post($user->description) . '</div>';
}
echo '<p class="user-email">' . esc_html($user->user_email) . '</p>';
echo '</div></div>';
return ob_get_clean();
}
Add basic CSS styles for the profile display:
add_action('wp_head', 'add_user_profile_styles');
function add_user_profile_styles() {
?>
<style>
.user-profile-container {
max-width: 600px;
margin: 20px auto;
padding: 20px;
border: 1px solid #ddd;
}
.user-profile-container img {
display: block;
margin: 0 auto 15px;
border-radius: 50%;
}
.user-info {
text-align: center;
}
.user-bio {
margin: 15px 0;
}
</style>
<?php
}
Usage
Use the shortcode in posts or pages like this:
- Basic usage:
[user_profile]
- With parameters:
[user_profile user_id="2" show_avatar="true" show_bio="true" avatar_size="200"]
Parameters
-
user_id
: ID of the user to display (default: current user)
-
show_avatar
: Show/hide user avatar (true/false)
-
show_bio
: Show/hide user biography (true/false)
-
avatar_size
: Size of avatar in pixels (default: 150)
Plugin Alternative
If you prefer a plugin solution, consider:
These plugins offer additional features like frontend profile editing and custom fields.