I want to add a class to the widget pager of views slideshow. I found the function in the file /theme/views_slideshow.theme.inc wich theme the wrapper of the widget

function theme_views_slideshow_pager_widget_render($vars) {
  // Add javascript settings for the pager type.
  $js_vars = array(
    'viewsSlideshowPager' => array(
      $vars['vss_id'] => array(
        $vars['location'] => array(
          'type' => preg_replace('/_(.?)/e', "strtoupper('$1')", $vars['settings']['type']),

  drupal_add_js($js_vars, 'setting');

  // Create some attributes
  $attributes['class'] = 'widget_pager widget_pager_' . $vars['location'];
  $attributes['id'] = 'widget_pager_' . $vars['location'] . '_' . $vars['vss_id'];
  return theme($vars['settings']['type'], array('vss_id' => $vars['vss_id'], 'view' => $vars['view'], 'settings' => $vars['settings'], 'location' => $vars['location'], 'attributes' => $attributes));

I just want to modify the line to add my own class (as grid-6 for example)

$attributes['class'] = 'widget_pager widget_pager_' . $vars['location'];

I try to use this function in my file template.php without success.

the classes of the wigdet pager in my html code are :

views-slideshow-pager-fields widget_pager widget_pager_bottom views_slideshow_pager_field views-slideshow-pager-field-processed

So i imagine that an other function add the classes. But wich ?

How can i do this ? May i write a module or simply use a preprocess function in my template.php


  • I think simple than a module will be to use the template.php file. Also check the views_slideshow module as it ships with some tpl.php files that you might be able use as well by making a copy of the same in your theme folder.
    – Emil Orol
    Aug 31, 2012 at 1:42
  • Yes i look the .tpl use : views-slideshow.tpl.php. i can override it but the class that i can add are on the wrapper of ALL the widgets (pager, controls, slide-counter). I would like add a class only on the wrapper of the pager widget, and why not, add a different class to the widget controls or slide-counter Aug 31, 2012 at 4:56

2 Answers 2


In fact, after looking at the HTML code generated by views slideshow, pager widget is contained in a div on the same level that the content of the slideshow. So even if I could add a class, it would not be useful because I already positioned text to the right of my image. So the div content of the slideshow is already 100% of the width (and the sub-content have already custom classes to position them in line) .

So I have to use position: absolute to position the pager widget, so I can just add my classes on the container of all global gadgets (positioned at the bottom) by overriding the template views-slideshow.tpl.php as below, and then use the default classes of the widget in my css.


<div class="skin-<?php print $skin; ?>">
  <?php if (!empty($top_widget_rendered)): ?>
    <div class="views-slideshow-controls-top clearfix">
      <?php print $top_widget_rendered; ?>
  <?php endif; ?>

  <?php print $slideshow; ?>

  <?php if (!empty($bottom_widget_rendered)): ?>
    <div class="views-slideshow-controls-bottom MY-CLASSSES clearfix">
      <?php print $bottom_widget_rendered; ?>
  <?php endif; ?>

But I'd like to know if this is possible and with wich function.


Here is a hook_preprocess_HOOK() solution.

I couldn't find a way to add a class to theme_pager(), so I decided to take a closer look at the source and found that views pagers are also run through theme_item_list() which does allow you to add classes.

function MYTHEME_preprocess_item_list(&$vars) {
  $vars['attributes']['class'][] = 'my-class';

You can/should add an if condition check to see that the list really is going to be a pager, e.g. use if ($vars['attributes']['class'][0] == 'pager') or some other identifier to confirm that you're adding the class to a pager ul.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.