How to localize designer selectors

When building a custom Sitefinity control (widget), in many cases you would like to provide the content editor ability to easy adapt and change some properties of the control without the need to write and understand the code behind. This is done via the widget designer. For more information, see Widget designers from Sitefinity official documentation.

Depending on the needs, designers can contain plain controls as text-boxes, radio buttons, check-boxes etc. However in many cases designers require complex functionality to be built, such as selector for all Sitefinity pages, selector for all available Sitefinity tags or categories, etc. For this purpose, developers incorporate the usage of Sitefinity controls as PagesSelector, TaxaSelector, etc. See Testimonials Sitefinity demo for a sample usage of the PageSelector.

This blog post will pay your attention to the localization of designer selectors.

Problem:

Imagine the situation where your Sitefinity application is set to use different languages on the front-end (Multilingual environment). You have several taxonomies created for the different languages where not all of the taxa have translations. In that case you should not let content editors to select taxa that is not translated from the control designers. In addition widgets that allow users to select pages should also be able to select only pages that exist for the current language.

Solution

In the problem described above, the widget designers consists of a PageSelector and TaxaSelector. As the Sitefinity site is using multilingual environment, specific properties must be set to the selectors so that only Pages and classifications that are translated in the current culture can be selected.

PagesSelector:

The behavior of the PagesSelector is to not display the pages that are not translated and disable the pages that are not published so that content editors cannot select them:

In the InitializeControls method of the designer, the current culture is retrieved from the PropertyValuesCulture property. The property comes from the parent control that the designer is related to – PropertyEditor.

Designer markup:

<sf:PagesSelector runat="server" ID="pageSelectorLandingPageId" 
        AllowExternalPagesSelection="false" AllowMultipleSelection="false" />

Designer code-behind:

    /// <summary>
    /// Gets the page selector control.
    /// </summary>
    /// <value>The page selector control.</value>
    protected internal virtual PagesSelector PageSelectorLandingPageId
    {
        get
        {
            return this.Container.GetControl<PagesSelector>("pageSelectorLandingPageId", true);
        }
    }

  protected override void InitializeControls(Telerik.Sitefinity.Web.UI.GenericContainer container)
    {
        if (this.PropertyEditor != null)
        {
            var uiCulture = this.PropertyEditor.PropertyValuesCulture;
            this.PageSelectorLandingPageId.UICulture = uiCulture;
        }
    }

TaxaSelector:

The behavior of the TaxaSelector OOTB (out-of-the-box) is to display a (not translated) message next to the classification title:

Designer markup:

<sfFields:HierarchicalTaxonField ID="PlatformsTopicsSelector" runat="server" DisplayMode="Write" Expanded="true" ExpandText="ClickToAddPlatformTopics"
ShowDoneSelectingButton="true" AllowRootSelection="false"  AllowMultipleSelection="true" BindOnServer="false" TaxonomyMetafieldName="platforms"
WebServiceUrl="~/Sitefinity/Services/Taxonomies/HierarchicalTaxon.svc" />

Designer code-behind:

    /// <summary>
    /// Gets the platforms topics selector.
    /// </summary>
    /// <value>
    /// The platforms topics selector.
    /// </value>
    public HierarchicalTaxonField PlatformsTopicsSelector
    {
        get
        {
            return this.Container.GetControl<HierarchicalTaxonField>("platformsTopicsSelector", true);
        }
    }

 protected override void InitializeControls(Telerik.Sitefinity.Web.UI.GenericContainer container)
    {
      this.PlatformsTopicsSelector.TaxonomyId = this.platformsTaxonomyId;
    }

    private readonly Guid platformsTaxonomyId = new Guid("4697f927-68d0-68c1-9ecd-ff0000969877");

In the code above, Platforms is a custom hierarchical classification. As only Platforms classifications must be selected from content editors, the TaxaSelector’s TaxonomyId property is set to the ID of the platforms classification.

Veronica Milcheva

About Veronica Milcheva

I am a passionate Sitefinity blogger, developer and consultant. In my spare time I enjoy running and listening to music. My personal quote: There's no tough problem, just not enough coffee :)

View Comments

comments powered by Disqus