Google translation widgets can be used as a tool to quickly and easily translate your website into different languages. These instructions will show you how to add a Google translate widget to the top navigation of your site.
1. Begin by going to Google’s website translation tools.
2. Follow the directions to configure your widget and choose your translation languages. You will be given a code snippet for embedding into your NationBuilder site.
3. Return to your control panel. Create a custom theme, if you have not already.
When creating your new theme, select the option to clone your current theme. You should also check the checkbox labelled “Switch site to your new site theme immediately.”
4. Now that you have created your custom theme go to Theme > Current Custom theme > Templates. This is where you will find a list of all your website's .html files. Locate “_nav.html” and click on the blue link.
5. In the “_nav.html” template find:
<ul id="topnav" class="topnav desktop-nav">
6. Copy the snippet provided from Google. Paste it below the <ul> tag you just found.
7. To ensure the widget displays properly, add the following style attribute to the first line.
Add this: style="display:inline-block;"
To this: <div id="google_translate_element">
Once it is included it should look like this:
8. Click .
The widget should now appear in the top navigation of your site. To add the widget to a different area of your site, find the appropriate file under Theme > Current Custom theme > Templates and follow the same instructions.