Skip to content

Offer a translation system to your users! a plugin capable of translating your website, simply and efficiently!

License

Notifications You must be signed in to change notification settings

eduhcastro/TranslateForMe

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

10 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation


Logo

TranslateForMe

Offer a translation system to your users, a plugin capable of translating your website, simply and efficiently!

View Demo · Report Bug · Request Feature

About The Project

A little about:

  • I looked a lot about some plugin that did the same function but I couldn't find it, so I decided to do my own!
  • All tags and classes were created with random names, not to affect your site and its styles.
  • The project was structured entirely with pure javascript, only Google translate is instantiated

Comum area

Usage

Add a script section with attribute "translate="forme""

Example:

<script translate="forme" src="translateforme.google.js"></script>

This attribute is mandatory for the plugin to work.

Launch the plugin

<script>
document.addEventListener('DOMContentLoaded', function () {
      new TranslateForMe.init({
        languages: ['en', 'pt'],
        saveLanguage: true,
        fonts: true
      });
    });
</script>

To work properly, instantiate the class only after the DOM is loaded.

API

init([options])

<script translate="forme" src="translateforme.google.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function () {
      new TranslateForMe.init({
        languages: ['en', 'pt'],
        saveLanguage: true,
        fonts: true
      });
    });
</script>

Options:

  • languages

    Type: Array[]
    Default: ['all languages ​​available']

    Languages that will be added in the menu List

  • saveLanguage

    Type: Boolean
    Default: false

    Enables the save language mode, if activated, create a checkbox in the menu, if true, all pages will be translated according to the selected language.

  • fonts

    Type: Boolean
    Default: true

    If true, load Open Sans font style, for better menu look. (If it already exists, it will not be loaded.)

More

languages: ["en","pt","bn","zh-CN","zh-TW","es","fr","ja","ru"] More languages will be added soon.

Developer area

Built With

For development mode, here is a list of used frameworks/libraries

Google translator was not included due to being an external module

Starting

Install all modules.

  • npm
    npm install

Commands

  • Build

    npm run build
    
    Output:
    > translateforme@version build
    > npx tsc && npx ts-node src/addons/csso.ts && npx ts-node src/addons/json.ts

    All files will be created in the ./build folder

  • Json

     npm run json
     
     Output:
     > translateforme@version json
     > npx ts-node src/addons/json.ts

    It will create a minified version of the translateforme.flags.json file, found in ./build

  • Csso

     npm run csso
     
     Output:
     > translateforme@version csso
     > npx ts-node src/addons/csso.ts

    It will create a minified version of the translateforme.google.css file, found in ./build

...

Sorry for the little information, soon add more details about each function of the script.

Contact

Eduardo Castro - eduh.castro19@gmail.com

About

Offer a translation system to your users! a plugin capable of translating your website, simply and efficiently!

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published