WPML widget alignment

[Goran Milic]

Hello Bill,

I have installed wpml plugin so I need your help here:

1. Could you please give me a CSS, I would like to align this wpml widget in the middle of the sidebar.

2. Do you think I could position this widget above logo maybe on the top of the page?

3. I need to choose from these 2 options (what should i choose regarding your theme:

“WPML allows to get translations for texts in themes and plugins in two ways:

a. The traditional .mo files (good for when you already got that with the theme).
b. Translating the theme’s texts directly from WPML”

Thank you in advance.

Goran

Attachments:

1. 

   Screenshot_121214_010324_AM.jpg
   

[Bill Robbins]

Hello Goran,

I’d be glad to take a look at the WPML widget. What’s the URL to your site?

I would also just do the translation in the plugin.

Thanks,
Bill

[Goran Milic]

Bill,

This is the link: http://www.saltandpepper.hr
I have turned off maintenance mode for you. I have already added css for transparent background for WPML widget, and I am starting with the setup, it is not that easy to work with WPML as it seems…

[Bill Robbins]

Give this a try and see if it won’t center the icons and move them above the logo:

1. Go to your theme options page and choose the Advanced tab.
2. Scroll down to the Custom CSS box and add this:

   
   .lang_sel_list_horizontal ul {
   	text-align: center;
   }
   
   #sidebar .lang_sel_list_horizontal ul li {
   	display: inline-block;
   	float: none;
   }
   
   #sidebar {
   	padding-top: 40px;
   }
   
   aside#icl_lang_sel_widget-1 {
   	position: absolute;
   	top: 3px;
   	margin: 0;
   	left: 0;
   	right: 0;
   }
   

3. Update your settings.

Let me know how that turns out,
Bill

[Goran Milic]

Bill, I did as you told me. It looks a bit strange because it is touching logo from the top.
One option is to keep it under the navigation aligned middle and another option is to keep it on the top of everything like now but little bit more higher in order not to touch logo. What do you think, what makes sense according to you?
Sorry for going in such small details but beetwen logo and navigation is also an option or not?

[Bill Robbins]

You can move the logo further down from the top by increasing the padding in this part of the snippet:

#sidebar {
	padding-top: 40px;
}

You might try something like 45px or 50px and see how that goes.

If you’d rather just center the icons below the navigation menu, then remove these styles:

#sidebar {
	padding-top: 40px;
}

aside#icl_lang_sel_widget-1 {
	position: absolute;
	top: 3px;
	margin: 0;
	left: 0;
	right: 0;
}

See how that goes,
Bill

[Author]

Posts