jQuery Plugin To Open External Links In A New Window / Tab - exLink
File Size: | 11.6 KB |
---|---|
Views Total: | 808 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

exLink is a simle, heavily customizable jQuery plugin which allows to open external links of your webpage in a new window (or new tab) with a confirmation dialog which verifies whether the user really wants to go to the external site before directing.
Key Features:
- Custom protocol filters: http, https, ftp, ftps, etc.
- Custom file type filters: pdf, doc, xls, etc.
- Auto add 'rel=nofollow' attribute to external links.
- Custom confirm dialog styles & text.
- Callback functions.
Basic usage:
1. To get started you first need to include the exLink jQuery plugin after jQuery JavaScript library.
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script> <script src="jquery.exLink.js"></script>
2. Then include the jquery.exLink.css in the head section for default confirm dialog styles.
<link href="jquery.exLink.css" rel="stylesheet">
3. Call the function and you're done.
$.fn.exLink();
4. Config the plugin.
// Specify specific protocols you would like to catch. protocols: ['http', 'https'], // Specify specific file types you would like to catch. filetypes: ['pdf', 'xls', 'docx', 'doc', 'ppt', 'pptx'], // Identify external links based on a hostname comparison hostCompare: false, // Add nofollow attribute to external links noFollow: false, // Enables pages to still use the popular Fancy Box plugin to open content in modal dialogs without opening in a new tab as well. // Requires fancybox jQuery plugin fancyBoxIgnore: true, // Execute a function each time an external link has been clicked linkCallback: null, // Execute a function each time a document link has been clicked fileCallback: null, // Enables a Google Analytics event to trigger when any of the links are clicked gaTracking: false, // Customize the event label gaTrackLabel: 'External Links', // Use the classic version of Google Analytcis gaTrackOld: false, // Display a confirm dialog linkWarning: true, // Warning text linkWarningBody: 'You are about to leave this website and navigate to the link below. Would you like to continue?', // File type warning fileWarning: true, // Warning text fileWarningBody: 'You are about to open the file below. Do you wish to continue?', // Customize confirm dialog dialogConfirm: '#006600', dialogCancel: '#CC0000', dialogConfirmText: '#fff', dialogCancelText: '#fff', dialogCancelButton: 'Cancel', dialogConfirmButton: 'Continue', modalDisplayBG: true, modalWidth: "320px", modalHeight: "240px", // Change the color of all external links identified externalColor: '', // Change the color of all document links identified. documentColor: '', // Change the color of all external and document links that have been clicked. clickedColor: '', // forces all external links and documents to open in a new window newWindow: false, // The width of the new window widthWindow: "500", // The height of the new window heightWindow: "400;", // The title of the window titleWindow: 'My Window Title'
Change log:
2015-11-21
- Deprecated exLink.init("re")
This awesome jQuery plugin is developed by YupItsZac. For more Advanced Usages, please check the demo page or visit the official website.