Accessibility guidelines require to ensure that alternate text (ALT attribute) is provided for images. MCMS itself does not have a method to enforce that an ALT text needs to be provided with any image added to a placeholder.
The following steps will change the standard dialog of MCMS in a way that ALT text is enforced.
Enforce the ALT text for images from the Resource Gallery
Please backup the following file and then apply the modifications listed below:
\Program Files\Microsoft Content Management Server\Server\IIS_CMS\WebAuthor
\Dialogs\ResourceBrowser\Authoring\ImagePropertiesBrowse.aspx
Below the HandleKeyPress Javascript routine add the following routine:
function CheckAltTag()
{
if (NC_LocalForm.NC_AltText.value != “”)
return true;
else
{
alert(“Please provide an Alternate Text for this Image”);
return false;
}
}
In addition you need to change the following line:
<button id=”NCImg_Insert” onclick=”WBC_procsImage(‘<%= PlaceholderName %>’, ‘<%= PlaceholderType %>’, ‘<%= Resource.Url %>’); return false;”
As follows:
<button id=”NCImg_Insert” onclick=”if (CheckAltTag()) {WBC_procsImage(‘<%= PlaceholderName %>’, ‘<%= PlaceholderType %>’, ‘<%= Resource.Url %>’);} return false;”
Enforce the ALT text for local images
Please backup the following file and then apply the modifications listed below:
\Program Files\Microsoft Content Management Server\Server\IIS_CMS\WebAuthor
\Dialogs\ResourceBrowser\Authoring\ImageLocalBrowse.aspx
Add the following Javascript code to the HEAD section:
<script language=”JavaScript” type=”text/javascript”>
function CheckAltTag()
{
if (NC_LocalForm.NC_AltText.value != “”)
return true;
else
{
alert(“Please provide an Alternate Text for this Image”);
return false;
}
}
</script>
In addition you need to change the following line:
onsubmit=’return WBC_validateLocalPath(“Image”)’
As follows:
onsubmit=’if (CheckAltTag()) {return WBC_validateLocalPath(“Image”)} else {return false;}‘
Enforce the ALT text when using the properties dialog of the ImagePlaceholderControl
Please backup the following file and then apply the modifications listed below:
\Program Files\Microsoft Content Management Server\Server\IIS_CMS\WebAuthor\Dialogs\ResourceBrowser\Authoring\ImagePropertiesOnlyBrowse.aspx
Add the following Javascript code to the HEAD section:
<script language=”JavaScript” type=”text/javascript”>
function CheckAltTag()
{
if (NC_LocalForm.NC_AltText.value != “”)
return true;
else
{
alert(“Please provide an Alternate Text for this Image”);
return false;
}
}
</script>
In addition you need to change the following line:
<button id=”OKButton” onclick=”WBC_setImageProp( ‘<%= PlaceholderName %>’ ); return false;” class=”WBC-styclsButton”><%= IDS_UI_ButtonOKText %></button>
as follows:
<button id=”OKButton” onclick=”if (CheckAltTag()) {WBC_setImageProp( ‘<%= PlaceholderName %>’ );} return false;” class=”WBC-styclsButton”><%= IDS_UI_ButtonOKText %></button>
Permalink
Stefan, thanks for this, very useful. I tried to add the same function to the ImagePropertiesOnlyBrowse.aspx file but the form tag seems to be overwritten, thereby losing the onsubmit event handler. Is this why you didn’t include it in your instructions? 😉
All the best, Jeremy
Permalink
Hi Jeremy,
actually I just forgot to include this dialog.
I adjusted this article and it now reflects the required changes for the properties dialog as well.
Cheers,
Stefan