Previewing & Publishing

 25 min

  

Once you have made your site, the next step is to publish it to the internet. We'll take you through the steps in this tutorial.

By the end of this tutorial you will be able to:

To download the tutorial project file(s), right-click the  link(s) and, depending on your browser, select either Save Target As... or Save Link As... In the subsequent dialog, ensure that you choose a suitable file location, such as a 'downloads' folder or the 'desktop', so that you can easily browse to your file when required.

 

portfolio.wpp

Let’s begin...

  1. On the Standard toolbar, click  Open.

  2. Navigate to the portfolio.wpp file, select it and click Open.

    The 'Home' page is displayed in the workspace.

Previewing your website

With the vast number of web browsers available, it's important to test your site to ensure that it will be viewed in the way that you intended. Before you upload your site to the masses, we'll show you how to test your site in different browsers.

To preview your site in WebPlus:

  1. On the Standard toolbar, click the arrow to expand the  Preview site drop-down list.

  2. Click the Preview in Window (Internet Explorer) option.

    (If you have created a large site, there may be a slight delay while the site is exported to display in a web browser.)

    Once exported, WebPlus displays the site preview in a built-in Microsoft Internet Explorer window.

  3. To switch between your regular design view and the Preview, simply click on the tabs at the top of the workspace area.

  4. Even if your site navigation is incomplete, you can jump to different pages using the Page Selector at the bottom left of the workspace.

  5. When you have finished, click Close Preview.

If you make any changes to your design, your site will be ‘republished’ when you next switch to Preview. You can also preview your site, or single page, in an actual browser window. This is useful for testing compatibility with other browsers such as Firefox, Chrome, Safari or Opera. WebPlus automatically detects if alternate browsers are installed.

To preview your site in a Web browser:

  1. Click the arrow to expand the  Preview site drop-down list.

  2. Select Preview Site in {your web browser of choice}.

  3. Your site will open in a new browser window.

 Top of page

Preparing your website for publication

We'll assume that our design looks great in a range of browsers. Now it's time to publish our site to a live location. Even though you may have saved your website as a WebPlus project, it's not truly a ‘website’ until you've converted it to files that can be viewed in a Web browser. WebPlus does this automatically when you publish the site.

Publishing options

WebPlus can publish your site in several ways:

To prepare your website for web publication:

  1. Check your page names, file names, and picture export settings in the Edit > Site Properties... and Tools > Image Export Manager... dialogs. (For details, see WebPlus Help.)

  2. In Site Manager (on the Default context toolbar), use Site Checker to check your site for problems such as non-websafe fonts, invalid anchors and hyperlinks, and so on. (For details, see WebPlus Help.)

When you are satisfied all issues with your website have been resolved, you can set up your FTP account and publish to the world wide web.

 Don't forget to save your work!

To set up your FTP account:

  1. On the Standard toolbar, click the arrow to expand the  Publish site drop-down list.

  2. Click Publish to Web.

  3. In the Publish To Web: Get Hosting dialog, click Add Details.

  4. In the Site Base URL dialog, type in the URL for your website in the text box, e.g. http://www.illustrationportfolio.com.

    The Account Details dialog will open.

  5. When publishing to the Web you’ll need to provide the following information, most of which you can obtain from your Web host. (When you receive this information, usually displayed on-screen or sent by email on purchase of your web space, it is worth printing out for your own records and for later reference.)

  1. When you’ve entered all your information, click OK.

Before you proceed further, it's a good idea to test your account settings to ensure there are no issues with connecting to the internet.

To test your account details and connection:

Once you've set up your FTP account and can connect your computer to the host, publishing to the Web is simply a matter of transferring files.

 Top of page

Publishing to the web

With your FTP account set up and project ready-to-go, let's get onto the exciting task of getting your site onto the web!

To publish your site to the web:

  1. In the Publish to Web dialog, your current FTP account details should be displayed. If not, select an FTP account from the drop-down list.

  2. In the Page Range tree, select which page(s) to publish. To publish the entire site, select the Publish All Pages option.

  3. Click OK.

    WebPlus will convert your design into HTML pages with associated graphics and other files, then begin to upload your site to the internet, showing individual file progress and overall progress.

  1. When WebPlus has exported the selected pages, close the Uploading files dialog—the Web Site Publishing dialog opens.

  2. To view your site online, choose your browser from the drop-down list and click View this URL.



    Your browser will launch showing the specified URL.

Maintaining your website

The great thing about websites is the ability to update them frequently at no extra costs—in fact, visitors will expect your website to be up-to-date with all the latest information. With WebPlus, it's quick to update a modified website which has been previously published.

To update a previously published website:

  1. With the portfolio.wpp project still open in your workspace, use the Page Selector at the bottom left of the workspace to select the Photography page.

  2. Select the grouped objects on the page and then press Delete.

  3. On the Quick Build tab, in the Layout Items category, drag the Photo Gallery layout item to the page.

  4. Work through the dialog to place a photo gallery onto the page.

    See the tutorial, Photo Galleries, for more information.

 Don't forget to save your work!

  1. Click Publish Site>Publish to Web... from the File menu.

  2. In the Publish To Web dialog:

  1. In the Uploading Files dialog, select Incremental Update or Full Upload.

By only uploading pages which have changed (and selecting Incremental Update) you will notice that the web upload is much quicker. You can view your updated page in a browser.

If your web server cannot accommodate spaces in file names, complete the following steps to have WebPlus remove the spaces and symbols from file names when they are published:

To convert file names:

  1. On the Edit menu, click Site Properties...

  2. Click the File Naming category and then select the Remove spaces and Remove symbol character options.

  3. Web pages are normally published with lower case file names. Select Make lower case to get WebPlus to do this for you.

  4. If you’ve already published your site, you’ll need to republish to fix the problem. This also improves site reliability.

That’s it! You’ve published your site to the Web for all to see! As you can see, WebPlus makes it very easy to publish your site and upload new content.