June 30, 20108 Comments

It’s just a simple fanbox widget as wordpress plugin, nothing to explain. But I made my own version ?

Features

  • iframe method
  • auto detect ie(internet explorer), because sometimes it’s make problem for ie and option to use as iframe only for ie !
  • jquery based document ready facebook load ! Not clear ? see bellow

One thing to note that I used a way to load the facebook js script after loading jquery as normally in wordpress site front end we use jquery and many plugin uses this… so we can take that jquery is using default. So I loaded the fb js using wp_enqueue function and then called the fb init function after the document is loaded using jquery dom ready function :P … It’s just an experiment about slow loading of facebook fanbox widget in wordpress :D

Download

  Facebook Fanbox wordpress widget (2.9 KiB, 67 hits)


If you just download with no comment and no recommendation to others, then I am planning to hate you :P
Man at least share in social network and give me traffic so that I can have more money from ads :(

Good morning. It’s just morning after working whole night and I am feeling too hungry :)

Code Example

	function widget( $args, $instance ) {
		extract( $args );
                 global $is_lynx, $is_gecko, $is_IE, $is_opera, $is_NS4, $is_safari, $is_chrome, $is_iphone;
		/* Our variables from the widget settings. */
		$title          = apply_filters('widget_title', $instance['title'] );
		$profileid      = $instance['profileid']; //name or profile id , not both
		$apikey         = isset( $instance['apikey'])? $instance['apikey'] : '';
                $stream         = isset( $instance['stream'] ) ? $instance['stream'] : 0;
                $connections    = isset( $instance['connections'] )? (($instance['connections'] > 100)? 100: intval($instance['connections'])): 10; //Specifying 0 hides the list of fans in the Fan Box. You cannot display more than 100 fans. (Default value is 10 connections.)
                $width          = isset( $instance['width'] )? (($instance['width'] < 200)? 200: intval($instance['width'])): 300; // at least 200 pixels wide at minimum. (Default value is 300 pixels.)
                $height         = isset( $instance['height'] )? $instance['height']: 554;
                $css            = isset( $instance['css']) ? $instace['css']:'';
                $logobar        = isset( $instance['logobar'] ) ? $instance['logobar'] : 1;
                $iframe         = isset( $instance['iframe'])? $instance['iframe'] : 0;
                $locale         = isset( $instance['locale'])? $instance['locale']: 'en_US';
                $iframeie       = isset( $instance['iframeie'] ) ? $instance['iframeie'] : 1; // use iframe for ie , auto detect
                $usejquery     = isset( $instance['usejquery'] ) ? $instance['usejquery'] : 1;
		/* Before widget (defined by themes). */
                //var_dump($iframe);
		echo $before_widget;
		/* Display the widget title if one was input (before and after defined by themes). */
		if ( $title )
                {
                    echo $before_title . $title . $after_title;
                }
                if(($is_IE && $iframeie) || $iframe || $apikey == '')
                {
                    //echo 'yes';
                    echo '<iframe scrolling="no" frameborder="0" src="http://www.facebook.com/connect/connect.php?id='.$profileid.'&amp;stream='.$stream.'&amp;connections='.$connections.'&amp;logobar='.$logo.'&amp;css='.$css.'?'.mktime().'" style="border: none; width: '.$width.'px; height:'.$height.'px;">&nbsp;</iframe>';
                }
                else
                {
                    if($usejquery)
                    {
                        wp_enqueue_script('fbjs', 'http://static.ak.connect.facebook.com/connect.php/en_US', array('jquery'), null);
                        echo '<fb:fan profile_id="'.$profileid.'" width="'.$width.'" connections="'.$connections.'" stream="'.$stream.'" header="'.$logobar.'"></fb:fan>';
                        echo '<script type="text/javascript">jQuery(document).ready(function() {
                                FB.init("'.$apikey.'");
                                });</script>';
                    }
                    else
                    {
                            echo '<script type="text/javascript" src="http://static.ak.connect.facebook.com/connect.php/en_US"></script>';
                            echo '<script type="text/javascript"> FB.init("'.$apikey.'"); </script>';
                    }
                }
		/* After widget (defined by themes). */
		echo $after_widget;
	}
March 22, 20101 Comment

To know about what is thickbox please check this link. WordPress use this a main popup window or modal view. Thickbox is a jquery plugin and it’s available with wordpress with jquery. So my tips is how to use that in front end , using the thickbox available with it, no need to use externally.

ThickBox is a webpage UI dialog widget written in JavaScript on top of the jQuery library. Its function is to show a single image, multiple images, inline content, iframed content, or content served through AJAX in a hybrid modal.

At first let me tell you where you can get it if u search wordpress directory manually. Just check in wp-includes\js where you will get all the js library and plugins used with wordpress or available for use with plugin and theme. And here is every thing you need for thickbox
wp-includes\js\thickbox
…continue reading Using wordpress native thickbox

October 26, 20093 Comments

newstickerLet me clear first about what is Slick RSS

Slick RSS is a joomla module that Parse and Display RSS Feed News with DHTML Teaser Tooltip. For details pls visit this link.

ok , let me tell what I am going to do next. That module is great to show rss feed from another site and I want to use it as a news ticker and it can be named as rss news ticker. ok then let’s make it done.

I am going to use js library jQuery and it’s plugin BBCNewsTicker. Please download latest version of jquery and that plugin this the given link.

Now, install the module Slick RSS in your joomla site and publish in any module position. Now I am going to make little change in the module code so that it can be configured for newsticker.

open the file default.php from modules\mod_slick_rss\tmpl and check link near 39

…continue reading RSS news ticker using jquery and Slick RSS module in joomla

July 27, 20083 Comments

I was trying to detect browser version and browser name using java script. I got so many techniques but I am happy with jquery’s one. It’s pretty simple and small block of code. Just check the bellow code that I got from jquery. As it is not possible to use the whole js library all the time but I like to use some part of it or follow the techniques for cross browser tasks. :D

//Detect browser version
var userAgent = navigator.userAgent.toLowerCase();
// Figure out what browser is being used
var browser = {
version: (userAgent.match( /.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/ ) || [])[1],
safari: /webkit/.test( userAgent ),
opera: /opera/.test( userAgent ),
msie: /msie/.test( userAgent ) && !/opera/.test( userAgent ),
mozilla: /mozilla/.test( userAgent ) && !/(compatible|webkit)/.test( userAgent )
};
alert('Browser Version='+browser.version.toString()+ ' Safari='+(browser.safari? 'Yes': 'No')+' Opera='+(browser.opera? 'Yes': 'No')+' IE='+(browser.msie? 'Yes': 'No')+' FF='+(browser.mozilla? 'Yes': 'No'));
//end browser detection

Edit: Here one thing you may be confused about the test() method. It’s a builtin function in js. The test() method is used to search for a match of a regular expression in a string.

Here’s some links about Test();

  1. Email Address valiadtion
  2. W3 school link
  • Go to top
    Go to top
feedback