Linkify url and hashtag for linkedin Status and share api

IF you are working with linkedin api and parsing status and share items for any user or company page then this small code will help to parse the status or share text (comes from api) to 1. linkify 2. Tagging 3. Linkify hashtag
Please note that linkedin doesn’t support any native @ handle for it’s own user based but all @ handle are for twitter user.
[code language=”php”]
/**
* Linkify url and hashtag
*
* @param type string $status_text
* @return type string
*/
function linkify_linkedin_status($status_text){

// linkify URLs
$status_text = preg_replace(
‘/(https?:\/\/\S+)/’,
‘<a href="\1">\1</a>’,
$status_text
);

// linkify twitter users
//please note that any thing tagged using @ in linkedin takes to twitter
$status_text = preg_replace(
‘/(^|\s)@(\w+)/’,
‘\1@<a target="_blank" href="http://twitter.com/\2">\2</a>’,
$status_text
);

// linkify hash tags
$status_text = preg_replace(
‘/(^|\s)#(\w+)/’,
‘\1#<a target="_blank" href="http://www.linkedin.com/signal/?keywords=%23\2">\2</a>’,
$status_text
);

return $status_text;
}
[/code]

jQuery TinyScrollbar doesn’t work in hidden container or tab or div : Why ?

Q: jQuery TinyScrollbar doesn’t work in hidden container or tab or div : Why ?

Answer:

I think this is problem  with jquery or as how the DOM works. When any parent div is hidden using css property display:block;  jquery can not determine the width, height etc for any child element (example div)  and this also happens for jquery tinyscrollbar plugin. I wasted almost 4/5 hours to get what the hell is happening as I was trying to add custom scrollbar in a tabber, tab tab tab … pa pa pa. But it was not working for inactive tabs (divs)

Solutions: After debuging jquerytinyscrollbar plugin’s js code I found

for method “update” it had code like

[code language=”javascript”]
oViewport[ options.axis ] = oViewport.obj[0][ ‘offset’+ sSize ];
oContent[ options.axis ] = oContent.obj[0][ ‘scroll’+ sSize ];
[/code]

and for hidden tab those oViewport.obj[0][ ‘offset’+ sSize ] and oContent.obj[0][ ‘scroll’+ sSize ] gives wrong height or width or just 0. So tha scrolling ratio doesn’t work which is calculated just after that like
[code language=”javascript”]
oContent.ratio = oViewport[ options.axis ] / oContent[ options.axis ];
[/code]

What we tried is we used another jquery plugin named jquery Actual which helps to get actual attributes of hidden element.
http://dreamerslab.com/blog/en/get-hidden-elements-width-and-height-with-jquery/

https://github.com/dreamerslab/jquery.actual/blob/master/jquery.actual.js

So add the jquery actual plugin first then include the jquery tinyscrollbar plugin. Now you need to be little brave to modify the jquery tinyscrollbar plugin.
So now update the update method like this

[code language=”javascript”]
oViewport[ options.axis ] = oViewport.obj[0][ ‘offset’+ sSize ];
oContent[ options.axis ] = oContent.obj[0][ ‘scroll’+ sSize ];

sSizecb = sAxis ? ‘width’ : ‘height’;
var oViewportaxis = $(oWrapper).children(‘div.viewport’).actual(sSizecb) ;
var oContentaxis = $(oWrapper).children(‘div.viewport’).children(‘div.overview’).actual(sSizecb) ;

oViewport[ options.axis ] = oViewportaxis;
oContent[ options.axis ] = oContentaxis;

[/code]

Download the full source code from here.

Also while adding tinyscrollbar I used some extra care, for inactive tabs more careeeeeeeeeeee.

Here are more sample codes if that helps ,
Please note that for making the scrollbar compatible with tinyscrollbar we need to add some extra div like “overview”

