Previewing a Page

Pages can be previewed prior to publishing. This allows the user to feel assured that the page is configured as desired before it is on the public website. The page can be previewed in all published formats (for instance, HTML and PDF). It is also possible to preview the page as it will appear in other browsers across multiple platforms.

Immediately after editing and saving any page, a rendered preview is displayed, with the option to see a preview in other browsers. It is possible to navigate to the preview at any time using the Preview button. The rendered preview of a page will display all graphics and server-side includes. Other server-side scripting code will not be displayed in Page Preview mode.

Page Preview

To preview a page, first navigate to Content > Pages.
Content Pages

A preview can be obtained by either:

  1. Editing the page, and then clicking on Save. This renders a preview.
  2. Clicking the Preview button at the top of the page.

    Preview Button
  3. Clicking the Preview button from within the folder structure.

    Preview Folder Structure

Previewing a Page

The page preview includes the graphics, server-side includes, and assets.

Preview Screen

Once the preview has been rendered, use the tabs to navigate through the preview options.

Preview Options

The default preview is the first product declaration, which is also the default. The tabs display the other products, which can be previewed as well, and the Multi-Browser Preview option.

Publish Target

When Multi-Target Publish has been enabled and if alternative publish targets have been defined, then they can be selected for preview.

Publish Target Selection


Next Page


Product Preview

It is possible to preview each of the page's products, which is the multiple types of outputs that are being created upon publish. The products may be different file type formats, such as HTML, PDF, RTF, CSV, XML, and mobile. 

Preview buttons for the various file types are accessible at the top of the Page Preview window.
multi_output preview

Different products are achieved by adding an XSL document to the PCF. The various XSL files are called using the PCF stylesheet command. Below is an example of what the tabs will look like in the preview window for each page with the added XSLs.

<?pcf-stylesheet path="/_resources/xsl/default.xsl" extension="html"?>
<?pcf-stylesheet path="/_resources/xsl/import/page2xml.xsl" extension="xml"?>
<?pcf-stylesheet path="/_resources/xsl/page2pdf.xsl" extension="pdf"?>
<?pcf-stylesheet path="/_resources/xsl/page2csv.xsl" extension="csv"?>
<?pcf-stylesheet path="/_resources/xsl/page2rtf.xsl" extension="rtf"?>

Previous PageNext Page



Multi-Browser Preview

The page can be reviewed as it would appear in various browsers with the Multi-Browser Preview feature. This allows for views of all versions of supported browsers for OU Campus including Chrome, Firefox, MS Internet Explorer, and Safari. Both Windows and Mac operating systems are supported. After making a selection of browsers to preview, the previews are provided as thumbnail images, which can be clicked for a larger view that includes more details. This view also includes the ability to review the previews in a slide-show fashion. Additionally, the screenshots can be downloaded as a zip file.

To Initiate a Multi-Browser Preview

1. Click the Multi-Browser tab in the upper right corner of the preview window. This switches to the Multi-Browser Preview mode.

2. Select the checkboxes for each browser in which a preview is desired. This can be performed for each checkbox individually or the selections can be made with the following:

  • Select All
  • Select None
  • Only Windows
  • Only Mac OS

3. Click Submit.

Multi-Browser Preview

A new window or tab shows the status of the request and will auto refresh every 10 seconds until the process is completed. This process can take a few minutes as it completes the request and creates screenshots of the page in the different browsers selected.

Preview, Multi-Browser Queue

When completed, thumbnail images of the page show what the page will look like in the selected browsers.

Preview, Multi-Browser Thumbnails

Click on a thumbnail image to view the screenshot. From here, scroll through the available images. It is possible to click on the image to enlarge it to a full size image that includes more images details.
Multi-Browser Per Page Preview


Previous Page


Was this page helpful?

Additional Comments:

(Include your email address if you would like a reply)

Procede to