I've wondered in the past when using the Service Links module for Drupal how to quickly change the images that are provided by the module. There can be multiple ways to accomplish this, but only one real way to provide new images without "hacking" the service links module. I've come across several posts that mention adding images to the images folder in the service links module, which I consider bad practice. There may be some changes in the 2.x branch of service links that make this a bit easier, but there are really two ways to "properly" do this in Drupal 6 with the 1.x branch of Service Links.
Option 1 - Overwrite the images in the service links folder
Don't do this. Kittens everywhere will be screaming in pain, and if you update your module, the images would be overwritten at a later date.
Option 2 - Declare new service links using hook_service_links()
Right off the bat, I'll let you know this is NOT the option I chose to use in my theme, but it is still a valid option. Using hook_service_links() you can declare "new" service links, and declare your image in the hook on each item. Doing it this way would require you using a custom module in order to declare the new service links, which in this case would be a copy of the ones you'd like to use, along with defining an image.
$links = array();
$links['stumbleupon'] = array (
'name' => 'StumbleUpon',
'description' => t('Thumb this up at StumbleUpon'),
'link' => 'http://www.stumbleupon.com/submit?url=<encoded-url>&title=<encoded-title>',
'icon' => drupal_get_path('module', 'YOURMODULE') . '/images/stumbleit.png',
);
}
Essentially this method isn't the best as we are creating duplicates of the default service links to provide our own images. We also don't want to create a new custom module just to overwrite these images.
Option 3 - Theme like a rockstar
Service Links is a great module as it properly defines theme functions that allow us to theme items the way we see fit. Built into the default theme functions, however, there isn't any way to look for an alternate image. The following code will do two things:
- Create a function to check for the alternate image(s)
- Create a theme function to use our logic
First off, let's build out our function that will check our alternate source for images. The images I'm using are named the same as the images in the service links module folder. This is what we will be checking against, to see if there is an image with the same name that we'd rather use. You can see where I've provided the custom folder I'm using to store custom service link images in my theme, you will want to adjust this accordingly, along with changing YOURTHEME to the actual name of your theme where the images will be stored.
$image_base = basename($image);
$potential_img_path = drupal_get_path('theme', 'YOURTHEME') .'/i/service_links/'. $image_base;
if(file_exists($potential_img_path)) {
return $potential_img_path;
}
else {
return $image;
}
}
Next, we will overwrite theme_service_links_build_link() to use the function we've created when passing images to the rendering functions. You will want to create a function called YOURTHEME_service_links_build_link() and place that in your template.php. I've taken an exact copy of the main theme function in service_links.module, and made the adjustments where needed to replace calls to $image to _service_links_alternate_image($image).
if ($nodelink) {
switch ($style) {
case SERVICE_LINKS_STYLE_TEXT:
$link = array(
'title' => $text,
'href' => $url[0],
'query' => $url[1],
'attributes' => $attributes,
);
break;
case SERVICE_LINKS_STYLE_IMAGE:
$link = array(
'title' => theme('image', _service_links_alternate_image($image), $text),
'href' => $url[0],
'query' => $url[1],
'attributes' => $attributes,
'html' => TRUE
);
break;
case SERVICE_LINKS_STYLE_IMAGE_AND_TEXT:
$link = array(
'title' => theme('image', _service_links_alternate_image($image), $text) .' '. $text,
'href' => $url[0],
'query' => $url[1],
'attributes' => $attributes,
'html' => TRUE
);
break;
}
}
else {
$attributes = array('query' => $url[1], 'attributes' => $attributes);
switch ($style) {
case SERVICE_LINKS_STYLE_TEXT:
$link = l($text, $url[0], $attributes);
break;
case SERVICE_LINKS_STYLE_IMAGE:
$attributes = array_merge($attributes, array('html' => TRUE));
$link = l(theme('image', _service_links_alternate_image($image), $text), $url[0], $attributes);
break;
case SERVICE_LINKS_STYLE_IMAGE_AND_TEXT:
$attributes = array_merge($attributes, array('html' => TRUE));
$link = l(theme('image', _service_links_alternate_image($image), $text) .' '. $text, $url[0], $attributes);
break;
case SERVICE_LINKS_STYLE_FISHEYE:
$image[0] = $image[0] . variable_get('service_links_fisheye_folder', '');
$attributes['attributes']['class'] = isset($attributes['attributes']['class']) ? $attributes['attributes']['class'] .' fisheyeItem' : 'fisheyeItem' ;
$attributes = array_merge($attributes, array('html' => TRUE));
$link = l(theme('image', _service_links_alternate_image($image), $text, NULL, NULL, FALSE) .'<span>'. $text .'</span>', $url[0], $attributes);
break;
}
}
return $link;
}
Once this is complete, the functionality is simply going to look in your custom folder, if there is a match for the file name it was originally looking for is found, it will render that image instead of the default provided by service links, and if there is not, it will default back to the original image.
Hope this helps someone out there! I love using Service Links for Drupal. It is flexible, and great things are on the way in the 2.x version that is being worked on.






Post new comment