[code language=”javascript”]
jQuery(document).ready(function(){
//height is asumed 200px
//for scrollbar one, element id scrollbar1
jQuery(‘#scrollbar1’).children().wrapAll(‘<div class="viewport"><div class="overview"></div></div>’);
jQuery(‘#scrollbar1’).prepend(‘<div class="scrollbar"><div class="track"><div class="thumb"><div class="end"></div></div></div></div>’);
jQuery(‘#scrollbar1’).tinyscrollbarcb();

for scrollbar two , element id scrollbar2,
jQuery(‘#scrollbar2’).children().wrapAll(‘<div class="viewport"><div class="overview"></div></div>’);
jQuery(‘#scrollbar2’).prepend(‘<div class="scrollbar"><div class="track"><div class="thumb"><div class="end"></div></div></div></div>’);

jQuery(‘#scrollbar2’).children(‘div.viewport’).css({height:"200px"});
jQuery(‘#scrollbar2’).children(‘div.scrollbar’).css({height:"200px"});

jQuery(‘#scrollbar2’).children(‘div.scrollbar’).children(‘div.track’).css({height:"200px"});
jQuery(‘#scrollbar2’).tinyscrollbarcb();

});
[/code]

Thanks for reading.

āĻ•āĻĒāĻžāϞ ! āϞ⧋āĻ•āϜāύ āϕ⧇āĻŽāύ⧇ āĻŦ⧁āĻāϞ āφāĻŽāĻŋ āĻŦāĻĄāĻŧ āĻŽāύāĻŋāĻĻ⧇āϰ āĻ­āĻŋāĻĄāĻŋāĻ“ āĻĻ⧇āĻ–āĻ›āĻŋ āĻ…āĻŽā§āĻ• āϏāĻžāχāĻŸā§‡ !!

“āĻ•āĻĒāĻžāϞ ! āϞ⧋āĻ•āϜāύ āϕ⧇āĻŽāύ⧇ āĻŦ⧁āĻāϞ āφāĻŽāĻŋ āĻŦāĻĄāĻŧ āĻŽāύāĻŋāĻĻ⧇āϰ āĻ­āĻŋāĻĄāĻŋāĻ“ āĻĻ⧇āĻ–āĻ›āĻŋ āĻ…āĻŽā§āĻ• āϏāĻžāχāĻŸā§‡ !!”  āĻāχ āϰāĻ•āĻŽ āĻ…āύ⧁āĻ­ā§‚āϤāĻŋ āϝ⧇ āĻ•āĻžāϰ⧋ āĻšāϤ⧇ āĻĒāĻžāϰ⧇āĨ¤ āϤāĻŦ⧇ āϕ⧇āύ  āĻāĻŦāĻ‚ āĻ•āĻŋāĻ­āĻžāĻŦ⧇ āĻ…āĻ¨ā§āϝ āϕ⧇āω āĻŦ⧁āĻā§‡ āĻĢ⧇āϞāϛ⧇ āĻĨāϞ⧇āϰ āĻŦāĻŋāĻĄāĻŧāĻžāϞ 🙂 āĻāĻŽāύ āĻĒā§āϰāĻļā§āύ āĻŽāύ⧇ āφāϏāϤ⧇āχ āĻĒāĻžāϰ⧇āĨ¤

āϝāĻžāχ āĻšā§‹āĻ• āĻāϤāĻ•ā§āώāύ āĻŽāϜāĻž āĻ•āϰāĻ›āĻŋāϞāĻžāĻŽāĨ¤ āϤāĻŦ⧇ āϘāϟāύāĻž āĻšāĻšā§āϛ⧇ āĻ…āύ⧇āϕ⧇āχ āĻ…āύ⧇āĻ• āϏāĻžāχāĻŸā§‡ āĻāĻ•āϟāĻž āύāĻŋāωāϜ āĻĒāĻĄāĻŧāϛ⧇ āĻŦāĻž āĻ­āĻŋāĻĄāĻŋāĻ“ āĻĻ⧇āĻ–āϛ⧇ āĻŦāĻž āĻŦā§āϞāĻ— āĻĒāĻĄāĻŧāϛ⧇ āϤāĻž āφāĻŦāĻžāϰ āĻ…āĻ¨ā§āϝ āĻĢ⧇āϏāĻŦ⧁āĻ• āĻŦāĻ¨ā§āϧ⧁āϰāĻž āĻœā§‡āύ⧇ āϝāĻžāĻšā§āϛ⧇āĨ¤ āϝ⧇āĻŽāύ āĻāĻ•āϟāĻž āωāĻĻāĻžāĻšāϰāĻŖ āĻĻ⧇āĻ“āϝāĻŧāĻž āϝāĻžāĻ•āĨ¤ āĻšāĻ āĻžā§Ž āφāĻĒāύāĻžāϰ āĻĢ⧇āϏāĻŦ⧁āϕ⧇āϰ āĻšā§‹āĻŽ āĻĒāĻžāϤāĻžāϝāĻŧ āĻĻ⧇āĻ–āϞ⧇āύ āĻāĻ•āϟāĻž āĻĒā§‹āĻ¸ā§āϟ

“Mr. X watched a video on Dailymotion”

Continue reading

āϏāĻŽā§āĻ­āĻžāĻŦāύāĻžāĻŽāϝāĻŧ āύāϤ⧁āύ āϤāĻŋāύāϟāĻŋ āϏ⧋āĻ¸ā§āϝāĻžāϞ āύ⧇āϟāĻ“āϝāĻŧāĻžāĻ°ā§āĻ•

āĻĢ⧇āϏāĻŦ⧁āĻ• āĻ•āĻŋāĻ‚āĻŦāĻž āϟ⧁āχāϟāĻžāϰ āĻĻā§€āĻ°ā§āϘāĻĻāĻŋāύ āϧāϰ⧇ āϰāĻžāϜāĻ¤ā§āĻŦ āĻ•āϰ⧇ āϝāĻžāĻšā§āϛ⧇ āφāϰ āϏ⧇āχ āϏāĻžāĻĨ⧇ āϗ⧁āĻ—āϞ āĻĒā§āϞāĻžāϏ āĻāϏ⧇ āύāĻŋāĻœā§‡āϰ āĻŦā§āϝāĻ°ā§āĻĨ āĻ…āĻŦāĻ¸ā§āĻĨāĻžāύ āϤ⧈āϰāĻŋāϰ āĻšā§‡āĻ¸ā§āϟāĻž āĻ•āϰ⧇ āϝāĻžāĻšā§āϛ⧇āĨ¤ āĻāϤ⧋āĻĻāĻŋāύ āφāĻŽāϰāĻž āĻāĻ•āϟāĻž āϏ⧋āĻ¸ā§āϝāĻžāϞ āύ⧇āϟāĻ“āϝāĻŧāĻžāĻ°ā§āϕ⧇āχ āĻ•ā§āώ⧁āĻĻā§āϰ/āĻŦāĻĄāĻŧ āĻŦāĻžāĻ°ā§āϤāĻž āĻļ⧇āϝāĻŧāĻžāϰ(āĻ¸ā§āĻŸā§āϝāĻžāϟāĻžāϏ āφāĻĒāĻĄā§‡āϟ), āĻ›āĻŦāĻŋ āĻļ⧇āϝāĻŧāĻžāϰ, āĻ­āĻŋāĻĄāĻŋāĻ“ āĻļ⧇āϝāĻŧāĻžāϰ āχāĻ¤ā§āϝāĻžāĻĻāĻŋ āĻ•āϰāϤāĻžāĻŽ… āϝ⧇āĻŽāύ āĻĢ⧇āϏāĻŦ⧁āϕ⧇ āĻāĻ•āχ āϏāĻžāĻĨ⧇ āĻ¸ā§āĻŸā§āϝāĻžāϟāĻžāϏ āφāĻĒāĻĄā§‡āϟ, āĻ›āĻŦāĻŋ, āĻ“āĻĄāĻŋāĻ“, āĻ­āĻŋāĻĄāĻŋāĻ“, āύ⧋āϟ āϞ⧇āĻ–āĻž, āϗ⧇āĻŽ āϖ⧇āϞāĻžāϏāĻš āĻ…āύ⧇āĻ•āĻ•āĻŋāϛ⧁ āĻ•āϰāĻž āϝāĻžāĻšā§āϛ⧇āĨ¤ āĻ•āĻŋāĻ¨ā§āϤ⧁ āφāĻŽāĻžāϰ āĻŽāύ⧇ āĻšāĻšā§āϛ⧇ āφāĻ—āĻžāĻŽā§€āϤ⧇ āĻāχ āϧāĻžāϰāĻž āĻ…āϚāĻŋāϰ⧇āχ āĻāϞ⧋āĻŽā§‡āϞ⧋ āĻšāϝāĻŧ⧇ āϝāĻžāĻŦ⧇… āĻļ⧁āϰ⧁ āĻšāĻŦ⧇ āĻ›āĻŦāĻŋ āĻļ⧇āϝāĻŧāĻžāϰ āύ⧇āϟāĻ“āϝāĻŧāĻžāĻ°ā§āĻ•, āĻ­āĻŋāĻĄāĻŋāĻ“ āĻļ⧇āϝāĻŧāĻžāϰāĻŋāĻ‚ āύ⧇āϟāĻ“āϝāĻŧāĻžāĻ°ā§āĻ• … āĻāĻ•āϟāĻž āĻŦā§āϝāĻžāĻĒāĻžāϰ āĻšāĻšā§āϛ⧇ āĻāχ āϧāϰāύ⧇āϰ āϏāĻžāχāϟ āĻ•āĻŋāĻ¨ā§āϤ⧁ āφāϛ⧇ āϝ⧇āĻŽāύ āĻĢā§āϞāĻŋāĻ•āĻžāϰ āĻ•āĻŋāĻ‚āĻŦāĻž āχāωāϟāĻŋāωāĻŦ āϤāĻŦ⧇ āĻāĻ–āĻžāύ⧇ āϝāϤāύāĻž āĻŦ⧇āĻļāĻŋ āĻļ⧇āϝāĻŧāĻžāϰ āĻšāϝāĻŧ āϤāĻžāϰ āĻĨ⧇āϕ⧇ āύ⧇āϟāĻ“āϝāĻŧāĻžāĻ°ā§āĻ•āĻŋāĻ‚ āĻŦāĻž āĻĢāϞ⧋āϝāĻŧāĻŋāĻ‚-āĻĢāϞ⧋āϝāĻŧāĻžāϰ āϏāĻŽā§āĻĒāĻ°ā§āĻ• āĻāϰ āϟāĻžāύāĻžāĻĒā§‹āĻĄāĻŧ⧇āύ āύāĻŋāϤāĻžāĻ¨ā§āϤāχ āĻ•āĻŽāχ āĻšāϝāĻŧāĨ¤ āφāϰ āϤāĻžāχ āϖ⧁āĻŦ āĻ•āĻŽ āϏāĻŽāϝāĻŧ⧇ āϤāĻŋāύāϟāĻŋ āϏ⧋āĻ¸ā§āϝāĻžāϞ āύ⧇āϟāĻ“āϝāĻŧāĻžāĻ°ā§āĻ• āύāϤ⧁āύ āĻ•āϰ⧇ āϜāĻžāϝāĻŧāĻ—āĻž āĻ•āϰ⧇ āύāĻŋāĻšā§āϛ⧇ āϝāĻžāϰāĻž āϝāĻĨāĻžāĻ•ā§āϰāĻŽā§‡ āĻ›āĻŦāĻŋ, āĻ­āĻŋāĻĄāĻŋāĻ“ āĻāĻŦāĻ‚ āĻ“āĻĄāĻŋāĻ“ āĻļ⧇āϝāĻŧāĻžāϰāĻŋāĻ‚ āϏ⧋āĻ¸ā§āϝāĻžāϞ āύ⧇āϟāĻ“āϝāĻŧāĻžāĻ°ā§āĻ• …

āĻĒāĻŋāĻ¨ā§āϟāĻžāϰ⧇āĻ¸ā§āϟ(http://pinterest.com/)

āϚāĻŋāϞ(http://chill.com)

āĻĻāĻŋāϜāχāϜāĻŽāĻžāχāĻœā§āϝāĻžāĻŽ(http://www.thisismyjam.com/)

Break long url or word using css to prevent overflow of div container

First of all I am not design expert, not a designer but I learnt many thing about design I mean css, html while working with website projects. Something gave me pain when I found a long url is getting outside of a box(div) in google chrome. After a google search I found a solution… need to use word break though it doesn’t support all browser.

See how a long url go outside of a div box

I found a solution
[code language=”css”]
.box{
white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word;
}
[/code]

thanks

āφāϏ⧁āύ āĻ“āϝāĻŧāĻžāĻ°ā§āĻĄāĻĒā§āϰ⧇āϏ⧇āϰ āĻĄā§āϝāĻžāĻļ āĻŦā§‹āĻ°ā§āĻĄ āĻĒāϰāĻŋāĻ¸ā§āĻ•āĻžāϰ āĻ•āϰāĻŋ

āĻ“āϝāĻŧāĻžāĻ°ā§āĻĄāĻĒā§āϰ⧇āϏ⧇āϰ āĻāĻĄāĻŽāĻŋāύ āĻĒā§āϝāĻžāύ⧇āϞ⧇ āϞāĻ—āĻŋāύ āĻ•āϰāϞ⧇āχ āĻāĻ•āĻ—āĻžāĻĻāĻž āĻŦāĻ•ā§āϏ āĻāϏ⧇ āĻšāĻžāϜāĻŋāϰ āĻšāϝāĻŧāĨ¤ āϝāĻĻāĻŋāĻ“ āĻ¸ā§āĻ•ā§āϰāĻŋāύ āĻ…āĻĒāĻļāύ āĻĨ⧇āϕ⧇ āϏ⧇āϗ⧁āϞ⧋ āϏāĻšāĻœā§‡ āϤāĻžāĻĄāĻŧāĻžāύ⧋ āϝāĻžāϝāĻŧ āĻ•āĻŋāĻ¨ā§āϤ⧁ āϝāĻĻāĻŋ āĻāĻŽāύ āĻšāϝāĻŧ āĻāĻĄāĻŽāĻŋāύ āύāĻŋāĻœā§‡āχ āĻĄā§āϝāĻžāĻļāĻŦā§‹āĻ°ā§āĻĄ āĻĒāϰāĻŋāĻ¸ā§āĻ•āĻžāϰ āĻ•āϰ⧇ āϰ⧇āϖ⧇ āĻĻāĻŋāϞ⧇āύ āύāϤ⧁āύ āϏāĻĻāĻ¸ā§āϝ⧇āϰ āϜāĻ¨ā§āϝāĨ¤ āϤāĻŦ⧇ āĻāχ āĻĒāϰāĻŋāĻ¸ā§āĻ•āĻžāϰ āĻāϰ āĻ•āĻžāϜāϟāĻž āφāĻŽāϰāĻž āĻ•āϰāĻŦā§‹ āϏāĻžāĻŽāĻžāĻ¨ā§āϝ āĻ•āĻŋāϛ⧁ āĻĒāĻŋāĻāχāϚāĻĒāĻŋ āϕ⧋āĻĄāĻŋāĻ‚ āĻ•āϰ⧇āĨ¤

āϧāĻžāĻĒ āĻāĻ•āσ āĻĒā§āϰāĻĨāĻŽā§‡ āφāĻĒāύāĻžāϰ āĻĨā§€āĻŽā§‡āϰ functions.php āĻĢāĻžāχāϞ⧇ āĻ ⧍āϟāĻŋ āĻĢāĻžāĻ‚āĻļāύ āϞāĻŋāĻ–āϤ⧇ āĻšāĻŦ⧇āĨ¤ āĻŽāύ⧇ āϰāĻžāĻ–āĻŦ⧇āύ āĻĒā§āϞāĻžāĻ—āĻŋāύ āĻāϰ āϕ⧋āĻĄāϗ⧁āϞ⧋ āϚāĻžāχāϞ⧇ functions.php āĻĢāĻžāχāϞ⧇āĻ“ āϞ⧇āĻ–āĻž āϝāĻžāϝāĻŧāĨ¤ āϤāĻžāĻšāϞ⧇ āĻļ⧁āϰ⧁ āĻ•āϰāĻž āϝāĻžāĻ•āσ
[code language=”php”]
//Define the function which unsets the boxes
function remove_dashboard_widgets() {
global $wp_meta_boxes;
myprint_r($wp_meta_boxes);
/*
//unset($wp_meta_boxes[‘dashboard’][‘normal’][‘core’][‘dashboard_right_now’]);
# Remove plugins feed
unset($wp_meta_boxes[‘dashboard’][‘normal’][‘core’][‘dashboard_plugins’]);
unset($wp_meta_boxes[‘dashboard’][‘side’][‘core’][‘dashboard_plugins’]);
# Remove "WordPress News"
unset($wp_meta_boxes[‘dashboard’][‘normal’][‘core’][‘dashboard_primary’]);
unset($wp_meta_boxes[‘dashboard’][‘side’][‘core’][‘dashboard_primary’]);
unset($wp_meta_boxes[‘dashboard’][‘normal’][‘core’][‘dashboard_secondary’]);
unset($wp_meta_boxes[‘dashboard’][‘side’][‘core’][‘dashboard_secondary’]);
# Remove incoming links feed
unset($wp_meta_boxes[‘dashboard’][‘normal’][‘core’][‘dashboard_incoming_links’]);
unset($wp_meta_boxes[‘dashboard’][‘side’][‘core’][‘dashboard_incoming_links’]);

unset($wp_meta_boxes[‘dashboard’][‘side’][‘core’][‘dashboard_recent_drafts’]);
unset($wp_meta_boxes[‘dashboard’][‘normal’][‘core’][‘dashboard_recent_comments’]);
unset($wp_meta_boxes[‘dashboard’][‘side’][‘core’][‘dashboard_quick_press’]);
unset($wp_meta_boxes[‘dashboard’][‘normal’][‘core’][‘events_dashboard_window’]);
*/
}
// Now hook in to the action
add_action(‘wp_dashboard_setup’, ‘remove_dashboard_widgets’, 20, 0);

//better print_r function taken from
//http://stackoverflow.com/questions/1386331/php-print-r-nice-table
function myprint_r($my_array) {
if (is_array($my_array)) {
echo "<table border=1 cellspacing=0 cellpadding=3 width=100%>";
echo ‘<tr><td colspan=2 style="background-color:#333333;"><strong><font color=white>ARRAY</font></strong></td></tr>’;
foreach ($my_array as $k => $v) {
echo ‘<tr><td valign="top" style="width:40px;background-color:#F0F0F0;">’;
echo ‘<strong>’ . $k . "</strong></td><td>";
myprint_r($v);
echo "</td></tr>";
}
echo "</table>";
return;
}
echo $my_array;
}

[/code]
Continue reading

Show/Hide comment status text in wordpress

I am again confused if my post title is perfect or not 🙁 So let me explain, sometimes we disable comment for any post or page and at last the text shows “Comments are closed” or something else in different ways. But in commercial projects we need to follow some good design where in some posts or pages we may need to enable comment or not. So, let’s put a trick in theme to show the comment text(comment status in more smart way)

In latest wordpress version the loop is in the loop.php file in the theme folder. So for comment we will get this line

[code language=”php”]
<?php comments_template( ”, true ); ?
[/code]

But how about we put

[code language=”php”]
<?php if($post->comment_status == "open"){comments_template( ”, true );} ?>
[/code]

That means if comment is off then we will not show any text like “Comments are closed” . I strongly believe this trick will make the design clean in some condition 😛

Thank you

How to Insert custom Quicktags into the WordPress Editor

WordPress has two type of editor, one is visual/wysiwyw that is tinymce or replace with other such editors and another is HTML editor that is we call quick tag editor. Today, I want to write something about how to add custom quick tags or custom buttons. I search about it in google and most guides to edit core quick tag javascript file. But I don’t like that and I made my own hack in my own way, though experts may think it’s childish 😛

So let come to point, I wanted to add some buttons that will give me option to add custom class name so that I can format the text well. Same thing can be done via Visual editor but you have to use a plugin named “Tinymce Advanced” which helps to add more advance buttons like styles(class lists) and so on. But for HTML mode or for quick tags editor I didn’t such plugins.
Continue reading