Wix - Integration/Setup

Step 1:  Weglot account

Go to your Weglot dashboard ( https://dashboard.weglot.com/) and get your API key in the "Project settings" menu (e.g. wg_1234567897e2ea993d291b571c2ec93b0)

Step 2: Paste the code

Log in to your Wix dashboard, then on the left-side menu, go to Manage Website > Tracking & Analytics

Copy the following code:

<script type="text/javascript" src="https://cdn.weglot.com/weglot.min.js"></script>
<script> 
	Weglot.setup ({ 
		api_key: 'YOUR_API_KEY', 
		originalLanguage: 'fr', 
		destinationLanguages: 'en,es', 
	}); 
</script>

You can also use a custom version. Then you'll be able to change the button design:

<script type = "text/javascript" src = "https://cdn.weglot.com/weglot.min.js"></script>
<script>
   Weglot.setup({
      api_key: "YOUR_API_KEY",
      originalLanguage: "fr",
      destinationLanguages: "en,es",
      styleOpt: {
          fullname: true,
          withname: true,
          is_dropdown: true,
          classF: "wg-flags flag-3"
      },
      exceptions: "",
      excludePaths: "",
      dynamic: "",
      autoSwitch: false,
      switchers: [{
          styleOpt: {
              fullname: true,
              withname: true,
              is_dropdown: true,
              classF: "wg-flags flag-3"
          },
          containerCss: "",
          target: "",
          sibling: null
      }]
   });
</script>

To move your button to somewhere you want, you'll have to edit "target" and "sibling" field:

  • target: is the CSS selector of the node that the switcher will be a child of 
  • sibling: is the CSS selector of the next sibling element of the switcher, put null for the last element inside the target

Step 3: Replace API and both original and destination languages

Replace the items  api_key,  originalLanguage , and  destinationLanguages

  • Your api_key is available on your Weglot account. It looks like  wg_XXXXXXXXXXXXXXX
  • originalLanguage:  It indicates the original language of your website, with its 2-letters code (all codes are available here). 
  • destinationLanguages:  It indicates the desired languages with their 2-letters code. Each language has to be separated by a comma.

Step 4: Finalization of the integration

Once you have finished to custom the Weglot setup code, click "New Tool" and "Custom" and paste the code. Make sure that you select "Load code on each new page" and click "Apply".

By default, your Weglot button will be displayed in the bottom-right corner of your website.

Still need help? Contact Us Contact Us