Hi,

I'm still reasonably new to Drupal.
I'm not sure if this issue actually belongs under theme system or base system, but I'm trying to theme my pager links to be images instead of text.

I've trawled through various searches but have come up empty.
I did manage to find a function for my template.php page which allows me to make changes to the pager output - such as making the link text different or adding classes, etc. However I can't make them into image links.

Looking at the api documentation for theme_pager_previous (for example) under Parameters it says...
$text The name (or image) of the link.
But I can't work out how to present the image.

This is what I have added to my template.php file
(I've removed the 'first' and 'last' links too)

function phptemplate_pager($tags = array(), $limit = 10, $element = 0, $parameters = array()) {
  global $pager_total;
  $output = '';

  if ($pager_total[$element] > 1) {
    $output .= '<div class="pager">';

	/* My 'previous' link */
   	$output .= theme('pager_previous', ($tags[1] ? $tags[1] : theme_image('path/to/images/pager-prev.jpg', 'Prev', 'Click to see the previous set of results', array('border' => 0), TRUE)), $limit, $element, 1, $parameters);

	/* Links to specific pages in the result set */
	$output .= theme('pager_list', $limit, $element, ($tags[2] ? $tags[2] : 9 ), '', $parameters);

	/* My 'next' link */
    $output .= theme('pager_next', ($tags[3] ? $tags[3] : theme_image('path/to/images/pager-next.jpg', 'Next', 'Click to see the next set of results', array('border' => 0), TRUE)), $limit, $element, 1, $parameters);

    $output .= '</div>';

    return $output;
  }
}

As you can see I've tried using the theme_image function. It actually outputs the correct img source but as simply as plain text in the link, not an image file.

I've also tried not using theme_image and simply putting the image url (based on the theme_pager_previous note above) but that simply placed the image url as the text for the link.

Can someone please help me out here? Have I got it all wrong?

Comments

beekay1076’s picture

beekay1076 commented
Status: Active » Fixed

Hi all

Well I must have searched on the wrong terms.
I have found a solution using the code supplied by wmostery at http://drupal.org/node/35464 and replacing the text with an image using the theme_image function
Works a treat.

Below is the code I'm using.

function phptemplate_pager($tags = array(), $limit = 10, $element = 0, $parameters = array()) {
	global $pager_page_array, $pager_total;
	$page_prev = $pager_page_array[$element] - 1;
	$page_curr = $pager_page_array[$element] + 1;
	$page_next = $pager_page_array[$element] + 1;

	if ($pager_total[$element] > 1) {
  
		$output = '<div class="pager clearfix">';

		if ($pager_page_array[$element]!=0) $output.= '<div class="prev"><a href="?page='.$page_prev.'" class="previous">' . theme('image', path_to_theme().'/images/pager-back.jpg', 'Back', 'Click to see the previous set of results', array('border' => 0), TRUE) . '</a></div>';


		if ($page_curr!=$pager_total[$element]) $output.= '<div class="next"><a href="?page='.$page_next.'" class="next">' . theme('image', path_to_theme().'/images/pager-next.jpg', 'Next', 'Click to see the next set of results', array('border' => 0), TRUE) . '</a></div>';

		$output.= '</div>';
		return $output;
	}
}
beekay1076’s picture

beekay1076 commented
Status: Fixed » Closed (fixed)

Closing now.

Roelven’s picture

Roelven commented

See also http://drupal.org/node/318565

jmlavarenne’s picture

jmlavarenne commented

I'm not able to get this to work :(


    $output .= theme('pager_first', theme('image', path_to_theme() . '/images/pager/pager_first.png', 'Back', 'Click to see the previous set of results', array('border' => 0), TRUE), $limit, $element, $parameters);

This escapes the html in a way that I see it printed on the page as such :

<img src="/~dg1234/sites/all/themes/cuisineduquebec/images/pager/pager_first.png" alt="" title="" width="16" height="16" />

and in the source code as such :

&lt;img src=&quot;/THE_PATH/images/pager/pager_first.png&quot; alt=&quot;&quot; title=&quot;&quot; width=&quot;16&quot; height=&quot;16&quot; /&gt;
jmlavarenne’s picture

jmlavarenne commented
Version: 5.7 » 5.9
Status: Closed (fixed) » Active
jmlavarenne’s picture

jmlavarenne commented
Status: Active » Fixed

There is an l() in theme_pager_links() that prevent images from appearing in the pager.

I overwrote it as explained here :

http://drupal.org/node/318565#comment-1079877

Anonymous’s picture

Anonymous (not verified) commented
Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for two weeks with no activity.