Support Forums

Support Offline : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

Language switcher flags on the menu

Featured Lock Resolved Issue
Hi,

How to put language switcher flags on the menu? see the attached picture.

Thank you

Attachments (1)

  • Language Switcher Flags.jpg
    Language Switcher Flags.jpg 421.2 KB

18 Answers

Paul Frankowski - Staff

More than a month ago #Permalink
Hi,
Possible.
You need to create/add 3rd column in the header row, custom layout: 2,9,1.
And set top3, then there publish language switcher module,
+ add some custom CSS if necessary to improve a design.

top3.png

Attachments (1)

  • top3.png
    top3.png 18.8 KB

Paul Frankowski - Staff

More than a month ago #Permalink

S

More than a month ago #Permalink
Hi Paul, is this solution with a third column also possible in the menu/header of the rental template?
Where do I add the third column in the header, I do not see the Helix framework. Or do I have to make a custom header?? Thanks, I am slowly advancing ;-)

Paul Frankowski - Staff

More than a month ago #Permalink
Yes, but in Rental template, you have to DISABLE Predefined Headers and rebuild your own "Custom Header".

More in Helix Manual (also with video)
https://www.joomshaper.com/documentation/helix-framework/helixultimate#layout-builder

S

More than a month ago #Permalink
Yes that worked out! Only the mobile menu is gone now. Do I get that back with setting the grid breakpoints?

Maybe it would be handy to know some default settings for all options, like in the predefined headers. It's not so easy to figure out those settings. If there's some info, that would be enormously helpful

Thanks Again!

Paul Frankowski - Staff

More than a month ago #Permalink
You have to set a proper mobile grid, in my video there is tip.
In Helix Ulimate is similar

To keep all columns in a single row = summary of columns must be 12
For example,
6 for logo
3 for mobile menu [=]
3 for top3

Do you need a video?
Or image

HU_grid_for_columns.jpg

Attachments (1)

  • HU_grid_for_columns.jpg
    HU_grid_for_columns.jpg 78.9 KB

mongkol

More than a month ago #Permalink
Hi Paul,

I'm so confused in setting language switcher flags(Thai/English) on the menu.
I finished some parts as you suggested but can not complete yet.

- I would like to set Thai language is the default language, meaning when user come to website, they will see the Thai language first.
- The Thai menu and English menu seem not match with the flag yet.
- Submenu on off canvas menu is gone.

I send the username password to your inbox

Thank you

Need thai flag, submenu is gone.jpg
TH,EN menu link to SP page builder.jpg

Attachments (2)

  • Need thai flag, submenu is gone.jpg
    Need thai flag, submenu is gone.jpg 193.7 KB
  • TH,EN menu link to SP page builder.jpg
    TH,EN menu link to SP page builder.jpg 217.4 KB

Paul Frankowski - Staff

More than a month ago #Permalink
Why don't you create two menus, like do all Joomla webmasters?
One for English and one for Thai. I think you never worked with Joomla multilanguage, sorry but I cannot teach Joomla here.
Please read
https://www.joomshaper.com/documentation/helix-framework/helix3#how-to-create-a-multilingual-site

rules are this same for all Helix.

mongkol

More than a month ago #Permalink
Why don't you create two menus, like do all Joomla webmasters?
One for English and one for Thai. I think you never worked with Joomla multilanguage, sorry but I cannot teach Joomla here.
Please read
https://www.joomshaper.com/documentation/helix-framework/helix3#how-to-create-a-multilingual-site

rules are this same for all Helix.


Hi Paul,
Thanks for giving me the information.
Now I almost setup multi language completely.
There are only a few things need to fix.
1.How to setup language switcher to be center on PC screen. (see the attached picture)
2.How to setup language switcher to be center on Mobile screen. And when press offcanvas menu, there is no menu appear.(see the attached picture)

Thank you

Attachments (2)

  • Language Switcher in the center(PC).jpg
    Language Switcher in the center(PC).jpg 250.1 KB
  • Language Switcher in the center(mobile).jpg
    Language Switcher in the center(mobile).jpg 340.8 KB

Paul Frankowski - Staff

More than a month ago #Permalink
For PC view use custom CSS

#sp-top3 {
margin-top: 31px;
padding-right: 0;
margin-right: 0;
text-align: right;
}

Paul Frankowski - Staff

More than a month ago #Permalink
About Mobile please watch video 2x
https://www.youtube.com/watch?v=vD4mFU59bww

mongkol

More than a month ago #Permalink
About Mobile please watch video 2x
https://www.youtube.com/watch?v=vD4mFU59bww


For PC, I already set as you suggested and it look ok now.
but for mobile, the flag language still not on the same line of menu.

Please give the idea how to setup CSS separately on the layout of header for PC/Tablet/mobile.
Right now CSS of header I only setup on custom.css

Thanks

Attachments (1)

  • Flag not the same line on menu.jpg
    Flag not the same line on menu.jpg 50.8 KB

Paul Frankowski - Staff

More than a month ago #Permalink
But on video, there was an answer. I guess you forget about one step.
You need to set a width of Mobile Layout for all columns,
Logo - col-xs-5
Menu - col-xs-3
Top3 - col-xs-4


5+3+4 = 12

0-0.jpg

Attachments (1)

  • 0-0.jpg
    0-0.jpg 36.2 KB

mongkol

More than a month ago #Permalink
But on video, there was an answer. I guess you forget about one step.
You need to set a width of Mobile Layout for all columns,
Logo - col-xs-5
Menu - col-xs-3
Top3 - col-xs-4


5+3+4 = 12

[attachment]0-0.jpg[/attachment]


Thanks Paul, Now I got it.
One more thing is the flag switcher not stay center on the same line of menu, it's a little bit go down when move down the web page.

Attachments (1)

  • when move down.jpg
    when move down.jpg 92.6 KB

mongkol

More than a month ago #Permalink
Also there is sub-menu on main menu but there is no sub-menu on the off-canvas menu. (see the attach pic.)

Thanks.

Attachments (1)

  • submenu disappear on offcanvas menu.jpg
    submenu disappear on offcanvas menu.jpg 185.3 KB

Paul Frankowski - Staff

More than a month ago #Permalink
check Menu module settings,
and
type of menu items

mongkol

More than a month ago #Permalink
Where is it to setup?
It seem need to click the menu first, then it will show submenu symbol " ^ " in the offcanvas menu.
thanks

Attachments (1)

  • submenu does not show.jpg
    submenu does not show.jpg 147.4 KB


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

Leaderboard (30 days)

Sifat

Sifat

Total Accepted Answers: 133
Paul Frankowski

Paul Frankowski

Total Accepted Answers: 92
Toufiq

Toufiq

Total Accepted Answers: 24
Pavel

Pavel

Total Accepted Answers: 4
Al Mamun

Al Mamun

Total Accepted Answers: 3

113

Templates

289592

Community Users

Newsletter

Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us