Gallery for ASP.NET Web Forms
Step 3 of 3: Customizing Appearance and Behavior
Quick Start > Step 3 of 3: Customizing Appearance and Behavior

You can easily customize C1Gallery's appearance and behavior. In the following steps you'll set the control's behavior and appearance. The following steps assume you've completed Step 2 of 3: Adding Content to the C1Gallery Control topic.

Complete the following steps:

  1. Source view, edit the <cc1:C1Gallery> tag to add Width="600px" Height="256px":
           
    <cc1:C1Gallery ID="C1Gallery1" runat="server" Width="600px" Height="256px">

    This sets the size of the control.

  2. In Source view, edit the <cc1:C1Gallery> tag to add ShowPager="False" ShowTimer="True":
          
    <cc1:C1Gallery ID="C1Gallery1" runat="server" Width="600px" Height="256px" ShowPager="False" ShowTimer="True">

    The control will no longer display pager buttons below the control and a timer will be displayed.

  3. In Source view, edit the <cc1:C1Gallery> tag to add ThumbnailOrientation="Vertical" ThumbsDisplay="3":
           
    <cc1:C1Gallery ID="C1Gallery1" runat="server" Width="600px" Height="256px" ShowPager="False" ThumbnailOrientation="Vertical" ThumbsDisplay="3">

    This changes the orientation and number of thumbnails only three thumbnail images will be displayed at a time and thumbnail images will now be displayed vertically rather than horizontally below the selected image.

  4. Run the application and observe that the control displays the changes that you made:

    Notice that the location and number of thumbnail images has been changed, the control size is smaller, and the pager is no longer displayed.

In this step you customized the appearance and behavior of the controls. Congratulations, you've completed this quick start guide!

See Also