User Profile Block

The HTML-based user profile widget has long been a staple of the sidebar, giving your visitors information about who you are and demonstrating E-A-T.

Note: we haven't recommended using the Gravatar user-profile widget in years due to pagespeed issues.

As more parts of WordPress move towards blocks, having a user profile block will become key.

Here's the full setup video:

The user profile block will be usable in the Modern Sidebar, due out later in 2020.

Jump to:

• Creating the block
• Live example
• Long term maintainability
• Modern sidebar

Creating the block

The user profile block uses the WordPress-core "Media & Text" block with some custom styling. The custom styling comes from the "feast-about-author" class that gets added to the Advanced section of the block settings.

Simply copy the following, and paste it directly into the block editor:

<!-- wp:media-text {"mediaId":1835,"mediaLink":"https://foodiepro.com/feast-skylar-headshot/","mediaType":"image","className":"feast-about-author"} -->
<div class="wp-block-media-text alignwide is-stacked-on-mobile feast-about-author"><figure class="wp-block-media-text__media"><img src="https://foodiepro.com/wp-content/uploads/2020/03/feast-skylar-headshot.jpg" alt="" data-pin-nopin="true" class="wp-image-1835"/></figure><div class="wp-block-media-text__content"><!-- wp:heading -->
<h2>About Skylar, NRD</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>This is a fake profile talking about how I switched to a paleo diet and it helped my eczema and I grew 4". Trust me, I'm an online doctor.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph {"align":"right"} -->
<p class="has-text-align-right"><a href="https://foodiepro.com/about"><strong>Learn more about me →</strong></a></p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:media-text -->

You want to change the image to a 1000x1000 (or at least square) image, and edit the text directly in the new block. Remember to edit the alt text for the image.

Live example

Here's what it looks like:

Long term maintainability

WordPress has a habit of making unpredictable changes to core blocks, and there's a possibility they'll change how this functions in the future.

If that happens, we'll release either an update, or if needed, a new custom block.

Modern sidebar

Do not follow this tutorial for inserting the user profile into the Modern Sidebar, instead, follow the Modern Sidebar tutorial to create it with 1-click.