If for some reason you do not want to use the default language switcher you can use your own custom html to design the switcher that you like. 

Once you're happy with you're custom switcher, there is 2 things that you need to:

Step 1: Tell Globallybiz not to translate the text present in the custom html. This will ensure that the text inside your html does not get translated.

To do this, you simply need to add the attribute data-tl-ignore to the outer html element of your custom switcher. So your switcher code may look like this

<!-- Custom Language Switcher -->

        <div data-tl-ignore >

               <div>

                       ...

               <div>

        <div>

<!-- Custom Language Switcher -->

Step 2: Let Globallybiz know which language you're switching to. This will ensure that when you pick a language from your custom switcher, the page will properly be translated.

You simply need add the  data-tl-switch-to attribute for each language that is present in your custom switcher. This attribute expect as the value the 2 letter code representing each language .

You can find the list of language code here

Assuming we have English, French and Spanish and each one is represented by a link tag (<a>), the final html may look like this. You can use any html element for this as long as the attribute is properly set.

<!-- Custom Language Switcher -->

        <div data-tl-ignore >

               <a href="#" data-tl-switch-to="en">English</a

               <a href="#" data-tl-switch-to="fr">French</a>

               <a href="#" data-tl-switch-to="es">Spanish</a>

        <div>

<!-- Custom Language Switcher -->