Detecte Browser Language and Redirect with jQuery
File Size: | 55.2 KB |
---|---|
Views Total: | 5907 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
A simple yet useful jQuery plugin used to direct the visitors to the correct language site based on their browser language.
How to use it:
1. Include jQuery javascript library and the jQuery Language Detection plugin in the document.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script type="text/javascript" src="js/jquery.language.detection.min.js"></script>
2. Initialize the plugin and set the relative or absolute paths for languages folders.
$(document).ready(function() { $(document).languageDetection({ languages : [ { code : 'it', path : '' }, { code : 'en', path : 'en', defaultLanguage : true }, { code : 'fr', path : 'fr' }, { code : 'es', path : 'es' } ] }); });
3. Available options.
$(document).ready(function() { $(document).languageDetection({ // The root of your website (use this option if it is inside a subfolder). domain: window.location.protocol + '//' + window.location.hostname + '/', // Set this option to true if you want to use absolute paths for languages folders (you have to use it if each language is in a different subdomain). useFullPaths: false // An array of objects, one for each language. languages : [ { code : 'it', // The ISO Language Code. path : '' // The relative path to the folder which contains the files for the language. You have to specify the absolute path if you set to true the useFullPaths option. }, { code : 'en', path : 'en', defaultLanguage : true // This must be true for the default language of the website. Users will be redirected to this language if their browser language is not in the languages array. }, { code : 'fr', path : 'fr' }, { code : 'es', path : 'es' } ], // The expiration date of the cookie used to store the user's language preference. It is expressed in days. expires : 10 }); });
This awesome jQuery plugin is developed by danieledesantis. For more Advanced Usages, please check the demo page or visit the official website.