Google Translate can be embedded into a website as an inline translation tool. Doing so allows website maintainers to use the service to provide automatic translation of their content into different languages. Google Translate's integration into a web site uses properly formed Cascading Style Sheets and DOM elements to position the translation output into your own website's design. CSS lets you easily change the colour of the results.
- Skill level:
Other People Are Reading
Things you need
- Text editor or CSS editor
Start your text editor or CSS editor.
Download the CSS document for your website as a local copy. A CSS file is a text file and will have the extension ".css." Open the file in your CSS editor.
Search for the element "goog-te-gadget," and then look for the "colour" property underneath it. The colour will either be listed as a six-digit hexadecimal value, or as a standard colour name. Enter the value for the new colour you want the translation results to appear in. Some CSS editors will refer to that part of the CSS file as a "class name," which is a more technically correct term.
Save the CSS file.
Make a copy of your original CSS file on your server and put it in a backup directory.
Upload your new CSS file to your server and reload the page. You may need to check other "goog" elements in the CSS file to get exactly the results you want, so this may take a few tries.
- 20 of the funniest online reviews ever
- 14 Biggest lies people tell in online dating sites
- Hilarious things Google thinks you're trying to search for