Convert Plain Text URL Into Hyperlink - jQuery Feedify

File Size: 4.17 KB
Views Total: 157
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Convert Plain Text URL Into Hyperlink - jQuery Feedify

Feedify is a tiny and fast Text To Link converter that automatically transforms plain text URLs into hyperlinks. Supports regular links (http, https, ftp, etc.), Twitter @username, Twitter #hashtags, and email addresses.

In addition, the plugin also has the ability to encode and escape unsafe characters (like <, >, ", ', &, etc.) to prevent XSS attacks.

See Also:

How to use it:

1. Download and load the jQuery.feedify.js after jQuery.

<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="/path/to/jQuery.feedify.js"></script>

2. Initialize the Feediy on the target text.

<!-- Output -->
Hi my twitter account is <a href="http://twitter.com/#!/jqueryscript">@jqueryscript</a>. 

I wrote <a href="http://twitter.com/#!/search?q=%23jQuery">#jQuery</a> articles on <a href="https://www.jqueryscript.net">https://www.jqueryscript.net</a>

Contact me at <a href="mailto:[email protected]">[email protected]</a>

This below script is not going to execute because of encoding

&lt;script&gt;alert('hello');&lt;/script&gt;

3. Add your own text pattern using regex.

lt : {
  regex : /(<)/g,
  template : '&lt;'
},
gt : {
  regex : /(>)/g,
  template : '&gt;'
},
dq : {
  regex : /(")/g,
  template : '&quot;'
},
sq : {
  regex : /(')/g,
  template : '&#x27;'
},
link : {
  regex : /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig,
  template : "<a href=\"$1\">$1</a>"
},
user : {
  regex : /((?:^|[^a-zA-Z0-9_!#$%&*@@]|RT:?))([@@])([a-zA-Z0-9_]{1,20})(\/[a-zA-Z][a-zA-Z0-9_-]{0,24})?/g,
  template : '$1<a href="http://twitter.com/#!/$3$4">@$3$4</a>'
},
hash : {
  regex : /(^|\s)#(\w+)/g,
  template : '$1<a href="http://twitter.com/#!/search?q=%23$2">#$2</a>'
},
email : {
  regex : /([a-zA-Z0-9._-]+@[a-zA-Z0-9._-]+\.[a-zA-Z0-9._-]+)/gi,
  template : '<a href=\"mailto:$1\">$1</a>'
}

This awesome jQuery plugin is developed by SodhanaLibrary. For more Advanced Usages, please check the demo page or visit the official website.