Friday, February 3, 2012

Different styles based on languages in Liferay Themes.

If you need different languages in your portal and also different theme based your language
Step 1 : Add languages portlet in banner. Using runtime in portal-normal.vm

Step 2: Write the css for align the languages portlet

Step 3:  Add these lines in portal_normal.vm

#if($locale == "RTL") <link rel="stylesheet" href="$css_folder/rtl-custom.css" type="text/css"></link> #else if($locale == "LTR") <link rel="stylesheet" href="$css_folder/ltr-custom.css" type="text/css"></link> #end
Step 4 rtl-custom.css,lrt-custom.css these both files having css related to body of theme. these files would place on css folder of your theme. You need to apply css on body something as below 
body {     background:url("../images/bg/body.jpg") repeat-x scroll left 90px #EEEEEE;     font-size:10px;     font-family:verdana,sans-serif;     margin:0;     padding:0; }
Another Ways : Step 1: we could also add class in body tag it will create css based on your language. Or if you want use any place in VM files you could add this ${locale.toString()} in the class.
<body class="$css_class ${locale.toString()}">
 Step 2: You need to apply css like this, based on the your language the class will create in the body. Just you need to call the parent class and your class. Here i am using different style padding style for navigation
.de_DE .navigation li a {
    padding: 0px 10px;
}
 

No comments:

Post a Comment