By Ziya Mollamahmut

XLocalizer has a handy extension pack; XLocalizer.TagHelpers for localizing views using a simple html tag.

• Install
• Setup
• Localize texts
• Localize HTML
• Localize Select Items
• Localize attributes
• Specify culture
• Provide arguments for localized contents
• Specify resource source
• Traditional localization for views
• Demo
• Next: Localizing data annotations

Install from nuget

PM > Install-Package XLocalizer.TagHelpers

Localize views using LocalizeTagHelper, first it must be added to `ViewImports.cshtml

@addTagHelper *, XLocalizer.TagHelpers

Localize texts/html contents using localize-content attribute with any html tag

<h1 localize-content>Sample header</h1>

<p localize-content>
    sample content...
</p>

Use <localize> html tag or to localize all its contents

<localize>
    <h1>Sample title</h1>
    <p>sample contents...</p>
<localize>

Use <localize-select> html tag to localize select items texts.

<localize-select asp-items="Model.MyItems"></localize-select>

Requires XLocalizer.TagHelpers v1.1.0 or later.

Localize attributes like title inside <img tag using localize-att-*

<img src="/images/picture.jpg" localize-att-title="Picture title"/>

Localize a string that contains arguments by providing the arguments using localize-args

@{
    var args = new object[] { "http://demo.ziyad.info/en/localize", 8, "Asp.Net Core" }
}

<p localize-args="args">
    Visit <a href="{0}">demos website</a> to see a collection of {1} demos about "{2}".
</p>

Localized output sample: Visit demos website to see a collection of 8 demos about "Asp.Net Core".

Force specific culture regardless the request culture

<p localize-culture="tr">
    This content will always be localized with TR culture
</p>

Specify localization resource type using localize-source

<p localize-source="typeof(MyResourceType)">
    This content will be localized from a specific shared resource.
</p>

See demo page.

Default localization interfaces can be used to localize view contents:

@inject IStringLocalizer _localizer

<h1>@_localizer["Welcome"]</h1>