Alt text not used from media library

Hi,

If i add an image from the media library in Pinegrow then the alt text that i added to the image in the media library is not being used on the front-end. Is this a bug? Would be nice if it uses the alt text added in the media library.

If i add the alt text to the image in Pinegrow then the image has an alt text on the front-end.

Thanks
Guido

I haven’t run into this issue with either blocks or themes. Is this happening on all your projects, or is there anything different about the one where you are seeing this issue? Also, remember that the alt text won’t take effect if you add it to the image through the media library after setting the image in the Gutenberg editor. You’d need to go back to your page and re-select your image with the alt text added to it. It’s a pain in the butt, but I can see the reasoning behind WP doing it that way.

1 Like

Hi @adamslowe

I am not using blocks/gutenberg. Just the old style theme way :wink:

So in the editor it looks like this:

If i don’t us the alt text in the editor then it won’t show an alt text on the front-end. While the image has a alt text in the media library. I could just fill in the alt text in the media library and in Pinegrow but would be easier if i can only do it in the media library.

Thanks,
Guido

If the image is in your php file doors it somehow have a relationship to the media library, or is it pulling from the theme folder or pathname to the media library image? Unless it’s calling the DB to get the image from the library it won’t be able to see the library’s alt text.

Maybe I’m missing something?

1 Like

Hi @adamslowe

So if i click that folder icon by source then i can choose an image from the media library. The image in the media library has an alt text. If that is the only action i do then there is no alt text on the front-end.

I also need to fill in the alt text in Pinegrow to have the alt text on the front-end. Maybe that is just how it works? I thought it would automatically grab the alt text from the media library even if i don’t fill it in in Pinegrow.

Guido

Clicking the folder icon in the source field tells the HTML/PHP document where to grab the image. It fills in the src attribute. The problem is that the alt text lives inside the WordPress media library database, not in the image itself. To get the image alt text from the media library you’d need to somehow use the get_post_meta() function on the image ID similar to the line below.

 $alt_text = get_post_meta($img_id , '_wp_attachment_image_alt', true);

Long story short, just add the alt text in Pinegrow unless you are already dynamically pulling the image somehow. For example, if you were showing the post/page featured image in the theme or an image that is tied to the post through a custom field. Doing it by referencing the media library post id would be overly complicated and would break if the ID in the media library changed.

1 Like

Ah oke thanks!

I will add a feature request that when you add an image from the library that pinegrow automatically fill in the alt text in pinegrow based on the image alt text in the media library. Would be nice to have :wink: Possible @matjaz?

Thanks Adam for you replies.

Guido

1 Like

Guido, I think the big challenge would be that WordPress has no idea what image you want based on the filename unless you feed it an image ID. I’m not saying it’s impossible since you could theoretically search the DB for any images matching that path/filename and get the ID that way, but it seems like it wouldn’t be a great practice.

Can you tell me more about the context of when you want to reference an image from your theme file? Is is always going to be the same image site-wide, or is it somehow tied to the post being displayed? If it’s the latter, then the existing get_post_meta() or Post Field WP Action might be just what you need. If it’s a sitewide image, then maybe it’s something you can define in the customizer and reference from your theme using the Customizer Field Smart Action.

1 Like

Hi @adamslowe

Right… So i have a homepage that is completely designed in pinegrow and exported as front-page.php.

The image or images are just static images in a section or card for example. They are not dynamically loaded on the front-end. So i guess then the easiest way is just to add an alt text within pinegrow.

I am just so used to a page builder like Oxygen that when you add images i never had to think about adding alt text other then in the media library.

Thanks
Guido

Makes sense. Page builders do everything through the database so they inherently reference the media library. Php themes don’t have any such ties unless you make them.

Another option, which is what I’ve started doing, would be to create blocks for all the sections on the homepage and just add them to Gutenberg using the normal page.php template. It’s one step closer to a block theme :slight_smile:

1 Like

Yep that makes sense. Still learning and adjusting to the Pinegrow workflow :wink:

I tried my best for months to find a good way to use Gutenberg/Block theme… but man there is so many issues/complications. I build two sites like that. I decided to switch to using the standard WordPress theme method and have now also build two sites like that. In my opinion using the standard WordPress theme method is so much easier, leaner and more controllable.

And for clients to easily change content (images/text) i can either use custom fields or the customizer settings in Pinegrow. Feel like using the customizer is also easier and faster then creating custom fields for everything.

I still use the theme.json so i can add the brand colors to Gutenberg for if the client uses Gutenberg for for example post types. And still have the ability to create Gutenberg blocks if i need them.

Thanks for all your help and extra info. Appreciate it. :slightly_smiling_face:
Guido

1 Like