Thursday, December 3, 2015

Tweet selection popup and how to do it 3 ways.

Highlight Text Make a Tweet.

Have you ever been on a website and highlighted some text because you wanted to use it with your carryover post to social media?  

One of our clients was doing just that when they noticed the Twitter bird pop-up over the highlighted text and wanted to know how their website could start to use this fantastic capability. Basically the idea is to to get any text the user has selected, then populate it into a new tweet window, as a parameter adding the pape URL. 

If you have questions about using any social media DM us on Twitter or email us hastatus llc at gmail dot com.  And here are a couple of ways of doing this and you'll have to choose the best one for your current website deployment.  


1st is Java Scrip 

function getSelectionText() {
var text = "";
if (window.getSelection) {
    text = window.getSelection().toString();
} else if (document.selection && document.selection.type != "Control") {
    text = document.selection.createRange().text;
return text;
$(document).ready(function () {
$('div,p').mouseup(function (e) {
    if (getSelectionText() != "") {''+encodeURI(getSelectionText()) + '&url=' + encodeURI(document.URL));

2nd is Twitter Cards

popup" data-share="twitter" data-text="nnials were going in many respects,” explained author and generational the" style="top: 1541.14px; left: 410px;">

3rd is WP Plug-in

WP Selected Text Sharer
This plugin allows to share/search selected text of the site. Users can tweet,email,digg(+96 sites) selected text. Increases site usage and sharing
WP Selected Text Sharer is a plugin, which allows to share or search the selected texts / words of yout site. A small popup is displayed above the selected text which contains links to share / search selected text.
This plugin requires a 4 kb jQuery plugin or 5 kb Javascript to display the the popup containing the share/search sites.

No comments:

Post a Comment