1

I have used Views Slideshow to generate a page slideshow. The rotation / cycle is working fine but I need to display a bulleted pager. Since I am not able to display any kind of pager, I started with trying to show a numbered pager first which is not working for me.

I have basically used this guide to setup numbered pagers.

However, I do not see the numbers after doing the same.

enter image description here

I have enabled the page controls and current page index for testing purpose. Below is what I get using Devel Themer module and the developer tools.

enter image description here

I just increased the height of the area which is supposed to display the pager so that I can click that area to show the themer information. I cannot see anything rendered in the div responsible for displaying the pager. Also, as I see in the template which is rendering the code for pager is simple.

From the file "views-slideshow-pager-fields.tpl.php" the code is the following.

<div id="<?php print $widget_id; ?>" class="<?php print $classes; ?>">
  <?php print $rendered_field_items; ?>
</div>

I do not understand why the pagers are not getting displayed. Where should I start looking for the fix?

Improve this question
6
  • 1
    Please, don't show the full browser window, in the screenshots. It makes the image difficult to see in the question, while we just need to see part of the browser window.
    – apaderno ♦
    Oct 12, 2015 at 9:59
  • Agree but you have cropped off the Themer part and the div region which is important to see. Should we revert back to original image or this cropped part is enough to understand?
    – Raj Pawan Gumdal
    Oct 12, 2015 at 10:25
  • If you feel there is something missing in the screenshot, you can edit them, but please don't re-add the full browser window. The images you used were i.stack.imgur.com/ofNt1.jpg and i.stack.imgur.com/p96nh.jpg.
    – apaderno ♦
    Oct 12, 2015 at 11:16
  • Cropped to the maximum extent which includes full information. Thanks for your inputs.
    – Raj Pawan Gumdal
    Oct 12, 2015 at 11:44
  • Thank you! Your collaboration has been fully appreciated.
    – apaderno ♦
    Oct 12, 2015 at 11:47

1 Answer 1

Reset to default
5
+50

You can achieve pager using View Slideshow by following steps:

Step 1: In view, add Global: View result counter field and mark it as Exclude from display.

Step 2: Now click on Slideshow format settings, go to Pager part and select Global: View result counter field as a Pager Type.

enter image description here

Step 3: To give perfect bullets effect, you will have add some CSS as given below 

.views-field-counter {
    float: left;
    margin-left: 5px;
}

.views-content-counter {
    text-align: center;
    width: 29px;
    background: url(../bullets.png) no-repeat scroll center center transparent;
    cursor: pointer;
}

Step 4: Please check out CSS Classes, ID's and HTML markups form below screenshot, which worked at my end.

enter image description here

Improve this answer
3
  • Awarded the bounty, the clue was "Hide pager if only one slide exists" being unchecked. It was not working as it is supposed to be.
    – Raj Pawan Gumdal
    Oct 22, 2015 at 18:20
  • However the problem with bulleted pagers is not yet solved.
    – Raj Pawan Gumdal
    Oct 22, 2015 at 18:20
  • Try out the above steps to your local setup. Which theme you are using?
    – Nikhil Banait
    Oct 23, 2015 at 5:44

Your Answer

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

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