Develop > Controller layer > Application developer > Support globalization > Globalized catalog content > Globalized store design


Set the dir attribute for BiDi specifications

There are two ways to dynamically set the dir attribute and other HTML BiDi specifications.

In WebSphere Commerce, there are two ways to dynamically set the dir attribute and other HTML BiDi specifications, to the correct value in the JSP template:


Procedure

  1. The following example shows the directional HTML elements: 

    <% if(languageId.compareTo("<Bidi_Language_ID")==0)
{
    %>
    <%
}
else
{
    %>
    <%
}
%>

    The Bidi_language_id is the language_id of the BiDi language that needs the dir attribute to be set to "RTL". For example: 

    <!-- *******************BiDi start*********************** -->
<% if(languageId.compareTo("-11")==0)
{
    %>
    <body dir=RTL marginheight="0" marginwidth="0">
    <%
}
else
{
    %>
    <body marginheight="0" marginwidth="0">
    <%
}
%>
<!-- ******************BiDi end************************** -->
<table cellpadding="0" cellspacing="0" border="0"
width="600">
<tr>
<!-- ******************BiDi start************************ -->
<% if(languageId.compareTo("-11")==0)
{
    %>
    <td class="banner" valign="right" width="180">
    <%
}
else
{
    %>
    <td class="banner" valign="left" width="180">
    <%
}
%>
<!-- *************BiDi end******************************* -->

  2. Use a locale-specific Cascading Style Sheet (CSS file) in which you can specify the directionality attribute.

    1. From the store css directory, make a copy of the Master1_1.css file and name it Master1_1ar_EG.css

    2. Open Master1_1ar_EG.css in a text editor and change the following line: 

      html {direction: ltl; unicode-bidi: embed;}

      to: 

      html {direction: rtl; unicode-bidi: embed;}

      Change all the align= statements in the CSS file to point to RTL.

    3. Save and close the file.

    4. Open the VirtualPages.xml file from:

      • WC_EAR/Stores.war/WEB-INF/xml/tools/stores/ConsumerDirect/devtools/flow/repository

      • workspace_dir\Stores\Web Content\WEB-INF\xml\tools\stores\ConsumerDirect\devtools\flow\repository

    5. At the end of the <virtual-file id="vfile.stylesheet"/> line, add the following lines for every style sheet that to use: 

      <virtual-file-implementation virtual-file-id="vfile.stylesheet" 
                             url="css/Master1_1$locale$.css" id="vfile.style1.css" 
                             locale-specific="yes" 
                             locales="ar_EG,ar"/>

    6. Save and close the VirtualPages.xml file.

    7. Restart the WebSphere Commerce Server instance or refresh the Store Registry for the change to take effect.


Related concepts

Globalized store design

Globalized tools framework

Globalized catalog content


Related tasks

Create a globalized store

Use resource bundles in store pages

Related reference

Globalization tips

massload utility (Server environment)


+

Search Tips   |   Advanced Search