Localization of the TeamPulse Ideas & Feedback Portal

With the 2012 R2 Release, localization of the Ideas and Feedback Portal is as easy as editing a text file! 

Background

Localization is the process of changing the text in an application to another language, or locale.  Well designed applications allow for changing the text that is displayed without having to branch the source code and recompile, and TeamPulse certainly falls into this category.  Built on Microsoft’s .NET Platform, TeamPulse takes full advantage of the localization features provided by the .NET Framework, allowing you to customize the Ideas and Feedback portal to the language that best meets your needs.

Based on our customers’ feedback that we gather through many channels, including our instance of the Ideas and Feedback Portal that we use to gather feedback from you, our customer, the ability to localize the Feedback Portal was a highly rated need. 

Getting Started

Finding the Installation Folder using Environment Variables

Before we can customize the Portal, we need to know where on our server the application resides.  If you followed the defaults during installation, the location is %ProgramFiles%\Telerik\TeamPulse\FeedbackPortal, where %ProgramFiles% is the default drive and path for installation of software.  To quickly determine where your default directory is, open a command window by clicking Start->Run, then type “cmd” without the quotes (see Figure 1).

Figure 1

Once you have a command window open, type “echo %ProgramFiles%” (without the quotes), and you will see the definition of the environment variable (see Figure 2).

Figure 2

Finding the Installation Folder using Internet Information Services (IIS) Manager

The Ideas and Feedback Portal is an ASP.NET application that runs in IIS.  To determine where it is running, open up Internet Information Services Manager by clicking on Start –> Administrative Tools –> Internet Information Services (IIS) Manager.  Or, from the Run prompt (Start –> Run), type “INETMGR.EXE” without the quotes.

This will bring up a window similar to the one in Figure 3.  Expand the Server in the left rail, and click on the “Sites” icon.  This will list all of the sites installed on that server.  In the center content area of the screen, make sure that the “Features View” tab is selected.  This will then list all of the sites and the path to their installation.  You can see in this example that the Portal as well as TeamPulse are both installed under the C:\Program Files\Telerik\TeamPulse directory.  If your path has an environment variable (such as %SystemDrive%), you can use the technique from the previous section to discover the actual installation path.

Figure 3

Working With Localization Files

To put it bluntly, localization files are big XML files.  All of the strings that can be modified are their own <data> element like in Listing 1.  These are the data elements for the “Like” and “Dislike” labels in the Feedback Portal.  The strings in the <value> tags are the values that get displayed in the application. 

<data name="Dislike" xml:space="preserve"> 
 
 <value>Dislike</value> 
 
</data> 
 
<data name="Like" xml:space="preserve"> 
 
 <value>Like</value> 
 
</data> 
 
 

Listing 1

If we want to change the display to Yes for Like and No for Dislike as we change the language to Dutch, we change the XML to what we see in Listing 2.

<data name="Dislike" xml:space="preserve"> 
 
 <value>Nee</value> 
 
</data> 
 
<data name="Like" xml:space="preserve"> 
 
 <value>Ja</value> 
 
</data>
 

Listing 2

Ideas and Feedback Portal Localization File

With the 2012 R2 Release, the localization file for the Feedback Portal is located in %installation_directory%\App_GlobalResources directory, where %installation_directory% is the directory where the feedback portal is installed (this can be located as described in the beginning of this article).  In that directory is a file named “String.resx”, which is the localization file for the Portal.

In this example, we want to change the Search Topics/Suggest New text as well as the Like/Dislike text. Figure 4 shows the changes that we want to make.

Figure 4

In this example, we are going to change the language to "Dutch”, but before we do that, we need to determine how we are going to activate the localization.

Updating the Main Resource File

One way is to replace the text in the string.resx file with the changes that we want.  Any changes that are made in the strings.resx file that is in the %installation_directory%\App_GlobalResources directory will automatically take effect on the next browser refresh.  If you do change the existing file, make sure to make a backup before you start!

Changing the Culture Using the Web.Config

Since there is only currently one resource file, ASP.NET will automatically use that file.  If there is more than one, it looks to match the file names with the current “UICulture”.  The Culture setting is used for date and numerical formatting, whereas the UI Culture is used for localizing the strings in an application.   The naming convention for localization files is “Strings.yy.resx”, where “yy” indicates the culture.  “en” for English, “bg” for Bulgarian, “nl” for Dutch, etc.

To change the UICulture for an ASP.NET application, open up the web.config file (found in the %installation_directory% for the Ideas and Feedback Portal), and find the line that reads <system.web>.  Add a new line after system.web line as shown in Listing 3 so you can specify the UICulture. In this example, the culture is set to English.  NOTE: Please make sure that you enter it exactly like it is written, as it’s case sensitive.

<system.web> 
 
 <globalization uiCulture="en"/> 
 
 <!-- rest of config file cut for brevity -> 
 
</system.web> 
 
 

Listing 3

Changing the Text to Dutch

First we copy the existing “Strings.resx” file to “Strings.nl.resx”. In the new file, find the four entries that we want to change.  These changes that are shown in Listing 4.  We also change the web.config file to change the UICulture to “NL”, as shown in Listing 5. 

<data name="SearchTopics" xml:space="preserve"> 
 
 <value>Zoeken Onderwerpen</value> 
 
</data> 
 
<data name="Suggest" xml:space="preserve"> 
 
 <value>Suggesties doen voor nieuwe onderwerpen</value> 
 
</data> 
 
 
<data name="Dislike" xml:space="preserve"> 
 
 <value>Nee</value> 
 
</data> 
 
<data name="Like" xml:space="preserve"> 
 
 <value>Ja</value> 
 
</data> 
 
 

Listing 4

<system.web> 
 
 <globalization uiCulture="nl"/> 
 
 <!-- rest of config file cut for brevity --> 
 
</system.web> 
 
 

Once those changes are in place, we can refresh our browser and see the (partly) localized Ideas and Feedback Portal (as shown in Figure 5).

Figure 5

Summary

With just a few steps (once you know where to look), you can easily localize the TeamPulse Ideas and Feedback Portal to match your language and customer needs.  Special thanks to the development team for making this such a simple process with the 2012 R2 release.  You spoke, we listened, and we have simplified the process for localization into merely editing text files!