Developing A Multilingual Application Using .Net Core
Implementing a multilingual application requires a complex infrastructural setup. So, in this article we will use NuGet package “LazZiya.ExpressLocalization”.
Follow the steps as given below:
Create a .net core application. Select ASP.NET core application and click the “Next” button.
Assign the name and directory where you want to make an application and press the “Create” button.
Select “Web Application” and press the “Create” button.
➢ ExpressLocalization Setup
Now Application setup is done. So the next step is to install NuGet package “LazZiya.ExpressLocalization”.
On solution explorer right click on “Dependencies” and select “Nuget Packages”.
Select the “Browse” tab and type “LazZiya.express” and install the package.
Install “LazZiya.TagHelpers” and install the package.
Create a new folder “LocalizationResources”.
Add new class “LocSource” inside recently added folder “LocalizationResources”
|
1 2 3 4 |
public class LocSource { } |
Add the following code in “Startup.cs” file to setup localization in application.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
public void ConfigureServices(IServiceCollection services) { var cultures = new[] { new CultureInfo("de"), // German new CultureInfo("en"), // English new CultureInfo("fr"), // French new CultureInfo("es"), // Spanish }; services.AddRazorPages() .AddExpressLocalization<LocSource>(ops => { ops.ResourcesPath = "LocalizationResources"; ops.RequestLocalizationOptions = o => { o.SupportedCultures = cultures; o.SupportedUICultures = cultures; o.DefaultRequestCulture = new RequestCulture("en"); }; }); } |
Open “_ViewImports.cshtml” file and write the following code.
|
1 2 3 4 5 6 |
@addTagHelper *, LazZiya.TagHelpers @addTagHelper *, LazZiya.ExpressLocalization @using LazZiya.ExpressLocalization @inject ISharedCultureLocalizer Loc |
Add the following code where you want to display language selection dropdown list. As of now I have added a language dropdown in the “_Layout.cshtml” file.
Add resource file for each language that you have added in Startup.cs file
➢ Localizing Views
There are several ways to implement localization in View.
Option 1 : – To implement option 1 we have to add tag helper to “ _ViewImports.cshtml”.
Use localize html tag inside view.
<h1 localize-content>Welcome</h1>
OR
<localize>Welcome</localize>
Open Index.cshtml page and add the following code.
|
1 2 3 4 |
@{ ViewData["Title"] = "Home Page"; } <div class="text-center"> </code> <code><h1 localize-content>Welcome</h1> </code> <code><localize>Welcome</localize> </code> <code><p>Learn about </code> <code><a href="https://docs.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p> </code> <code></div></code> |
Now, add name value collection in all the resource files.
Use the same process to localize texts in all views.
Option 2: – To implement option 2 we have to inject culture localizer to the views and call its method.
Open Pages “_ViewImports.cshtml” file and inject ISharedCultureLocalizer that already comes with ExpressLocalization.
@using LazZiya.ExpressLocalization
@inject ISharedCultureLocalizer _loc
Below is the example of Option-1 and Option-2.
➢ How to use localization for DataAnnotations:-
ExpressLocalization has inbuilt data annotation attributes. Using these attributes, we can localize DataAnnotations messages.
Now create a new view for registration as below.
Create a new action method in HomeController to open the registration page.
|
1 2 3 4 |
public IActionResult Registration() { return View("~/Views/Home/Registration.cshtml"); } |
Now open the Registration page and click the “Create” button.
We hope you have an understanding of how to develop a multilingual application using .Net Core now. In case of any queries, do get in touch with an expert at DEV IT here.
Latest posts by Sahin Patel (see all)
- Developing A Multilingual Application Using .Net Core - June 8, 2021