ComponentOne Gallery for ASP.NET Web Forms
Quick Start / Step 2 of 3: Adding Content
In This Topic
    Step 2 of 3: Adding Content
    In This Topic

    Adding content to the C1Gallery control is very simple and can be done in a variety of ways. In this step, you'll link to images using the ImageUrl property. The following steps assume you've completed Step 1 of 3: Adding C1Gallery to the Page topic and added a C1Gallery control to the page.

    Complete the following steps to add content to the C1Gallery control:

    1. In Source view, place your mouse between the <cc1:C1Gallery></cc1:C1Gallery> tags, and add the following markup to add items to the control:
                 
      <Items></Items>
    2. Place your mouse between the <Items></Items> tags, and add the following markup to add several C1GalleryItems to the control:

      To Write Code In Source View

      <cc1:C1GalleryItem LinkUrl="http://lorempixum.com/600/300/sports/1" ImageUrl="http://lorempixum.com/200/150/sports/1" />
      <cc1:C1GalleryItem LinkUrl="http://lorempixum.com/600/300/sports/2" ImageUrl="http://lorempixum.com/200/150/sports/2" />
      <cc1:C1GalleryItem LinkUrl="http://lorempixum.com/600/300/sports/3" ImageUrl="http://lorempixum.com/200/150/sports/3" />
      <cc1:C1GalleryItem LinkUrl="http://lorempixum.com/600/300/sports/4" ImageUrl="http://lorempixum.com/200/150/sports/4" />
      <cc1:C1GalleryItem LinkUrl="http://lorempixum.com/600/300/sports/5" ImageUrl="http://lorempixum.com/200/150/sports/5" />
      <cc1:C1GalleryItem LinkUrl="http://lorempixum.com/600/300/sports/6" ImageUrl="http://lorempixum.com/200/150/sports/6" />

      Note that you set the following properties for each C1GalleryItem:

      • ImageUrl: Image URL of gallery item.
      • LinkUrl: Link URL of gallery item.
    3. Run your application, and observe that the page now looks similar to the following image:

    4. Click on a thumbnail image to navigate through the images.

    In this step you added content to C1Gallery control. In the next step you'll customize the appearance and behavior of the control.