Joomla Templates Club 406,261 posts

[edgarmiro Friend edgarmiroJoin date: July 2015Posts: 23Downloads:5Uploads:0 Thanks: 14]

#695182

I’m also interested on a solution to this thread, because is marked as solved and no answer was provided.

Would be possible to have the flags as a drop-down menu or as the off-canvas in small screens?

Thanks in advance

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#695348

Hi,

You can give me the the screenshot what are your trying to do, I will help you to check it further.

Regards

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#750589

Hi,

You can give me the the screenshot what are your trying to do, I will help you to check it further.

Regards

[edgarmiro Friend edgarmiroJoin date: July 2015Posts: 23Downloads:5Uploads:0 Thanks: 14]

#695420

Thanks for your fast interest.

What I had with two languages ina small screen (mobile) was this. The flag showed the alternate languaje of the site.

Then I added a third languaje and appeared under the first flag as two other alternate languajes. On a normal size screen (computer) work as expected with a drop down menu that you can config.

I’m worried if adding more language ( this website will require 4-5 languajes) will mean that the main tittle will be gaining height to handle all the flags as I show on this photoshop sample.

What would be nice is to have a dropdown menu as the normal page to let you choose the languaje as I suggest in this image (you can see the flag of the actual languaje and clicking on the flag appear the rest of the possible languajes). Is this it possible? How is it done?

I’m working on the site http://entropiaarquitectura.com/entropia_2015 and what we have right now is justa test of waht we want for our future website. If you want to have acces just let me know.

Thanks in advance

[edgarmiro Friend edgarmiroJoin date: July 2015Posts: 23Downloads:5Uploads:0 Thanks: 14]

#750616

Thanks for your fast interest.

What I had with two languages ina small screen (mobile) was this. The flag showed the alternate languaje of the site.

Then I added a third languaje and appeared under the first flag as two other alternate languajes. On a normal size screen (computer) work as expected with a drop down menu that you can config.

I’m worried if adding more language ( this website will require 4-5 languajes) will mean that the main tittle will be gaining height to handle all the flags as I show on this photoshop sample.

What would be nice is to have a dropdown menu as the normal page to let you choose the languaje as I suggest in this image (you can see the flag of the actual languaje and clicking on the flag appear the rest of the possible languajes). Is this it possible? How is it done?

I’m working on the site http://entropiaarquitectura.com/entropia_2015 and what we have right now is justa test of waht we want for our future website. If you want to have acces just let me know.

Thanks in advance

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#695503

Hi,

You will need to customise much on this and actually this takes time and you should hire a developer to get it done for you. Below are my suggestion:

Create templates/ja_decor/css/custom.css file and add new rule

@media (max-width: 991px) {
.languageswitcherload .dropdown-toggle {
display: block;
}

.languageswitcherload .dropdown-menu {
position: absolute;
display: none;
top: 100%;
z-index: 1000;
float: left;
min-width: auto;
padding: 5px 0;
margin: 2px 0 0;
list-style: none;
font-size: 14px;
text-align: left;
background-color: #ffffff ;
border: 1px solid rgba(0,0,0,0.15);
border-radius: 0;
-webkit-box-shadow: none;
box-shadow: none;
background-clip: padding-box;
}

.t3-header {
overflow: visible;
}

.languageswitcherload .dropdown-menu > li > a span {
display: initial;
}

.languageswitcherload .dropdown-menu > li > a {
color: #333333 ;
line-height: 1.7142857 ;
}

.open .dropdown-menu {
display: block !important;
}
}

Regards

1 user says Thank You to Ninja Lead for this useful post

1. edgarmiro

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#750699

Hi,

You will need to customise much on this and actually this takes time and you should hire a developer to get it done for you. Below are my suggestion:

Create templates/ja_decor/css/custom.css file and add new rule

@media (max-width: 991px) {
.languageswitcherload .dropdown-toggle {
display: block;
}

.languageswitcherload .dropdown-menu {
position: absolute;
display: none;
top: 100%;
z-index: 1000;
float: left;
min-width: auto;
padding: 5px 0;
margin: 2px 0 0;
list-style: none;
font-size: 14px;
text-align: left;
background-color: #ffffff ;
border: 1px solid rgba(0,0,0,0.15);
border-radius: 0;
-webkit-box-shadow: none;
box-shadow: none;
background-clip: padding-box;
}

.t3-header {
overflow: visible;
}

.languageswitcherload .dropdown-menu > li > a span {
display: initial;
}

.languageswitcherload .dropdown-menu > li > a {
color: #333333 ;
line-height: 1.7142857 ;
}

.open .dropdown-menu {
display: block !important;
}
}

Regards

1 user says Thank You to Ninja Lead for this useful post

1. edgarmiro

[edgarmiro Friend edgarmiroJoin date: July 2015Posts: 23Downloads:5Uploads:0 Thanks: 14]

#695567

Thanks a lot for you answer…

Seems that the solution is far from my knoledge. Anyway I’ll may a test…

Adding that lines of code at the custom.css file will make that the website will “find” this new class for the switcher for screens les than 991px instead of the rule of the main css? can you tell me how you can tell what this css file should be load first ? or can be thsi modified on the existing css file adding a new rule for small screens?

What I have modified (colors, size of logo,…) have been inside the css of the template itself, should I have to create a custom css foar allthis personal rules too?

Thanks again.

Edgar Mir?

[edgarmiro Friend edgarmiroJoin date: July 2015Posts: 23Downloads:5Uploads:0 Thanks: 14]

#750716

Thanks a lot for you answer…

Seems that the solution is far from my knoledge. Anyway I’ll may a test…

Adding that lines of code at the custom.css file will make that the website will “find” this new class for the switcher for screens les than 991px instead of the rule of the main css? can you tell me how you can tell what this css file should be load first ? or can be thsi modified on the existing css file adding a new rule for small screens?

What I have modified (colors, size of logo,…) have been inside the css of the template itself, should I have to create a custom css foar allthis personal rules too?

Thanks again.

Edgar Mir?

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#695592

Hi Edgar Mir,

You can add any custom css style into the file: templates/ja_decor/css/custom.css . This file will be loaded in priority and all styles here will override other styles on your site.

Regards

1 user says Thank You to Ninja Lead for this useful post

1. edgarmiro

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#750741

Hi Edgar Mir,

You can add any custom css style into the file: templates/ja_decor/css/custom.css . This file will be loaded in priority and all styles here will override other styles on your site.

Regards

1 user says Thank You to Ninja Lead for this useful post

1. edgarmiro

[edgarmiro Friend edgarmiroJoin date: July 2015Posts: 23Downloads:5Uploads:0 Thanks: 14]

#695726

THANKS A LOT!!! Worked PERFECTLY!!

I’m really gratefull for your assistance. Will recomend without doubt.

Thanks

[edgarmiro Friend edgarmiroJoin date: July 2015Posts: 23Downloads:5Uploads:0 Thanks: 14]

#750795

THANKS A LOT!!! Worked PERFECTLY!!

I’m really gratefull for your assistance. Will recomend without doubt.

Thanks

[Author]

Posts