Alt Tag for various Cornerstone elements

Hi there,

unfortunately I cannot find my last post according to that topic.

I know that the alt tags for images do only show up in the source code when added via “ALT” field in the image element in Cornerstone.

How do I provide alt tags for other elements like:

  • background images
  • Creative CTA elements
  • Feature Box elements
  • Card elements
  • Widgets

Best regards

Hi,

Thanks for writing in! Regretfully this isn’t a feature offered by X.

This is something we can add to our list of feature requests. This way it can be taken into consideration for future development. All of these items are discussed with our team internally and prioritized based on the amount of interest a particular feature might receive. Thanks!

Hi there,

did something happen in the meantime? Is there a way to add an alt tag to the images in card elements?

Best regards

Hi There @knowmates

I have checked our issue tracker and I can confirm that our staff already have added those as feature requests. We cannot provide any ETA but rest assured, that our developers will implement those functionality in an upcoming release.

Thanks for understanding!

Hi,

is there a way to add an alt tag to the images in card elements, maybe a little workaround?

I understand that you have a lot of requests but I don’t want to wait for upcoming releases because I know that this topic is discussed for a few years.

Best regards

Hi @knowmates

It will not be that easy task to find a workaround without heavily customize the theme which is beyond our support scope, however, you might find these links helpful as a starter:

Thanks.

Hey @knowmates,

We understand your concern but regretfully, there is no workaround.

Please let me clarify on some of the list items you posted though. A background image could not have an Alt attribute because it is displayed by CSS.

I’m not sure what you mean by Widgets. If you mean the Image widget of WordPress you can set the Alt attribute when you edit the image in the media library.

Thank you for patience and understanding.

Hi there,

unfortunately the two links above do not solve the problem.

I also don’t want to install a plugin just to get an alt text to three different images in three card elements.

Too bad.

Hi @knowmates,

Unfortunately, there is no available workaround as previously communicated. And you can try Christians suggestion about widgets. As for elements of the builder, we’ll have to wait for this feature to be implemented.

Thanks for understanding.

Hi,

is it possible to add alt tags to Cornerstone elements like Creative CTA, Feature Box or Card meanwhile? Is there any update?

Best regards

Hi @knowmates,

Unfortunately, it’s still not currently possible. The image data isn’t captured when the Media Library inserts the image to the integrated X 's media button/icon.

And there is available news about it as of yet.

Thanks for follow up and noted this.

Hi there,

I just want to make sure I understood you correctly. It is still not possible to add alt tags to the mentioned elements and the alt tags added into the media library are still not used automatically?

In your second paragraph you probably forgot a ‘no’, so there is no available news about that?

Hey @knowmates,

To your question:

Yes, that is correct.

Yes, I believe Rad forgot to add no because there’s no news about the alt tags yet except for the Classic Feature Box which already has the a Graphic Alt Text field.

Please stay tuned for updates.

Thanks.

Thanks for clarifying!

You’re welcome.

Hey guys,

next try four years later: is it possible to add alt tags to Cornerstone elements like Creative CTA, Feature Box or Cards meanwhile? Is there any update?

Best regards

Hey @knowmates,

With the new elements, every time you add an image as long as it is not a background image, there is an option for you to add the ALT text. Check out the screenshot below:

Best Regards.

I’m not sure if you are still looking for a solution for this, but I ran into a similar issue trying to add alt tags / tooltips for icons.

In the end, I assigned a class to the items, and used jQuery to add an “aria-label” attribute for screen readers and a “title” attribute for the tooltip on hover.

Below is the jQuery I used for my particular situation:

jQuery(document).ready(function($) {

  $('.feature_food_onsite').attr('aria-label', 'Food Onsite');
  $('.feature_food_onsite').attr('title', 'Food Onsite');
    
  $('.feature_family_friendly').attr('aria-label', 'Family / Child Friendly');
  $('.feature_family_friendly').attr('title', 'Family / Child Friendly');
    
  $('.feature_pet_friendly').attr('aria-label', 'Pet Friendly');
  $('.feature_pet_friendly').attr('title', 'Pet Friendly');
});

Hope that helps.

Hi @smoothdev,

Glad that you shared the solution here with others.