Archive for March, 2009

Add cancel button in your Drupal form

You can add the Cancel button or Cancel link in your Drupal form so you can cancel the form and go back previous page.

Code:-

<?php
$form['submit'] = array(#type’ => ’submit’,
#value’ => t(’Submit’),
);
$form['cancel'] = array(#type’ => ‘markup’,
#value’ => l(t(’Cancel’), ‘category’),
);
?>

This code add a “Cancel” link after “Submit” button.

,

3 Comments


Display menu or tab according to nodetype in Drupal

Sometime your wan’t to display menus and tabs in drupal as per the nodetype. For example, you want “Images” tab in case of nodetype “Hotel” but not want this when story or page nodetype is viewed. In drupal 6.x, the menu system is changed a lot.

Drupal 6.x Code:

<?php
$items['node/%hotel_node/images'] = array(
	‘title’ => ‘Images’,
	‘type’ => MENU_LOCAL_TASK,
	‘weight’ => -10,
	‘page callback’ => ’show_tab_page’,
        ‘page arguments’ => array(1,’images’),
        ‘access callback’ => TRUE,
        ‘access arguments’ => array(1),
);
 
function hotel_node_load($nid) {
	if (is_numeric($nid)) {
		$node = node_load($nid);
        if ($node->type == ‘hotel’) {
            return $node;
        }
    }
	return FALSE;
}
?>

Here, when the menu system is build its call “hotel_node_load()” function with “$nid” as function parameter. We will check the type of node and if the current node type is “hotel” we will return currently loaded node. Otherwise we will return FALSE. This way only node having type “hotel” will display “Images” tab.

Drupal 5.x code:

In drupal 5.x we can do same thing like this.

<?php
	if (arg(0) == ‘node’ && is_numeric(arg(1))) {
		$node = node_load(arg(1));
		if ($node->type == ‘hotel’) {
			$items[] = array(
            	’path’ => ‘node/. arg(1),
                ‘title’ => t(’Images’),
                ‘callback’ => ’show_tab_page’,
                ‘callback arguments’ => array($node),
                ‘access’ => node_access(’view’, $node),
                ‘type’ => MENU_CALLBACK);
		}
	}
?>

For more information click here

,

12 Comments


Dynamic progress bar or status bar using GD library

Sometime you need to show dynamic progress bars or status bars to users. You can create them using GD Library. I am showing here how you can create such kind of bars.

Dynamic bars using GD Library in PHP

Dynamic bars using GD Library in PHP


You can view the working demo here.

You can download the source code here.

PHP Code:-

<?php
header(”Content-type: image/jpeg”);$current = isset($_GET['c']) ? $_GET['c'] : 50;
$start = isset($_GET['s']) ? $_GET['s'] : 0;
$end = isset($_GET['e']) ? $_GET['e'] : 100;
$p = isset($_GET['p']) ? $_GET['p'] : 0;
 
$pos = floor(2 * $current/($end - $start) * 100);
 
$im = imagecreate(200, 16); // width , height px
$white = imagecolorallocate($im, 255, 255, 255);
$black = imagecolorallocate($im, 0, 0, 0);
$green = imagecolorallocate($im, 0, 204, 51);
 
imagesetthickness($im, 2);
 
imagerectangle($im, 0, 0, 200, 15, $white);
imagefilledrectangle($im, 0, 0, $pos, 16, $green);
 
if ($p) {
	$text = ($pos / 2) .%;
	$font = ‘arial.ttf’;
	$black = imagecolorallocate($im, 0, 0, 0);
	imagettftext($im, 8, 0, 95, 12, $black, $font, $text);
}
 
imagejpeg($im);
imagedestroy($im);
?>

How to use it:-

Save the above PHP code in bar.php file and use this file in the src attribute of <img> tag.

<img src=”bar.php?s=0&e=100&c=100&p=1″ />

Here we are passing four different parameters to this file.

‘s’ for starting value (Default is ’0′).

‘e’ for end value (Default is ’100′).

‘c’ for starting value (Default is ’50′).

‘p’ for percentage flag (Default is ’0′). If you want to show percentage on your bar then pass ‘p’ = 1.

You can view the working demo here.

You can download the source code here.

, ,

No Comments


How to use wmode as transparent for flash and what’s its use?

Sometime our embedded flash object comes over our websites dropdown menus or over other objects like light box, jQuery Boxy, fancybox etc.

We can solve this problem by changing the wmode of embed to transparent. By changing the wmode to transparent the flash object becomes transparent.

We can do it in following ways.

HTML:-

Add the following parameter to the OBJECT tag:

<param name=”wmode” value=”transparent”>

Add the following parameter to the EMBED tag:

wmode=”transparent”

JavaScript:-

If you are using swfobject.js javascript file for embedding. Then do it like this.

<script type="text/javascript">
var obj = new SWFObject(”player.swf,”ply”,300,250,9,”#FFFFFF”);
obj.addParam(”wmode”,”transparent”);
</script>

If you want to apply the wmode transparent to whole HTML page. You can do this way.

<script type="text/javascript">
for (var ems = document.embeds, i = 0, em; em = ems[i]; i++) {
	em.setAttribute(’wmode’, ‘transparent’);
	var nx = em.nextSibling, pn = em.parentNode;
	pn.removeChild(em);
	pn.insertBefore(em, nx);
}
</script>

,

2 Comments


Styling or modifying drupal primary and secondary tabs like drupal.org

If you want your drupal website’s primary and secondary tabs in same style like drupal.org have in “bluebeach” theme. (See the below graphic.)

Durpal styled tab

Drupal styled tab

Then you have to create a wrapper for tabs so you can put the rounded corner images on both side of tabs. like this

<span class=”a”><span class=”b”>Tab Title</span></span>

But the default “garland” theme does not provide this wrapper. So, you have to put this wrapper by customizing theme. Here I am just illustrating the code that you need to create wrapper around the tabs. After that you need to put the necessary style in your CSS files.

You need to change the “theme_menu_item_link()” to put these wrappers in tab. I am using the code of Drupal 6.9 in this example but I think this approach will work in all versions of Drupal by little tweak.

Existing code:

<?php
	function theme_menu_item_link($link) {
		if (empty($link['localized_options'])) {
			$link['localized_options'] = array();
		}
 
                return l($link['title'], $link['href'], $link['localized_options']);
	}
?>

New code (With changes required)

<?php
	function theme_menu_item_link($link) {
		if (empty($link['localized_options'])) {
			$link['localized_options'] = array();
		}
               if ($link['tab']) {
			$link['title'] =<span class=”a”><span class=”b”>. $link['title'] .</span></span>;
			$link['localized_options'] = $link['localized_options'] + array(’html’ => TRUE);
	       }
 
               return l($link['title'], $link['href'], $link['localized_options']);
        }
?>

, ,

7 Comments