Create and structure a site


    Adobe GoLive CS makes it easy to create complex, multipage Web sites using the site wizard and the site diagram feature. The site wizard walks you through the process of setting up a new Web site, and the site diagram feature lets you quickly prototype the site, and then convert the prototype to actual pages.

    In the steps that follow, you'll use the site wizard, diagramming tools, and the site window to create a new Web site with multiple pages and folders.

    Create and structure a site

1. Create a new blank site.

    Start GoLive and click the New Site button to open the Site Wizard. Select the Single User option, and click Next. In the next screen, select Blank Site, and then click Next. Enter a name for your site in the Site Name text box, click Next, and then specify a location on your hard drive to store the site files and folders. Click Finish to create the new site. That's all there is to creating a new site.

    GoLive creates a project folder on your hard drive. This folder contains the site's project file, a web-content folder, which contains an index.html file, a web-data folder, and a web-settings folder, which GoLive uses to manage the site and its assets.

    Site window

2. Create a diagram and add a page.

    With the site window active, choose Diagram > New Diagram to create a new diagram. Drag a Page icon from the Diagram set of the Objects palette to the design view to add a new page named untitled.html. Click the page's name, and then enter a new name, such as Products.html.

     Diagram set of Objects palette

3. Add new child pages.

    With the page in the design view selected, choose Diagram > New Pages. In the New Pages dialog box, enter the number of new child pages to create a base filename for the new pages. For example, enter 4 to create four pages, and then enter Models in the Filenames text box to add pages named Models.html, Models1.html, Models2.html, and Models3.html. Click Create.

    Site diagram

4. Anchor the diagram to a page in the site.

    Drag the index.html page from the Files tab of the site window to the design view. Index.html becomes an anchor page in the diagram and is indicated by an anchor symbol.

    Anchoring the diagram specifies the diagram's location in the site's hierarchy.

    Anchoring the diagram

5. Submit the diagram to the site.

    Choose Diagram > Staging > Submit All. GoLive converts the diagram's pages to HTML pages in the site. In the Files tab of the site window, you can see the new pages in the site.

    Site window

6. Structure the site.

    Organize your pages and images in separate folders so that you can keep track of files and update them easily. With the Files tab of the site window active, click the Create New Folder button Create New Folder button in the toolbar. Rename the new untitled folder Pages. You'll place all your HTML pages in this folder. Click in an empty area of the Files tab and click the Create New Folder button. Rename the new folder Images. You'll place all your images in this folder. Select Products.html and its child pages (models.html, models1.html, etc.), and drag them into the Pages folder (Shift-click to select multiple files).

    If your site is very complex, you may want to create subfolders within these folders to easily organize your files. Whenever you move, rename, or add pages, or create a new folder in the Files tab, GoLive automatically makes the change in the site's web-content folder.

    Diagram set in Objects palette