- This topic has 15 replies, 3 voices, and was last updated 3 years, 10 months ago by Tom.
-
AuthorPosts
-
May 5, 2020 at 6:20 am #1270401Matthias
Hi there,
i am trying to add the translatepress plugin language switcher – and have it look in a decent way.
There are 3 Options to add as described here:
1. choosing in the backends plugin settings to have a floating switcher
2. adding shortcode[language-switcher]
into a page or widget. This for me looks like the floating switcher – a dropdown selection but as it says on a page of widget.
3. to a menu -> which adds a menu entry with the classtrp-language-switcher-container
Personally i think the first 2 look… lets say – not so good.
So i added Option 3.
Now i would like to have them on the most right side (currently they are the last items – but the search is the farmost right).
Also i would like to have them close to each other – and not as far apart as the other menu entries – and as i use language shortcodes – i would like those to be separeted by a line |
Hope you know what i mean.So currently it looks like (dots are space between entries)
Home…..Entry1…..Entry2…..Language1…..Language2…..Search
I would want
Home…..Entry1…..Entry2…..Search…..Language1|Language2
is this possible?
May 5, 2020 at 7:37 am #1270504DavidStaffCustomer SupportHi there,
can you share a link to your site so i can take a look if its possible?
You can edit your original topic and use the Site URL field to share the link privately.May 5, 2020 at 8:08 am #1270717Matthiasi added the link to the start post.
May 5, 2020 at 8:13 am #1270726DavidStaffCustomer SupportTry adding this CSS:
.nav-aligned-right .main-navigation .menu>li.trp-language-switcher-container { float: right; }
May 5, 2020 at 9:34 am #1270841Matthiasthat made them flow to the right. nice
Is there a way to put them closer together? And add a line as separator in between?
Currently they got the same gap as the other menu items.May 5, 2020 at 4:08 pm #1271271TomLead DeveloperLead DeveloperHi there,
You can bring them closer together like this:
.main-navigation .main-nav ul li.trp-language-switcher-container a { padding: 0 5px; }
You’d need to add another class to the menu item that needs a border, as there’s no way to select just one of them.
May 6, 2020 at 4:08 am #1271769Matthiaseven nice. Now both language names are where i want them – looking like:
Menu Search EN DE
now i “only” want to go to
Menu Search en|de
So – from big to small letters and with a separator line. Also i want the active language shown in a certain color.
As this is in my opinion is going quite into plugin territory I already submitted a ticket there since i bought it.
If i get a solution i will post it here. But if you want feel free to add you 2cents.
May 6, 2020 at 9:51 am #1272406TomLead DeveloperLead DeveloperFor the separator, you’d need a unique class added to the menu item you want to apply it to.
For the active language color, that menu item would need to have a class added to it so we know it’s active – it doesn’t look like that happens right now. The plugin devs should be able to help with this one.
May 15, 2020 at 3:54 am #1285418Matthiascan i ask a quick follow up?
sadly the support of this plugin isn’t very good – aka not responding to tickets. Which happened to me twice now since i bought this. Not really as advertised – and so definitely no command from me if anyone thinks about trying this.
I am thinking to switch to wpml when the update period ist running out (which – as i beeing annoyed discovered when looking for this has also support in an open forum).Anyways – until then:
i made it to look quite similar to what i want – but now my non-existing try-and-error coding skills are at its limit.is there a way to change the switcher entries?
meaning: currently in my menu you can see a dropdown:
EN
DEis it possible to change it from capital to small letters:
en
de?
May 15, 2020 at 5:02 am #1285464DavidStaffCustomer SupportTry this CSS:
.trp-ls-language-name { text-transform: lowercase; }
May 15, 2020 at 9:07 am #1285933Matthiasthat doesn’t seem to work.
May 15, 2020 at 9:10 am #1285940DavidStaffCustomer SupportWhere did you add it?
Also i suggest you disable your autoptimize and check your site in an incognito/private browser as it has no cache.May 15, 2020 at 10:15 am #1286061Matthiasi added it to style.css of child theme.
Autooptimize is disabled now – sorry.
I tried with chromium incognito and firefox private – its also still capital there.
May 15, 2020 at 4:43 pm #1286514TomLead DeveloperLead DeveloperIn the CSS above it, you’ve opened a comment (
/*
) but didn’t close it:/* .main-navigation .main-nav ul li.trp-language-switcher-container a {
You need to close that comment or any CSS below it won’t be read.
May 16, 2020 at 6:30 am #1287095Matthiasok – that was embarassing. i actually did close the comment – but before the }
it works perfectly with the code David provided.
thx a bunch. Topic resolved 😀And happy 6th. We will for sure extend our license. And as we bought it at the end of the year we will gladly do so no discount needed – i can tell you that already. Worth every penny.
-
AuthorPosts
- You must be logged in to reply to this topic.