Translate your Squarespace website in multiple languages

 
 

Discover a Squarespace multilingual solution that allows you to add multiple languages to your site in just minutes. No duplicate menus or multiple pages needed. Simply use Weglot to add a new language to your Squarespace website fast. Get access to automated, manual and pro translation and display the translation quality that’s right for your website.

 

Language Switcher Samples

Weglot adds a switcher on your website so visitors can quickly change the displayed language. You can easily customize this switcher to fit your brand design. Here are a few examples on how to do it on your Squarespace website.

Menu Approach

 
<a href="#Weglot-en">English</a>
<a href="#Weglot-es">Español</a>
 

Add the language switcher in the menu of your Squarespace website as a drop down.

  1. Go into your Squarespace admin dashboard ‘Pages’ > ‘Main Navigation’.

  2. Click on the ‘+’ icon and select ‘Link’ from the options.

  3. In the ‘LINK TITLE’ type the language (this will be appear in your website menu) and in the ‘LINK’ section ‘#Weglot-’ and the 2-letter language code (i.e #Weglot-fr for French). Click ‘SAVE’

CSS Approach 

.country-selector {
    margin: 30px 130px !important;
    background: #F0E3D9;
    box-shadow: 0px 0px 16px rgba(255, 99, 166, 0.25);
    border-radius: 50px;
}
.country-selector .wg-li {
    margin: 0 !important;
    width: 100px;
    height: 48px;
    line-height: 48px;
    text-align: center;  
}
.country-selector .wg-li a {
    text-decoration: none !important;
    color: #ff66a8 !important;
}
.wgcurrent {
    background-color: #ff66a8;
    border-radius: 74px;
}
.country-selector .wgcurrent a {
    color: #F0E3D9 !important;
}
 

You can also easily customize your switcher with CSS. To add this style of language switcher:

  1. Go into your Weglot Dashboard ‘Settings’ > ‘Language Switcher’.

  2. Add the code below in the ‘Custom CSS’ section, uncheck “Button as a dropdown” and click ‘Save changes’.