Can I add an altText property to the Image media type?
Hello,
Completely inexperienced with Umbraco and in web development in general, so I hope my question isn't silly and that I manage to get it across:
I want to add an altText as a mandatory property to the Image media type, so that whenever the content creator uploads an image they're prompted to input a description (which I can later pass into the 'alt' attribute in my templates). Adding the property to the media type is easy, but it doesn't have any effect on the image upload process - there's no prompt to input text.
Is there a way to make it work (or maybe some better way to make adding a description mandatory as part of the upload process)?
Thanks!
From Umbraco backoffice, you can click on Settings, Open media type, then select Image
Them click on Add Propery, enter a name for it "let's assume Alt Text", then click on Select Editor
Assuming it will be a text input, Search for "text" and then select text string, then click on Submit.
After submitting you will notice that the property has been added to the Image type, Click save
Now all your existing images and newly created images will have the field Alt text
After that all what you need is to read this property in your template which most probable will be "altText" if you named the new property "Alt Text", notice the text in front of the lock icon under the property name field.
Just read the property in the template and put its value in the alt tag in the image tag
Hello Ahmed, thanks for the detailed reply.
From what I can tell, this dialogue box only presents within the Media section of the Umbraco back office. However, when I use a media picker in the Content section to upload an image this dialogue box doesn't appear, the image is simply added to the folder. I expect my users to use the media picker almost exclusively, so the fact that the property is visible in the Media section is not really useful. Also, not only is this property difficult to get to, it's requirement as 'mandatory' is bypassed by uploading the image in the Content section.
It seems like a sort of bug, doesn't it? I guess I could work around it by using compositions comprising a media picker and a text box instead of embedding the text box into the media picker. Any other ideas?
By the way, I'm using Umbraco 13.5.1, maybe this problem has been fixed in v14?
As ahmed explained above, we need to go to individual media items to add alt text for each one and get the property value by its alias type and use it it the tag. This is the common use case.
However, if you want to add alt text for each piece of media collectively, you can create a blocklist that accommodates both the media and its corresponding alt text. This can be used in the content, and I recommend marking both properties as mandatory—though this is more of a workaround than a standard solution.
Regarding the issue you mentioned, is this the one you are referring to? Umbraco CMS Issue #17372.
Thanks.
Are you saying it is more common for users to add media files using the media library than the media picker? If so, why would that be preferable? Wouldn't it be more comfortable for editors to add media as they're editing the content node?
About your blocklist suggestion - right, I got confused when I said I could use compositions. Like you said, it's a workaround so it's a bit of a hassle, but I guess it gets the job done.
The issue I mentioned is similar to the one you mentioned, but not as extreme. That is, it's not that the media picker saves without any media (though maybe it could, I didn't try), but it does save without a required property (in this case, the AltText property I defined).
Cheers!
There are two Umbraco Packages that could help you with this as well, however there isn't a way to make these things mandatory I don't think.
The first package is : Media Description Manager
This gives you a dashboard to help your editors update alt descriptions when the field is stored on the media item and flag ones that don't have any.
The other is : Accessible Media Picker which is a custom editor that puts an alt text field inside the media picker.
Both of these might help your editors maintain alt text :-)
Can I add an altText property to the Image media type?
Hello, Completely inexperienced with Umbraco and in web development in general, so I hope my question isn't silly and that I manage to get it across: I want to add an altText as a mandatory property to the Image media type, so that whenever the content creator uploads an image they're prompted to input a description (which I can later pass into the 'alt' attribute in my templates). Adding the property to the media type is easy, but it doesn't have any effect on the image upload process - there's no prompt to input text. Is there a way to make it work (or maybe some better way to make adding a description mandatory as part of the upload process)? Thanks!
Hello Tom,
From Umbraco backoffice, you can click on Settings, Open media type, then select Image
Them click on Add Propery, enter a name for it "let's assume Alt Text", then click on Select Editor
Assuming it will be a text input, Search for "text" and then select text string, then click on Submit.
After submitting you will notice that the property has been added to the Image type, Click save
Now all your existing images and newly created images will have the field Alt text
After that all what you need is to read this property in your template which most probable will be "altText" if you named the new property "Alt Text", notice the text in front of the lock icon under the property name field.
Just read the property in the template and put its value in the alt tag in the image tag
Hello Ahmed, thanks for the detailed reply.
From what I can tell, this dialogue box only presents within the Media section of the Umbraco back office. However, when I use a media picker in the Content section to upload an image this dialogue box doesn't appear, the image is simply added to the folder. I expect my users to use the media picker almost exclusively, so the fact that the property is visible in the Media section is not really useful. Also, not only is this property difficult to get to, it's requirement as 'mandatory' is bypassed by uploading the image in the Content section.
It seems like a sort of bug, doesn't it? I guess I could work around it by using compositions comprising a media picker and a text box instead of embedding the text box into the media picker. Any other ideas?
By the way, I'm using Umbraco 13.5.1, maybe this problem has been fixed in v14?
Thanks again, Tom
Hi,
As ahmed explained above, we need to go to individual media items to add alt text for each one and get the property value by its alias type and use it it the![]()
tag. This is the common use case.
However, if you want to add alt text for each piece of media collectively, you can create a blocklist that accommodates both the media and its corresponding alt text. This can be used in the content, and I recommend marking both properties as mandatory—though this is more of a workaround than a standard solution.
Regarding the issue you mentioned, is this the one you are referring to? Umbraco CMS Issue #17372.
Thanks. Are you saying it is more common for users to add media files using the media library than the media picker? If so, why would that be preferable? Wouldn't it be more comfortable for editors to add media as they're editing the content node? About your blocklist suggestion - right, I got confused when I said I could use compositions. Like you said, it's a workaround so it's a bit of a hassle, but I guess it gets the job done. The issue I mentioned is similar to the one you mentioned, but not as extreme. That is, it's not that the media picker saves without any media (though maybe it could, I didn't try), but it does save without a required property (in this case, the AltText property I defined). Cheers!
Hi Tom,
There are two Umbraco Packages that could help you with this as well, however there isn't a way to make these things mandatory I don't think.
The first package is : Media Description Manager This gives you a dashboard to help your editors update alt descriptions when the field is stored on the media item and flag ones that don't have any.
The other is : Accessible Media Picker which is a custom editor that puts an alt text field inside the media picker.
Both of these might help your editors maintain alt text :-)
Thanks, I'll give them a try!
is working on a reply...