Introduction

tweetParser.js is a lightweight JavaScript library designed to parse text containing Twitter-like content. It automatically converts URLs, usernames, and hashtags into clickable links. With customizable options, it’s easy to tailor its behavior for various use cases. Whether you're using native JavaScript or jQuery, tweetParser.js simplifies text transformation for social media contexts, making it perfect for social network integration, live feeds, and more.

Live Demo

This demo showcases tweetParser.js in action. The text is parsed to turn URLs, @usernames, and #hashtags into clickable links.

RT @gruntjs: #Sass code quality @Guardian, powered by #gruntjs: http://t.co/urYZOC5fpc #Javascript

Google reCAPTCHA! http://www.google.com/recaptcha/intro/index.html … #php #web #www #html

Example tweet of @Github about new #technologies ! see more on https://github.com

Great news! Our Gear Store now has gift cards -- a great idea for friends & family who #lovetheweb! https://gear.mozilla.org/products/gift-card

Parameters

The following table describes each option available in tweetParser.js to customize its functionality:

Parameter Type Default Description
urlClass String tweet_link CSS class used for URLs in the tweet
userClass String tweet_user CSS class used for @user profile URLs in the tweet
hashtagClass String hashtag CSS class used for hashtag URLs in the tweet
target String _blank HTML target attribute for all generated <a> tags
searchWithHashtags Boolean true If true, hashtags link to "x.com/hashtag/"; if false, to "x.com/search?q="
parseUsers Boolean true Enables parsing of @user mentions if set to true
parseUrls Boolean true Enables parsing of URLs if set to true
parseHashtags Boolean true Enables parsing of hashtags if set to true
baseURL String https://x.com Primary domain used for generating new links (e.g., https://x.com or https://twitter.com)
hideUserSymbol Boolean false If true, hides the "@" symbol in displayed usernames
hideProtocol Boolean false If true, hides "https://" or "http://" from the displayed text of URLs, but keeps it in the link

Getting Started

Here’s how to get started using tweetParser.js, either with native JavaScript or with jQuery.


// Basic usage with default options
tweetParser('.tweet');

// With custom parameters
tweetParser('.tweet', {
    urlClass: "tweet_link",
    userClass: "tweet_user",
    hashtagClass: "hashtag",
    target: "_blank",
    searchWithHashtags: true,
    parseUsers: true,
    parseHashtags: true,
    parseUrls: true,
    baseURL: "https://x.com",
    hideUserSymbol: true,
    hideProtocol: true
});

// Note: '.tweet' is your own CSS selector

Using tweetParser.js with jQuery

If jQuery is included in your project, you can use tweetParser.js as a jQuery plugin:


$('.tweet').tweetParser({
    urlClass: "tweet_link",
    userClass: "tweet_user",
    hashtagClass: "hashtag",
    target: "_blank",
    searchWithHashtags: true,
    parseUsers: true,
    parseHashtags: true,
    parseUrls: true,
    baseURL: "https://x.com",
    hideUserSymbol: true,
    hideProtocol: true
});

Star it! Fork it! & Contribute!

tweetParser.js is open-source. Feel free to star it, fork it, or contribute to its development on GitHub!