Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Peter Cort Larsen 3 posts 44 karma points
    Jun 17, 2021 @ 08:52
    Peter Cort Larsen
    0

    Localized alt texts

    Hi anyone have implemented localized alt texts in Umbraco 8. Both in the media section and when adding an image using RTE?

    Any guidelines/ideas?

  • Peter Cort Larsen 3 posts 44 karma points
    Jun 18, 2021 @ 09:49
    Peter Cort Larsen
    100

    For a start, alt texts could be added like this, to the image.

    Note: remember to register the component in a composer

    using System;
    using Umbraco.Core.Composing;
    using Umbraco.Core.Models;
    using Umbraco.Core.Services;
    using System.Collections.Generic;
    
    namespace Website.Services
    {
        public class MediaType: IComponent
        {
            private readonly IMediaTypeService _umbracoMediaTypeService;
    
            private readonly IDataTypeService _dataTypeService;
    
            private readonly ILocalizationService _locationService;
    
            public MediaType(IMediaTypeService mediaTypeService, IDataTypeService dataTypeService, ILocalizationService locationService)
            {
                _umbracoMediaTypeService = mediaTypeService;
    
                _dataTypeService = dataTypeService;
    
                _locationService = locationService;
            }
    
            public void Initialize()
            {
                InitialiseImageMediaType(); 
            }
    
            public void Terminate()
            {
                throw new NotImplementedException();
            }
    
            private void InitialiseImageMediaType()
            {
                IMediaType imageType = _umbracoMediaTypeService.Get("Image");
    
                if (imageType != null)
                {
                    IEnumerable<ILanguage> languages = _locationService.GetAllLanguages();
    
                    foreach (var lang in languages)
                    {
                        //Add alt text for each language
                        var TextstringDataType = _dataTypeService.GetDataType("Textstring");
                        PropertyType myProperty = new PropertyType(TextstringDataType, "alt_" + lang.IsoCode);
                        myProperty.Name = "Alternate text for " + lang.CultureName;
                        imageType.AddPropertyType(myProperty, "Image");
                        _umbracoMediaTypeService.Save(imageType);
    
                    }
                }
            }  
        }
    }
    

    This gives me these alt texts, depenind on my langs enter image description here

  • Marc Love (uSkinned.net) 447 posts 1790 karma points
    Jun 18, 2021 @ 14:36
    Marc Love (uSkinned.net)
    0

    Another solution is to have a single field for your alternative text and use Umbraco dictionary to hold all translations.

    You could then have a helper function which gets the value from dictionary if the value is identified in a certain way:

    public string GetAlternativeText(string altText)
    {
        string output = altText;
    
        if (altText.Length >= 3)
        {
            if (altText[0].ToString() == "[" && altText[altText.Length - 1].ToString() == "]")
            {
                string dictionaryLabel = altText.Substring(1, altText.Length - 2);
                output = Umbraco.GetDictionaryValue(dictionaryLabel);
            }
        }
    
        return output;
    }
    

    In this example if the value of alt text is surrounded by square brackets it will look for the corresponding dictionary value.

    [MYALTTEXT]

    would result in MYALTEXT being searched in dictionary and returning the corresponding value for the language that the current site is running under.

  • Mikael Axel Kleinwort 154 posts 499 karma points c-trib
    Apr 30, 2023 @ 10:12
    Mikael Axel Kleinwort
    0

    All the suggested workarounds are just - work arounds. I would love to see this as a regular Umbraco feature. Any multi lingual website will need this one way or another.

  • Roslyn Wilson 3 posts 72 karma points
    May 22, 2023 @ 16:30
    Roslyn Wilson
    0

    Does anyone have a working example of this for Umbraco 10?

  • Marc Goodson 2157 posts 14435 karma points MVP 9x c-trib
    May 22, 2023 @ 17:04
    Marc Goodson
    0

    Hi Mikael

    There is a package here:

    https://marketplace.umbraco.com/package/our.umbraco.multilanguagetextbox

    Which is super useful for language specific alt text on media items...

    And a broader conversation on loving to see this in the core here:

    https://github.com/umbraco/Umbraco-CMS/issues/8432

    regards

    Marc

  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies