Hi ,
I have 16 pages and it displays 1 to 5 and then the 16th page no. on my screen.But I want to display only two nos and the next and previous button .I can do that for two pages,how do I do it when I have 16 pages?
for eg: I want " previous 5, 6,next "
instead of "previous 1,2,3,4,5 ...16,next .
please check images for better understanding.
This is what i want when i have 16 pages
but this is how it displays
You will have to write some custom CSS to modify what is displayed for the paging widget. Since there is not a custom CSS property for the paging widget you will have to specify the custom class on a parent container. For the following code I put the custom class on the parent container
/* Hide the | from the paging controls */
.hideExtraPages .widget-paging .page-controls{
visibility: hidden;
}
/* Make the other page controls visible*/
.hideExtraPages .widget-paging .page-controls a, span{
visibility: visible;
}
/* Hide the extra page displays */
.hideExtraPages .widget-paging span.items-label, a.pagingcontroller, span.previous-ellipsis, span.next-ellipsis {
display: none;
}
/* Show the Previous Page Button, Next Page Button, Next page number */
.hideExtraPages .widget-paging a.previous-page, a.next-page, span.current-page + a {
display: inline;
}Sample Composer View: ( hideExtraPages is set on Container-5)
Sample Mashup View:
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.