Weglot

Administration: https://dashboard.weglot.com/ (login in 3rd party)

3P POC: Christophe from Weglot <support@weglot.com> or Patrick

Stream website release doc >> https://streamcompanies-my.sharepoint.com/:x:/p/cory_manning/ET8J5n5-bGdDm4mpyBnQ1wMB4YEMTjTV1xgoBtWxQ2d0yw?rtime=SWGi2XSf3Eg

Pronounced wee-glot

There are 3 parts to this (Other than DI):

1. Script added to WSP

2. DNS entries

3. Navigation updates

Custom work for each WSP below.

DealerInspire Setup

Working example: Plugin active and switcher set to Navigation https://www.avondalenissan.com/

Wordpress setup: https://support.weglot.com/article/72-wordpress-integration-setup

1. Use WP plugin >> https://wordpress.org/plugins/weglot/

2. Weglot should be setup for Subdirectory used instead

3. Need active API key from Weglot dash and add to WP Plugin

4. Navigation updates - Appearance > Menu > Add Weglot Switcher to Navigation

5. Update flags in Weglot dashboard > Language Switcher > Language Appearance > United States & Mexico Flags

** Not Currently Used **

By creating the languages menu items, if you're able to provide them with a specific URL, you'll just need to assign them the URLs below:

For the English link => #Weglot-en
 For the Spanish link => #Weglot-es

Doc => https://developers.weglot.com/javascript/link-hooks 

*CSS from Weglot tool that switches the navigation links to show either Espanol or English 

Dealer.com Setup

Working example: https://www.carsonnissan.com/

**Note:** Notify Weglot support that a DDC site needs the mobile patch they have for coding issues. They should know what to do.

setup:

1. Weglot should be setup for Subdomain instead (might still be set to Subdirectory).

2. Complete DNS CNAME addition into MM from what is listed in Weglot and verify DNS.

3. Add script from Weglot to DDC > Site tools > JSE > Desktop only. 

4. Move switcher into navigation using Settings > Language Switcher > Switcher editor

5. Update flags in Weglot dashboard > Language Switcher > Language Appearance > United States & Mexico Flags

6. Mobile can't use the native Weglot switcher and we need to hide the switcher from displaying on mobile using the following syntax below.

<script>

Weglot.initialize({

   api_key: "YOUR_API_KEY",

   hide_switcher: true

})

</script>

ie..

<!-- weglot translation -->
<link rel="alternate" hreflang="en" href="https://www.carsonnissan.com">
<link rel="alternate" hreflang="es" href="https://es.carsonnissan.com">
<script type="text/javascript" src="https://cdn.weglot.com/weglot.min.js"></script>
<script>
Weglot.initialize({
api_key: 'wg_c3cc416c3d34552a8ff3684c4f7ebf0c5',
hide_switcher: true
});
</script>

7. Custom add mobile nav items in DDC that point to Español > es.domain.com & English to the default page URL

DealerOn Setup

setup:

Working examples: 

https://www.bellroadtoyota.com/

https://www.dchacademyhonda.com/

Build out desktop and mobile you have to duplicate switcher and set the CSS.   Settings > Language Switcher > Switcher editor

Desktop:

#menubar

Mobile:

#nav-sidebar ul.navbar-nav

The script is found at Setup > JS Code. Add that script to the website

Copy settings from Language Switcher > Switcher advanced options > CUSTOM CSS from the existing working weglot config to your new config

Copy settings from Language Switcher > Switcher appearance and position > [Click] Switcher Editor
    - Note that there are two switchers, one is for desktop and the other is for mobile, and you need to set up both.

Team Velocity Setup

Work in progress

setup:

1. Weglot should be setup for Subdomain instead (might still be set to Subdirectory).

2. Complete DNS CNAME addition into MM from what is listed in Weglot and verify DNS.

3. Add script from Weglot to TeamV Website Settings > Scripts

Note - We can't move the switcher into headers and will be left in the default spot, see SS below.

Weglot documentation:

You, indeed, need to create your own menu items for the languages, if you'd like the language switcher to always perfectly fit with the website specific theme's design.
In this case, the solutions I proposed can work:

1. You can create your navigation items for the languages with the default process you've followed.
Here, the original link related to the original language will automatically be replaced with the translated URL.
The solution here will be to exclude from translation the menu item related to the original language.

Here, you'll just need to find the CSS selector of the menu item related to the original language.
Reminder:
To find the CSS selector:
- Right-click on the element you want to exclude
- Go to "Inspect"
- Use the arrow on the top left of the console
- Click on the element you want to exclude
- Copy the class or the id of this element.
- Go to your Weglot Dashboard > Project Settings (Exclusions) Exclude Blocks field
- Paste the class (add a dot before the class) or the id (add a # before the id) in the tiny box, then click on "Add"
- Save your changes

I'm pleased to send you the documentation regarding the exclusion with Weglot
See > How to exclude URLs/blocks/words from translation?
 

I can help you further if this step if you want. In this case, could you send me the website URL where you've integrated the language menu items, and where I'll be able to notice the back and forth issue.
I'll make a video to show you how to easily exclude this element from the translation and so fix this undesired behavior.


2. By creating the languages menu items, if you're able to provide them with a specific URL, you'll just need to assign them the URLs below:

For the English link => #Weglot-en
 For the Spanish link => #Weglot-es

Doc => https://developers.weglot.com/javascript/link-hooks

As long as Weglot is installed on your website, these links should automatically well redirect you to the right version, without any extra action to make.