Design and CSS styles
Version 4.x > Design and CSS styles > How to change style of pagination control in LightBox Image Gallery View modes: 
User avatar
Member
Member
Anuj - 12/16/2009 5:13:40 AM
   
How to change style of pagination control in LightBox Image Gallery
I have used LightBox Image Gallery in my project and I also checked paging property of this control. Its pagination is displaying properly but I wish to change its style (color, font and spce between character).

I am not finding any option from where I could change its style.

When I am viewing page then It is showing <div class="PagerControl"></div> in which all pagination is available.

I am not able to find the file where this "PageControl" class is used. So please help me to find out proper file for this and change the style as per my need.


Thanks a lot.

Anuj

User avatar
Kentico Developer
Kentico Developer
kentico_ondrejv - 12/30/2009 6:33:20 AM
   
RE:How to change style of pagination control in LightBox Image Gallery
Hello,

You can do that using CSS stylesheet. In fact, you can refer to the PagerControl class in your CSS Stylesheet: Site Manager -> Development -> CSS stylesheets.

There are being rendered also other CSS classes for elements of this pager, so you can use them as well. Please take a look at the source code of particular page.

Whether you will need to add another styles you can do that directly in the lightbox webpart:~\CMSWebParts\Viewers\lightbox.ascx.cs. It's accessible in SetupControl method following way:

repItems.PagerControl.BackNextStyle = "color:#CCCCCC";

Please note it affects all the lightbox webparts, therefore it's recommended cloning this webpart as described here: http://devnet.kentico.com/docs/devguide/modifying_the_code_of_standard_web_parts.htm

Best regards
Ondrej Vasil

User avatar
Member
Member
izzuddin-istar.com - 10/20/2010 1:25:03 PM
   
RE:How to change style of pagination control in LightBox Image Gallery
Ok i have my own code of paging normally in repeater or any other control i just put the
PagerHTMLBefore : <div class="paginator">
PagerHTMLAfter: </div>

but in lightbox dont have that so, i go inside the Site Manager -> Web Parts
i add the new attribute i copy the name from repeater webpart which is

PagerHTMLBefore
PagerHTMLAfter
ResultsPosition
PageNumbersSeparator

then i go to the CMS Desk i add the web part the it show-up in the setting property

but when i save it, its like no use at all when i enable the paging

the <div class="paginator"> does not appear in the source code.

So basically do i need to add new code inside the .cs ?

is there anywhere easier to do this ?

like handling inside kentico enviroment only.

User avatar
Kentico Developer
Kentico Developer
kentico_ondrejv - 11/5/2010 9:29:22 AM
   
RE:How to change style of pagination control in LightBox Image Gallery
Hello,

Yes, you're right. You will need to adjust also the code-behind of the Lightbox webpart, so that the values from webpart properties get displayed on some page.

Another option would be adding Unipager control/webpart, however you will still need to modify code-behind of Lightbox webpart. So it's up to you which way you'll go.

Best regards
Ondrej Vasil