How to customize Pager button

[Francis]

Hi,

is it possible to change the buttons of the Pager (in the bottom of the grid, see attached image) ?


Thank you !

[Venelin]

Hi Francis,

Visual Style Builder does not provide an option to separately customize all button images. You have few options:

1. You can take the original sprite image(sprite.gif) and replace the default icons with your own icons by respecting the sprite's convention (please refer to the attached screenshot).

2. If you don't want to use sprite and rather use separate images you can define a css rule for each button:

CSS:

/*"First page" image*/
div.RadGrid_{Custom_skin_name} .rgPageFirst{
   background: url('the_path_to_the_image') 0 0 no-repeat;
}

/*"Previous" image*/
div.RadGrid_{Custom_skin_name} .rgPagePrev{
    background: url('the_path_to_the_image') 0 0 no-repeat;
}

/*and so on for all images*/

According to me the first approach is more optimal and easier.

Regards,
Venelin
Telerik