uppercutlinn Posted January 28, 2021 Share Posted January 28, 2021 Site URL: https://en.uppercutdanseteater.dk/ Hey! I would really appreciate help with the position of the weglot button on my webiste. I would like to have it on the right top corner (right now it's on the right button corner). Thank you in advance!! Link to comment
tuanphan Posted February 2, 2021 Share Posted February 2, 2021 Add to Design > Custom CSS .wg-default, .wg-default .country-selector { bottom: unset !important; top: 0 !important; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Solution Parker_SQSP Posted August 4, 2022 Solution Share Posted August 4, 2022 Hi all, I'm Parker and I work on the Customer Operations team at Squarespace. I came across this thread, and I wanted to let you know that we now have an official integration with Weglot. With the integration, the language switcher button now lives in the site header. You can edit the appearance of the button (text only, icon & text, flag & text) from your header's style settings. Here's some more on that and the integration in general: https://support.squarespace.com/hc/en-us/articles/205809778-Creating-a-multilingual-site-in-Squarespace#toc-customize-the-language-switcher Link to comment
jesswp Posted August 27, 2022 Share Posted August 27, 2022 Hi @tuanphan (or anyone else that can assist!) I am wondering if you can help me move the Weglot translator to my secondary nav where the green bar is instead. Right now it's positioned right next to the CTA button in the primary nav. I am in Fluid Engine. Thanks! https://flute-herring-aws3.squarespace.com/ pass: art Link to comment
tuanphan Posted August 28, 2022 Share Posted August 28, 2022 19 hours ago, jesswp said: Hi @tuanphan (or anyone else that can assist!) I am wondering if you can help me move the Weglot translator to my secondary nav where the green bar is instead. Right now it's positioned right next to the CTA button in the primary nav. I am in Fluid Engine. Thanks! https://flute-herring-aws3.squarespace.com/ pass: art Move this? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
jesswp Posted August 30, 2022 Share Posted August 30, 2022 (edited) On 8/28/2022 at 5:29 AM, tuanphan said: Move this? Yes @tuanphan!!! Edited September 1, 2022 by jesswp Link to comment
jesswp Posted September 4, 2022 Share Posted September 4, 2022 On 8/28/2022 at 5:29 AM, tuanphan said: Move this? Hey @tuanphan! Just wanted to see if you have an update for this by chance. Hope you are having a great weekend. Link to comment
tuanphan Posted September 5, 2022 Share Posted September 5, 2022 10 hours ago, jesswp said: Hey @tuanphan! Just wanted to see if you have an update for this by chance. Hope you are having a great weekend. Add to Last line in Code Injection > Footer <script> $(document).ready(function() { $('.header-display-desktop .header-actions.header-actions--right').clone().appendTo('div#wm-subnav>nav'); }); </script> <style> div#wm-subnav .header-actions-action.header-actions-action--cta { display: none; } </style> Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
jesswp Posted September 6, 2022 Share Posted September 6, 2022 (edited) On 9/4/2022 at 10:48 PM, tuanphan said: Add to Last line in Code Injection > Footer <script> $(document).ready(function() { $('.header-display-desktop .header-actions.header-actions--right').clone().appendTo('div#wm-subnav>nav'); }); </script> <style> div#wm-subnav .header-actions-action.header-actions-action--cta { display: none; } </style> It seems to be appearing in both places now? @tuanphan It also seems like it's cut off when viewing incognito mode. Edited September 6, 2022 by jesswp Link to comment
tuanphan Posted September 8, 2022 Share Posted September 8, 2022 On 9/6/2022 at 8:29 PM, jesswp said: It seems to be appearing in both places now? @tuanphan It also seems like it's cut off when viewing incognito mode. Add this code under code I sent <style> .header-display-desktop .header-actions.header-actions--right>div.language-picker { display: none; } </style> and try checking to see if language picker still works properly or not. Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
jesswp Posted September 8, 2022 Share Posted September 8, 2022 4 hours ago, tuanphan said: Add this code under code I sent <style> .header-display-desktop .header-actions.header-actions--right>div.language-picker { display: none; } </style> and try checking to see if language picker still works properly or not. Hi @tuanphan It still seems to be cutting off unfortunately when I am in incognito mode. See video attached! Screen Recording 2022-09-08 at 10.58.09 AM.mov Link to comment
STRANA Posted November 1 Share Posted November 1 Hi! Maybe you also can help me @tuanphan? I would like to move the language widget to the right of the button or to the announcement bar. I have tried some codes but it dosent work. Is it also possible som change to only have the flag or EN/SV? Link to comment
tuanphan Posted November 3 Share Posted November 3 On 11/1/2023 at 7:06 PM, STRANA said: Hi! Maybe you also can help me @tuanphan? I would like to move the language widget to the right of the button or to the announcement bar. I have tried some codes but it dosent work. Is it also possible som change to only have the flag or EN/SV? What is your site url? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
abbiericher Posted November 27 Share Posted November 27 Hi @tuanphan! Would you be able to help me as well? 1. I copied your HTML codes above, but my login icon also switches place with the language selector... I would like it to stay ONLY in the main navigation on the left of the button. 2. Also, I would like to hide the secondary nav on mobile. 3. Is it possible to only show the FR/ENG flags instead of the actual icon and text? Thanks alot! https://snail-ray-daxz.squarespace.com/ pass: freelance Link to comment
tuanphan Posted November 29 Share Posted November 29 On 11/28/2023 at 12:35 AM, abbiericher said: Hi @tuanphan! Would you be able to help me as well? 1. I copied your HTML codes above, but my login icon also switches place with the language selector... I would like it to stay ONLY in the main navigation on the left of the button. 2. Also, I would like to hide the secondary nav on mobile. 3. Is it possible to only show the FR/ENG flags instead of the actual icon and text? Thanks alot! https://snail-ray-daxz.squarespace.com/ pass: freelance #1. You mean move this? #2. You can use this CSS code (this code include mobile + tablet) /* Hide secondary nav */ @media screen and (max-width:991px) { div#wm-subnav { display: none !important; } } #3. I see you figured it out? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
abbiericher Posted November 29 Share Posted November 29 7 hours ago, tuanphan said: #1. You mean move this? #2. You can use this CSS code (this code include mobile + tablet) /* Hide secondary nav */ @media screen and (max-width:991px) { div#wm-subnav { display: none !important; } } #3. I see you figured it out? 1. I meant the green icon for login, but I figured it out! Thanks! 2. Great. Exactly what I needed! 3. Yes! But my client finally wants only FR/ENG to appear. Not the whole word (Francais/English) or the flags. Do you know how to change that with Weglot? Also, is it possible to move the language dropdown menu in front of the button? Big thanks! 🙂 Link to comment
tuanphan Posted December 1 Share Posted December 1 On 11/29/2023 at 10:07 PM, abbiericher said: 1. I meant the green icon for login, but I figured it out! Thanks! 2. Great. Exactly what I needed! 3. Yes! But my client finally wants only FR/ENG to appear. Not the whole word (Francais/English) or the flags. Do you know how to change that with Weglot? Also, is it possible to move the language dropdown menu in front of the button? Big thanks! 🙂 Use this CSS code .header-actions .language-picker-content .language-item:nth-child(1) span:after { content: 'FR'; font-size: 12px } .header-actions .language-picker-content .language-item:nth-child(2) span:after { content: 'EN'; font-size: 12px } .header-actions .language-picker-content .language-item span { font-size: 0 } html[lang*="en-"] .language-picker .current-language-name, [lang="fr"] .language-picker .current-language-name { font-size: 0 !important } html[lang*="en-"] .header .language-picker .current-language-name:after { content: 'EN'; font-size: 12px !important } [lang="fr"] .language-picker .current-language-name:after { content: 'FR'; font-size: 12px !important } .header-actions .language-picker-desktop .language-picker-content { padding-left: 0; padding-bottom: 0 } .header .language-picker-content a { justify-content: center; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
abbiericher Posted December 1 Share Posted December 1 Thanks! But when I click on FR, its the english version that appears... Same for EN, its the french version that shows. Ans I would like only FR or EN to appears once my choice is made... Not Francais or English Link to comment
abbiericher Posted Tuesday at 02:04 PM Share Posted Tuesday at 02:04 PM On 12/1/2023 at 4:05 PM, abbiericher said: Thanks! But when I click on FR, its the english version that appears... Same for EN, its the french version that shows. Ans I would like only FR or EN to appears once my choice is made... Not Francais or English Hi @tuanphan! Any update? Link to comment
tuanphan Posted 12 hours ago Share Posted 12 hours ago Try this new code /* on English */ html[lang*="en"] div.language-item:nth-child(1) a span { font-size: 0; } html[lang*="en"] div.language-item:nth-child(1) a span:before { content: "EN"; font-size: 16px; } html[lang*="en"] div.language-item:nth-child(2) a span { font-size: 0; } html[lang*="en"] div.language-item:nth-child(2) a span:before { content: "FR"; font-size: 16px; } /* on FR */ html[lang*="fr"] div.language-item:nth-child(1) a span { font-size: 0; } html[lang*="fr"] div.language-item:nth-child(1) a span:before { content: "FR"; font-size: 16px; } html[lang*="fr"] div.language-item:nth-child(2) a span { font-size: 0; } html[lang*="fr"] div.language-item:nth-child(2) a span:before { content: "EN"; font-size: 16px; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care 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