Blog

May

16

2012

Alternate BG Color Listing & Changing DIV Background Color on Hover using jQuery

Front End Development  Posted by on May 16th, 2012 / 0 comments
Tags:
jquery-front-end-development

Following is the simple solution to make a div’s background color change on mouse over and then change back to the original color on mouse out. I have made available all the php, css and js code for you to first create the listing and then changing the div background color on mouse hover.

Before going into the details, first check the demo below:

Here’s the js code. Just include the jQuery and the hover code in the head of your doc.

 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>  
<script>
$(document).ready(function() {
 
$(".box").hover(function() { // Mouse Enter
  $(this).addClass("bg-hover");
}, function() { // Mouse Leave 
  $(this).removeClass("bg-hover");
});		
 
});
</script>

Here’s is the css:

 
.box{padding:10px;margin-bottom:5px; border: 1px #e6e6fa solid;}
.bg1{	background-color: #f5f5f5;}
.bg2{	background-color: #fffafa;}
.bg-hover{	background-color: #fafae2;}

And here’s the markup with php code, assuming you have a result set of listing, this code will generate the listing with alternative bg color and mouse hover will highlight that div:

 
if(is_array($results)){ 
  $i=0;
foreach($results as $k){
 
    ($i%2)? $bg_class ='bg1':$bg_class ='bg2';
 
	echo '<div class="box '.$bg_class.'">
  "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
      </div>';
     $i++;
	}
 
  }

View Demo in New Window

Hope that helps.

Cheers!

May

03

2012

Get Mutual Friends List via Facebook Graph API PHP SDK

Facebook Apps Development  Posted by on May 3rd, 2012 / 0 comments
Tags: |
facebook-graph-api

Facebook Graph API allows you to do amazing things with lot much code and hassle. For a Facebook app I was developing recently, I needed the list of mutual friends of two app users, to rank those higher who had higher mutual friends count, I wrote following function and worked like a charm. Just create the $facebook object by including the PHP SDK.

 
function get_mutual_friends($facebook, $uid1, $uid2){
    try {
 
        $mutualFriends   =   $facebook->api($uid1.'/mutualfriends/'.$uid2);
        return $mutualFriends;
    }
    catch(Exception $o) {
        print_r($o);
    }
 
    return '';
}
 
 
//call the function like this, of course after you have created $facebook object
 
$mutual_friends = get_mutual_friends($facebook, $friend_id1, $friend_id2);
 
//print all the array data like this
 
print_r($mutual_friends['data']);

Before you try this code, make sure that both of your friends have joined your app for which you are trying to get the list of mutual friends.

Hope that helps.

Cheers!

Apr

23

2012

Force ShareThis shares to count towards Site-wide shares in WordPress

WordPress  Posted by on April 23rd, 2012 / 0 comments
Tags: |
wordpress-sharethis

Recently, I installed ShareThis plugin on a WordPress website (with counters) and I needed to show the count of total likes and shares for that domain but those counters just count for each page separately.

If you want to show the site-wide count of the FB Likes, Google Plus and Tweets in your WordPress Blog, place following code int he header of your theme. You must install ShareThis WordPress plugin for this to work.

Default SharetThis plugin social buttons only shows the count for each page or post.

 
<span class='st_fblike_large' displayText='Facebook Like' st_title='<?php get_bloginfo('name'); ?>' st_url='<?php echo site_url(); ?>'></span>
<span class='st_facebook_large' displayText='Facebook' st_title='<?php get_bloginfo('name'); ?>'  st_url='<?php echo site_url(); ?>'></span>
<span class='st_twitter_large' displayText='Tweet' st_title='<?php get_bloginfo('name'); ?>'  st_url='<?php echo site_url(); ?>'></span>
<span class='st_googleplus_large' displayText='Google +' st_title='<?php get_bloginfo('name'); ?>'  st_url='<?php echo site_url(); ?>'></span>
<span class='st_sharethis_large' displayText='ShareThis' st_title='<?php get_bloginfo('name'); ?>'  st_url='<?php echo site_url(); ?>'></span>
<span class='st_email_large' displayText='Email' st_title='<?php get_bloginfo('name'); ?>'  st_url='<?php echo site_url(); ?>'></span>

Hope that helps.

Cheers!

Apr

18

2012

Remove WordPress Plugin ShareThis Social Icons from Specific Custom Post Types

WordPress  Posted by on April 18th, 2012 / 0 comments
Tags: |
wordpress-sharethis

“ShareThis” is a great WordPress plugin for adding social links to your Posts and pages. ShareThis plugin seamlessly enables users to share your content through Email,Facebook,Twitter, Google +1, Like, Send and many more.

This plugin works well but adds the social shortcuts to every page, post, excerpt and custom post type that you have in your WordPress website. Obviously, there are cases when you do not want it on every page. In the settings panel, there’s just option of removing it from Page and post. Given that Plugin has been downloaded nearly million times now, lack of options to exclude it from appearing on Custom posts types and from soem posts by id is surprising.

One way of removing ShareThis from unwanted Posts is to exclude those Custom Posts types like this:

Find This:

function st_add_widget($content) {
 
if ((is_page() && get_option('st_add_to_page') != 'no') || (!is_page() && get_option('st_add_to_content') != 'no')) {
 
		if (!is_feed()) {
			return $content.'<p>'.st_makeEntries().'</p>';
		}
	}
 
	return $content;
}

Replace with:

 
function st_add_widget($content) {
	global $post;	
$post_type = get_post_type( $post->ID );
 
$exclude_cpt = array('forum','topic','reply','static_block');
 
	if ((is_page() && get_option('st_add_to_page') != 'no') || (!is_page() && get_option('st_add_to_content') != 'no')) {
 
		if (!is_feed() && !in_array($post_type,$exclude_cpt)) {
			return $content.'<p>'.st_makeEntries().'</p>';
		}
	}
 
	return $content;
}

To exclude your specific custom post type. you can define them in the $exclude_cpt = array(‘forum’,'topic’,'reply’,'static_block’);

Hope that helps.

Cheers!

Apr

02

2012

Calculating MySQL Age from Date of Birth Column and Selecting Records Between Age Range

Facebook Apps Development  Posted by on April 2nd, 2012 / 0 comments
Tags:
facebook-graph-api

While developing a Facebook Dating app recently, I needed to return records for a date range between minimum and maximum age from users table but the data was in the date format (birthday).

Following select command will calculate the age from the `birthday` column value for you for each record:

 
SELECT EXTRACT(YEAR FROM (FROM_DAYS(DATEDIFF(NOW(),`birthday`))))+0 AS age FROM `table`

And if you have to use it in the SELECT statement, then do it like this in yuor select command where `birthday` is the column name for date:

 
SELECT * FROM `table` WHERE EXTRACT(YEAR FROM (FROM_DAYS(DATEDIFF(NOW(),`birthday`))))+0 BETWEEN '18' AND '25'

Hope that helps.

Cheers.

Mar

16

2012

Send New Topic Email Notifications to Every User for Mingle Forum Plugin v 1.0.33

WordPress  Posted by on March 16th, 2012 / 0 comments
Tags:
mingle-forum-update

Mingle Forum is very useful WordPress Plugin that allows you to quickly put a Forum on your WordPress site/blog.

Email notifications in Mingle Forums is one area which needs improvement. Earlier for a previous version, I had posted a hack so that every member could get email notifications for any new topic started by any user here. Since then, plugin has been updated and old hack no longer works for the Plugin ver 1.0.33.

For the current Mingle Forum Plugin ver 1.0.33, I made few changes in the wpf.php file made it to work like this:

Open wp-content/plugins/mingle-forum/wpf.php

Find:

 
function notify_forum_subscribers($thread_id, $subject, $content, $date, $forum_id)
	{
		global $user_ID;
		$submitter_name = (!$user_ID)?"Guest":$this->get_userdata($user_ID, $this->options['forum_display_name']);
		$submitter_email = (!$user_ID)?"guest@nosite.com":$this->get_userdata($user_ID, 'user_email');
		$sender = get_bloginfo("name");
		$to = get_option("mf_forum_subscribers_".$forum_id, array());
		$subject =	__("Forum post - ", "mingleforum").$subject;
		$message =	__("DETAILS:", "mingleforum")."<br/><br/>".
					__("Name:", "mingleforum")." ".$submitter_name."<br/>".
//					__("Email:", "mingleforum")." ".$submitter_email."<br/>".
					__("Date:", "mingleforum")." ".$this->format_date($date)."<br/>".
					__("Reply Content:", "mingleforum")."<br/>".$content."<br/><br/>".
					__("View Post Here:", "mingleforum")." ".$this->get_threadlink($thread_id);
		$headers =	"MIME-Version: 1.0\r\n".
					"From: ".$sender." "."<".get_bloginfo("admin_email").">\r\n".
					"Content-Type: text/HTML; charset=\"".get_option('blog_charset')."\"\r\n".
					"BCC: ".implode(",", $to)."\r\n";
			if(!empty($to))
				wp_mail("", $subject, make_clickable(convert_smilies(wpautop($this->output_filter(stripslashes($message))))), $headers);
	}

Replace with following:

 
function notify_forum_subscribers($thread_id, $subject, $content, $date, $forum_id)
	{
		global $user_ID, $wpdb;
		$submitter_name = (!$user_ID)?"Guest":$this->get_userdata($user_ID, $this->options['forum_display_name']);
		$submitter_email = (!$user_ID)?"guest@nosite.com":$this->get_userdata($user_ID, 'user_email');
		$sender = get_bloginfo("name");
		$users = $wpdb->get_results("SELECT user_email FROM {$wpdb->users} ORDER BY user_login ASC");
		foreach($users as $u) $to[] = $u->user_email;
		$subject =	__("Forum post - ", "mingleforum").$subject;
		$message =	__("DETAILS:", "mingleforum")."<br/><br/>".
					__("Name:", "mingleforum")." ".$submitter_name."<br/>".
//					__("Email:", "mingleforum")." ".$submitter_email."<br/>".
					__("Date:", "mingleforum")." ".$this->format_date($date)."<br/>".
					__("Reply Content:", "mingleforum")."<br/>".$content."<br/><br/>".
					__("View Post Here:", "mingleforum")." ".$this->get_threadlink($thread_id);
		$headers =	"MIME-Version: 1.0\r\n".
					"From: ".$sender." "."<".get_bloginfo("admin_email").">\r\n".
					"Content-Type: text/HTML; charset=\"".get_option('blog_charset')."\"\r\n".
					"BCC: ".implode(",", $to)."\r\n";
			if(!empty($to))
				wp_mail("", $subject, make_clickable(convert_smilies(wpautop($this->output_filter(stripslashes($message))))), $headers);
	}

This change will start sending new topic email notifications to every member of your website.

Hope that helps.

Cheers!

Mar

03

2012

Resolve Facebook iFrame Canvas Apps Sessions Problem in IE8

Facebook Apps Development  Posted by on March 3rd, 2012 / 0 comments
Tags: | |
facebook-apps-ie

While developing an iFrame Canvas Facebook app recently, I found out that FB iFrame app’s session did not work quite expectantly in IE8. Firefox, Chrome, Safari, Opera all worked as expected but IE8 block access to cookies.

After spending some minutes Googling, I found out that IE8 restricts the access to cookies, known as 3rd party cookies, under some conditions (Default IE config). and this issue is not specific to Facebook, but iFrames. Since the iFrame was loading a web page from a different domain, IE8′s default settings prevented loading of 3rd party cookies and to maintain session state, the page issues a session cookie which is stored in the client. If your iFrame webpage or app uses session then it has to be allowed by the browser to store the cookie. In case of IE8, it fails to store the cookie which means session will be lost.

Alright, enough theory.. So what’s the solution?

Add this code at the top of your php page:

 
   header('p3p: CP="NOI ADM DEV PSAi COM NAV OUR OTR STP IND DEM"');

By adding this P3P Compact Privacy Policy header to your page will make IE to accept cookies from different domains.

Hope that helps.

Feb

29

2012

UBL Omni osCommerce Payment Module

osCommerce  Posted by on February 29th, 2012 / 0 comments
Tags:
ubl-omni-oscommerce

Last year I developed a payment module for osCommerce for Telenor’s EasyPaisa Mobile Money transfer. Since then, I was peppered with requests to develop a similar module for UBL Omni osCommerce payment module using Dukaans.

Finally last month, I found some time and developed UBL Omni payment module for osCommerce stores. This mod works in following way.

Your website shows the following information on the checkout_confirmation.php page:

1. City where customer needs to send money
2. Receiver (Your) CNIC number
3. Amount
4. It shows UBL Dukaan locator link underneath from where customer can send money.
5. Once order is received, you can send customer the email for the 16 digit reference number that you need to get payment from OMNI Dukaan.

Following are the admin panel and store front-end screens for this payment mod.

This mod can be tested here on demo store. So contact me whomever needs this mod for his website. I will provide this payment module for a price. Once I have recovered the development cost of the mod, I will eventually release it on the osCommerce website just like my previous modules and add-ons.

Cheers!

Feb

25

2012

Nivo Slider as Image Slider Add-on for osCommerce Store

osCommerce  Posted by on February 25th, 2012 / 0 comments
Tags: |
osCommerce-slideshow

Last year I developed and released an image slider add-on for osCommerce which used Easy Slider as image slider.

It turned out to be very useful add-on for community and I have removed few bugs since then. Many users asked for features such as multi-lingual support in the slider, Nivo Slider jQuery plugin as front end slider. I have combined all the feature requests into new version of the Slider, but this not a free add-on.

This osCommerce-Slider add-on will add a slideshow in your osCommerce 2.3.1 store and will add a section inside your osCommerce Admin panel under Catalog > Slideshow to manage and add slides. It will also add slider configuration panel under Configuration>Slideshow. Slider configuration panel allows you to set several parameters of Nivo Slider from the admin panel.

Jan

30

2012

Is your Redmine running very slow? Shift to Mongrel from Webrick

Project Management  Posted by on January 30th, 2012 / 0 comments
Tags: | |

Some time back, we had installed Redmine a project management web application built in Rails on our server. It worked smoothly for a while but then it started getting slower. In the last few days, it slowed down to the extent that it took ages (over a minute) to load any page.

First I thought it might be due to load on server but it wa snot the cause, After some research on Redmine website, I successfully resolved the issue by changing the web server from Webrick to Mongrel.

Earlier, we were using the webrick server by starting it like this:

 
root@server [~]# cd to redmine directory
root@server [/home/rails_apps/redmine]#ruby script/server webrick -e production -d

Here’s how you can resolve by running mongrel:

 
root@server [~]# cd to redmine directory
root@server [/home/rails_apps/redmine]#mongrel_rails start --environment=production -d

As soon as you shift to mongrel, you will see the Redmine running even better than before it got slow. Just make sure you add the ‘-d’ detachment parameter at the end otherwise it will stop the server if you would exit the shell.

Hope that helps.

Cheers!