creedon Posted January 14, 2022 Share Posted January 14, 2022 12 hours ago, Oddvar said: But the code you made doesn't seem to work. My code is custom code for another piece of code which your site appears not to use. Without that code my code will not work. You probably don't want to install the code that my code depends on as it appears you've used a different way to handle multi-language site capabilities. I suggest taking a look at the following thread. Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Link to comment
Oddvar Posted January 19, 2022 Share Posted January 19, 2022 On 1/14/2022 at 11:04 PM, creedon said: I suggest taking a look at the following thread. Hello! I did not realize you answered so quickly, thank you! It seems this thread might not be quite what I'm looking for. What I need is the same button (the green "Kontakt oss"-button in the header" to have two different languages when switching between Norwegian and English. I don't need two separate buttons. So when you are on the NO-site it says "Kontakt oss", and on the EN-site it says "Contact us", and links to the english version of the contact-page. Hope you know how to help me, it would be greatly appreciated 🙂 Link to comment
creedon Posted January 19, 2022 Share Posted January 19, 2022 @Oddvar I suggested the two button code that could then be supplemented with additional code that would decide which button to show based on which language section of the site the visitor is in. Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Link to comment
amberv98 Posted February 22, 2022 Share Posted February 22, 2022 Hello @creedon! I don't know much about coding, but I would also like to have the button change according to the language. My website will be published in Dutch, French and English. Could you help me with this? The website is atelierroger.eu and the password is Scoby2311. Link to comment
creedon Posted February 22, 2022 Share Posted February 22, 2022 (edited) @amberv98 Please see my code cited in February 2, 2021 post earlier in this thread. Let us know how it goes. Edited June 21, 2022 by creedon Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Link to comment
HP920 Posted March 7, 2022 Share Posted March 7, 2022 @creedon Hi there, I have used some of your help already in setting my website in 2 french and english. I also used Brad Good tutorials and everything works great on Desktop, but not so much in mobile. I don't know if you can help me. I have 2 issues remaining after using brad good's way of switching languages, 1- On the mobile version, the CTA button was missing from the burger menu. I used his suggestion of adding this line in the exclusion. The CTA button came back on the mobile version, but the translation does not work, it stays in french (default language) $('.header-menu-cta a').addClass('exclude'); 2 - Also, the language switcher is oddly placed in the mobile version. It pops almost on the logo and it stays there even when I open the burger menu. Is there a way to change its place, or add it in the burger menu, or remove it? Thanks a lot for your help, url: https://www.panoraloges.ca/ Link to comment
creedon Posted March 8, 2022 Share Posted March 8, 2022 @HP920 It appears good to me. Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Link to comment
ca_belle Posted March 25, 2022 Share Posted March 25, 2022 Site URL: https://www.thefrassas.com Hi! So I tried figuring it out by myself but I couldn't. This is the last detail I need to finish my website. So the button on the header is RSVP (international word so doesn't need translation in the other language versions) and I have 3 languages, but when I try to add the anchor link in it, the same link goes for all the languages (because header and footer is the same for all pages). Ex.: If you chose English on the cover page and you click on the header button RSVP, it goes to the RSVP part in English. That sames rationale goes to someone who chooses Portuguese or German. Is it possible to someone help me out? Thanks a lot! Link to comment
ca_belle Posted March 25, 2022 Share Posted March 25, 2022 Hi! So I tried figuring it out by myself but I couldn't. This is the last detail I need to finish my website. So the button on the header is RSVP (international word so doesn't need translation in the other language versions) and I have 3 languages, but when I try to add the anchor link in it, the same link goes for all the languages (because header and footer is the same for all pages). Ex.: If you chose English on the cover page and you click on the header button RSVP, it goes to the RSVP part in English. That sames rationale goes to someone who chooses Portuguese or German. Is it possible to someone help me out? Thanks a lot! https://thefrassas.com Link to comment
tuanphan Posted March 29, 2022 Share Posted March 29, 2022 On 3/26/2022 at 2:40 AM, ca_belle said: Hi! So I tried figuring it out by myself but I couldn't. This is the last detail I need to finish my website. So the button on the header is RSVP (international word so doesn't need translation in the other language versions) and I have 3 languages, but when I try to add the anchor link in it, the same link goes for all the languages (because header and footer is the same for all pages). Ex.: If you chose English on the cover page and you click on the header button RSVP, it goes to the RSVP part in English. That sames rationale goes to someone who chooses Portuguese or German. Is it possible to someone help me out? Thanks a lot! https://thefrassas.com To change button url on each language, first, edit this code /* HOMEPAGE-LOGO LINKS TO PROPER LANGUAGE HOMEPAGE */ if (lang == "de") { $('a[href="/"]').attr("href", "/de/home/"); } if (lang == "en") { $('a[href="/"]').attr("href", "/en/home/"); } to this /* HOMEPAGE-LOGO LINKS TO PROPER LANGUAGE HOMEPAGE */ if (lang == "de") { $('a[href="/"]').attr("href", "/de/home/"); $('body').addClass('body-de'); } if (lang == "en") { $('a[href="/"]').attr("href", "/en/home/"); $('body').addClass('body-en'); } Next, add this to Last Line in Code Injection > Footer <script> $(document).ready(function() { // change button url on English Pages $('body.body-en header#header a.btn').attr('href','https://google.com'); // change button url on DE Pages $('body.body-de header#header a.btn').attr('href','https://pixabay.com'); }); </script> Replace google & pixabay with new url Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
Trawww Posted June 21, 2022 Share Posted June 21, 2022 Hall together I used the code from @Creedon and it works great. The problem is that in the mobile menu only the button is shown in one language and not in the other language. Website: https://cricket-megalodon-8kgf.squarespace.com/ Pw: summer123 Link to comment
creedon Posted June 21, 2022 Share Posted June 21, 2022 8 hours ago, Trawww said: The problem is that in the mobile menu only the button is shown in one language and not in the other language. The code appears to be working to me. cta language changes.mp4 Trawww 1 Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Link to comment
antasz Posted November 7, 2022 Share Posted November 7, 2022 Hi @creedon, I'm having the same problem: the button at the bottom of the English mobile sandwich menu doesn't appear. It works on desktop. I pasted a code you suggested to someone here earlier, but that didn't solve the issue either. Could you please take a look! Url: https://www.bee-at-work.hu Thanks, Anita Link to comment
creedon Posted November 7, 2022 Share Posted November 7, 2022 11 hours ago, antasz said: I'm having the same problem: the button at the bottom of the English mobile sandwich menu doesn't appear. I'm not able to reproduce your issue. I see the language switcher links on all the burger menus of each language. Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Link to comment
antasz Posted November 8, 2022 Share Posted November 8, 2022 14 hours ago, creedon said: I'm not able to reproduce your issue. I see the language switcher links on all the burger menus of each language. Hello! Thanks for your reply! The problem is not with the language selector, but with the red button. On desktop both languages have the button in the navigation, but on mobile the English version has no button in the sandwich menu. Link to comment
creedon Posted November 9, 2022 Share Posted November 9, 2022 13 hours ago, antasz said: The problem is not with the language selector, but with the red button. Try changing the URL for the CTA to #. Let us know how it goes. Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects. Link to comment
antasz Posted November 9, 2022 Share Posted November 9, 2022 8 hours ago, creedon said: Try changing the URL for the CTA to #. Let us know how it goes. Thank you! It works, that was the solution! creedon 1 Link to comment
MoChilla Posted November 7, 2023 Share Posted November 7, 2023 On 3/7/2022 at 10:42 PM, HP920 said: @creedon Hi there, I have used some of your help already in setting my website in 2 french and english. I also used Brad Good tutorials and everything works great on Desktop, but not so much in mobile. I don't know if you can help me. ... ..... $('.header-menu-cta a').addClass('exclude'); 2 - Also, the language switcher is oddly placed in the mobile version. It pops almost on the logo and it stays there even when I open the burger menu. Is there a way to change its place, or add it in the burger menu, or remove it? Thanks a lot for your help, url: https://www.panoraloges.ca/ Hi Creedon I am facing a similar problem like HP920. the language switcher is oddly placed over the burger menu in the mobile verion or when I shrink the desktop window. I've used the following code for the language switcher in the footer of the code injection: --------------------------------------------------------------------------------------------------------------------- <script> $(function() { /* SETUP MULTI-LANGUAGE */ var defaultLanguage = 'de'; var lang = location.pathname.split("/")[1]; var defaultClass = 'lang-' + defaultLanguage + ''; var itemParent = "nav [class*='collection'],nav [class*='folder'],nav [class*='index'],nav [class*='group']"; if (lang == "" || lang.length > 2) { lang = defaultLanguage; } /* ADD LANGUAGE CLASSES */ $('a[href="/"]').addClass('lang-' + defaultLanguage + '').parents(itemParent).addClass('lang-' + defaultLanguage + ''); $('nav a:link:not([href^="http://"]):not([href^="https://"])').each(function() { var langType = $(this).attr('href').split("/")[1]; var multiLanguageClass = 'multilanguage lang-' + langType + ''; if (undefined !== langType && langType.length <= 2) $(this).addClass(multiLanguageClass).parents(itemParent).addClass(multiLanguageClass); }); $('nav button').each(function() { var langTypeFolder = $(this).attr('data-controller-folder-toggle').split("/")[0]; var multiLanguageClass = 'multilanguage lang-' + langTypeFolder + ''; if (undefined !== langTypeFolder && langTypeFolder.length <= 2) $(this).addClass(multiLanguageClass); }); /* HOMEPAGE-LOGO LINKS TO PROPER LANGUAGE HOMEPAGE */ if (lang == "de") { $('a[href="/"]').attr("href", "/de/startseite/"); } else if (lang == "fr") { $('a[href="/"]').attr("href", "/fr/page-daccueil/"); } /* ADD EXCLUSION NAV ITEMS */ $('.exclude-me,.exclude-me a').addClass('exclude'); $('.sqs-svg-icon--list a,.SocialLinks-link,.header-menu-controls-control').addClass('exclude'); /* REMOVE OTHER LANGUAGES AND KEEP EXCLUDED ITEMS */ $('.multilanguage:not(".lang-' + lang + ',.exclude")').remove(); /* SETUP LANGUAGE SWITCHER */ var currentUrl = location.pathname; var switcherUrl = currentUrl.replace('/' + lang + '/', '/' + (lang === 'de' ? 'fr' : 'de') + '/'); switch (currentUrl) { case '/de/startseite': switcherUrl = switcherUrl.replace('/startseite', '/page-daccueil'); break; case '/fr/page-daccueil/': switcherUrl = switcherUrl.replace('/page-daccueil', '/startseite'); break; default: var germanPages = ['startseite', 'ueber-uns', 'dienstleistungen', 'team', 'referenzen', 'karriere', 'kontakt', 'stellenportal', 'impressum', 'datenschutzerklaerung' ]; var frenchPages = ['page-daccueil', 'a-propos', 'services', 'lequipe', 'references', 'carriere', 'contact', 'portail-de-lemploi', 'impression', 'declaration-de-protection-des-donnees']; var germanIndex = germanPages.indexOf(currentUrl.split('/')[2]); var frenchIndex = frenchPages.indexOf(currentUrl.split('/')[2]); if (germanIndex > -1) { switcherUrl = switcherUrl.replace('/' + germanPages[germanIndex], '/' + frenchPages[germanIndex]); } else if (frenchIndex > -1) { switcherUrl = switcherUrl.replace('/' + frenchPages[frenchIndex], '/' + germanPages[frenchIndex]); } break; } /* Language-Initials DE | FR */ $('body').prepend('<div class="language"><a href="' + switcherUrl + '" class="lang-de">DE</a> <a href="' + switcherUrl + '" class="lang-fr">FR</a></div>'); }); </script> CSS: /*SETUP STYLE LANGUAGE SWITCHER*/ .language { font-size: 16px; position: fixed; top: 39px; right: 20px; z-index: 99999; } /* Entfernen Sie den Trennstrich "|" nach "FR" */ .lang-fr:not(:last-child)::after { content: none; } /* Ändern Sie die Schriftfarbe für "DE" und "FR" */ .lang-de, .lang-fr { color: #3255A4; /* Ersetzen Sie #3255A4 durch die gewünschte Farbe */ } /* Ändern Sie die Schriftfarbe beim Hover für "DE" und "FR" */ .lang-de:hover, .lang-fr:hover { opacity: 0.8; } --------------------------------------------------------------------------------------------------------------------- Is there a possibility to integrate the language switcher in the burger menu? Or do you know a better solution? Many thanks for your help! Cheers! Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment