How to Add ALT Text to Gravatar Images in GeneratePress?

In this tutorial, we are going to learn to add ALT text to Gravatar images in GeneratePress theme with a simple code snippets plugin.

Are you facing issues with accessibility on your WordPress website due to missing ALT text for Gravatar images?

Well, you’re not alone. Many WordPress themes, including GeneratePress, don’t provide an easy way to add ALT text to Gravatar images by default.

However, with a few lines of code, we can solve this problem and make our website more accessible to everyone. In this article, you’ll learn:

  • The importance of ALT text for images
  • How to add ALT text to Gravatar images in GeneratePress
  • Customizing the ALT text for Gravatar images

Let’s get started!

How to Add ALT Text to Gravatar Images in GeneratePress?

When you add an author bio with gravatar in GP Theme you may find missing alt text by default in the author images. By default, GeneratePress doesn’t provide an easy way to add ALT text to Gravatar images. However, with a simple code snippet, we can achieve this functionality.

Add ALT Text to Gravatar Images in GeneratePress

Step 1: Install the Code Snippets plugin

  • Log in to your WordPress dashboard
  • Navigate to Plugins > Add New
  • Search for “Code Snippets
  • Click “Install Now” and then “Activate”

Step 2: Add a new code snippet

Adding ALT Text to Gravatar Images in GeneratePress via Code Snippets Plugin
  • Go to Snippets > Add New
  • Give your snippet a descriptive name (e.g., “Add ALT Text to Gravatar Images in GeneratePress”)
  • Paste the following code into the “Code” section
  • Click “Activate” to save your changes
function wplogout_add_alt_to_gravatar($text) {
    $alt = get_the_author_meta( 'display_name' );
    $text = str_replace('alt=\'\'', 'alt=\''.$alt.'\' title=\'Gravatar for '.$alt.'\'',$text);
    return $text;
}
add_filter('get_avatar','wplogout_add_alt_to_gravatar');

Step 3: Customize the ALT text (optional)

The code snippet above uses the author’s display name as the ALT text for their Gravatar image. However, you can modify the code to use a different text or even add additional information.

For example, to include additional ALT text, you can modify the $text variable as follows:

$text = str_replace('alt=\'\'', 'alt=\'Add Something here '.$alt.'\' title=\'Gravatar for '.$alt.'\'',$text);

Congratulations! Using the Code Snippets plugin, you’ve successfully added ALT text to Gravatar images in your GeneratePress theme.

Check Out:

At the End

Adding ALT text to images is crucial in making your website more accessible and inclusive.

Following the steps outlined in this tutorial, you can easily add ALT text to Gravatar images in your GeneratePress theme using the Code Snippets plugin.

It improves the user experience for visually impaired visitors and optimizes your website for better search engine visibility.

Share:

I am obsessed with WordPress and write articles about WordPress Speed Optimization, SEO, and Blogging. I mostly publish tutorials on GeneratePress, Astra, Kadence, and GenerateBlocks.

Leave a Comment