1. Roberto
  2. Commercial Templates
  3. Friday, 28 December 2012
  4.  Subscribe via email
Hi,

I'm having quite a bit of trouble in placing the Language Switcher on the left side of the "hornav" position in the J51_MonoChrome template, so that it appears on the left of the various menu items.

When in the "Module Language Switcher" ordering settings I place the switcher on position 1 (all the way to the left), this "pushes" the right-most entry of the menu one line down behind the "search" bar making it disappear (and thus unusable). If I change the order the language switcher to the rightmost position, then the language flags drop one line down to the search bar. They do remain visible however, so they are working, but the final effect is not as "clean" as having the flags on the left side of the menu bar.

I have the development site here with the language flags on the right (which pushes them down one line):
http://66.181.198.46

Here is a screenshot showing the the other position with the flags on the left but the right-most menu item (Contattaci) being pushed down one row:
[img size=976]http://66.181.198.46/images/Screen%20Shot%202012-12-28%20at%201.26.10%20PM.png[/img]

Is there a way to fix this so the language flags are on the left (there's plenty of room) and the menu does not word wrap down one line?

Thanks!
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Roberto

Try adding the following CSS to the end of your templates template.css (../templates/j51_monochrome/css/template.css)

[code type=css].mod-languages {
left: 20px;
position: absolute;
}
#top {position: relative;}[/code]
Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 1
Accepted Answer Pending Moderation
0
Votes
Undo
Thank you, that is much better now :-)
The flags are now on the left-hand side, and the menu does not wrap anymore. Is there a way to have the flags just to the left of the left-most menu item, so that they are not separated? If so, that would be a better UI experience for the user, as the flags would be right next to the menu's text making it easier for the users to notice them and change language. If not, that's fine, it's certainly better than before.

Merry Christmas!
  1. more than a month ago
  2. Commercial Templates
  3. # 2
Accepted Answer Pending Moderation
0
Votes
Undo
Try changing the added CSS to the foloowing...

[code type=css].mod-languages {
left: 510px;
position: absolute;
top: 20px;
}
#top {position: relative;}[/code]
... and a very Merry Christmas to you :)

Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 3
Accepted Answer Pending Moderation
0
Votes
Undo
that made the flags overlap the "Home" menu item in the italian language as in italian the words are longer and thus moved the "Home" item more to the left. Using an absolute value for the language switcher to position it at the left of "Home" thus won't work, as the menu width changes depending on the language and will also change if the titles change. It does need to be a "relative" position in order to make it look right.

If this can't be figured out (I'm terrible with CSS...), having the flags on the left border as with your original tweak is a good alternate solution.

Thanks again!
  1. more than a month ago
  2. Commercial Templates
  3. # 4
  • Page :
  • 1


There are no replies made for this post yet.
Be one of the first to reply to this post!

Join Our Newsletter

* indicates required
We respect your privacy and do not tolerate spam and will never sell, rent, lease or give away your information (name, email, number, etc.) to any third party. Nor will we send you unsolicited email.
Joomla51 - Mullaghmore, Co. Sligo, Ireland
Joomla51.com is not affiliated with or endorsed by the Joomla! Project or Open Source Matters.
The Joomla! name and logo is used under a limited license granted by
Open Source Matters
the trademark holder in the United States and other countries.