Configuring the CONTENTdm Interface Tutorial Part II

Note: This tutorial is also available as a video or PDF file.

Edit footer-based navigation

The footer navigation is located at the bottom of the pages of your website, and includes the Home, About and Contact Us links, by default. The footer navigation can include up to eight links.

You can edit the Home, About and Contact Us link labels and URLs (or mailto), and add additional links to this navigational area.

To configure the footer navigation

    1. From the Website Configuration Tool, click Navigation > Footer.
    2. Add or edit navigation links:
      • To add additional links, enter text in the next empty Link Label text box and add the corresponding URL.

The link label is the text that will display. The URL is the hyperlink. Note that any links to pages on your CONTENTdm Website must include “/cdm/”, for example, the link to Browse All is “/cdm/search”. Mailto links should use the form “mailto:”. Web links to pages outside CONTENTdm Website should use the form http://.

      • To edit existing links, edit the text in the Link Labels text box and the corresponding URL.
    1. Click Save Changes.
    2. Click Preview or Publish.

For this exercise, please remove the “About” navigation link and insert a “Contact Us” email address.

Enable users to print, download, and share items

If enabled, the Print feature displays a Print button above the viewport when viewing an item. End users can then click to print the item. A pop-up window of the item displays, along with a print dialog. (If enabled, the Print button never displays for audio and video files or for metadata-only items.)

If enabled, the Download feature displays a Download button above the viewport when viewing an item. End users can then click to select a size to download (for images), and then a File Download prompt displays. You can configure the size options that are made available for image download. (If enabled, the Download button never displays for metadata-only items.)

If enabled, the Share feature displays above the item title when viewing an item. End users can then click to share the item using popular platforms, such as e-mail, Facebook and Twitter. A compact view of sharing options displays when the end user hovers over the Share link in your website. An expanded view of sharing options displays when the end user clicks the More link in the compact view. You can configure which linked sharing options display in both views.

For this exercise:

      1. Enable print button
      2. Enable download button
      3. Limit downloads to small and medium size
      4. Enable sharing and add scripting from AddThis

Enabling Print

      1. From the Website Configuration Tool, click Items > Print.
      2. Check the checkbox to Enable Print button.
      3. Click Save Changes.
      4. Click Preview or Publish.

Enabling Download

    1. From the Website Configuration Tool, click Items > Download.
    2. Check the checkbox to Enable Download button.
    3. Check the checkbox for each size option to display for image files.
      • Small: 250 x 250 maximum
      • Medium: 500 x 500 maximum
      • Large: greater than 1000 x 1000 maximum
      • Extra Large: 2000 x 2000 maximum
      • Full size: the truest interpretation of the image (generally, full resolution files are very large and are either uncompressed or minimally compressed).
      • Archival Image: Full resolution will appear when there is an original image stored in the Archival File Manager.
  1. Click Save.
  2. Click Preview or Publish.

Enabling Share

      1. From the Website Configuration Tool, click Items > Share.
      2. Select Enable AddThis Functionality
      3. Follow the instructions to get the correct AddThis code that links your website Share options to the AddThis service.
        • Go to the AddThis site: http://www.addthis.com/.
        • Select Share tools (Create an account).
        • Select Original Sharing Buttons and grab the code.
        • Copy the value of the src attribute (you can ignore all the other code). For example, in the script tag, copy everything in quotation marks for the src attribute (a URL): So for <script type=”text/javascript” src=”//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-54c14e847698b8af”></script>
        • You need to copy the URL: //s7.addthis.com/js/300/addthis_widget.js#pubid=ra-54c14e847698b8af

      1. In the “AddThis” URL, paste the AddThis URL.
      2. Review and edit the list of services that display in the compact and expanded views. Services should be separated by commas and are specified using the service codes (to review a list of service codes, click Go to AddThis to view a directory of service codes).
      3. Click Save Changes.
      4. Click Publish.

Enable user-generated content (tags and commenting)

Many organizations choose to enrich their collections by enabling the availability and display of social features when viewing items on your website globally or by collection.

You can access these options from the Website Configuration Tool. Click Items > User-Generated Content. Then check the appropriate checkboxes to enable each feature. You can also select whether the Ratings results display above or below the item description.

For this exercise:

      1. Enable both tagging and commenting
      2. Enable reporting of tagging and commenting abuses

To configure the tagging feature

      1. From the Website Configuration Tool, click Items > User-generated Content.
      2. Check the checkbox to Enable Tags.
      3. Check the checkbox to optionally Enable Report Abuse for Tags.
      4. Click Save Changes.
      5. Click Preview or Publish.

To configure the commenting feature

      1. From the Website Configuration Tool, click Items > User-generated Content.
      2. Check the checkbox to Enable Comments.
      3. Check the checkbox to optionally Enable Report Abuse for Comments.
      4. Click Save Changes.
      5. Click Preview or Publish.

Customize the collection home page

For this exercise add the following title to your collection: Sorensen [Last Name] and insert a description from the sample text file.

To edit the Home page site title and description

      1. From the Website Configuration Tool, click Page Types > Landing Page.
      2. In the Title box, edit the text.

The title displays in the browser title bar and below the header on your Home page.

      1. In the About your collections box, enter a description.
        • The description may optionally include HTML.
        • Recommended length is 300 words.
        • Note: By default, the About page displays the website description entered for the Home page. Use the Website Configuration Tool > Page Types > About option to edit the About page (see below).

Note that you can insert images and links, specify fonts and background color using the editor. You can insert news about your Library or feature a collection or provide whatever information you feel is important.

If you have HTML code you created using another editor that you want to paste into this editor, or if you want to edit in the code view, click the HTML button. (To replace the Home page default template with your custom page, see below.)

      1. Click Save Changes.
      2. Click Preview or Publish.

Customize the collection about page

For this exercise: Enable the collection-level about page and insert about page contents from exercise text file

To configure the display and select the content inheritance of the collection-level About page

      1. From the Website Configuration Tool, click Page Types > About.
      2. In the Collection About Page box, select an option for the page.
        • Select Enable collection-level About page to offer an About page that is different from the global-level About page for the selected collection.
        • Select Disable collection-level About page to not show this page for the selected collection.
        • Select Show an About page for this collection, but use the global About description to show an About page for the selected collection but display the same content as the global-level About page (see above). (You can still enter a collection-level About Page Title.)
      3. Click Save Changes.
      4. Click Preview or Publish.

To edit the collection-level About page site title and contents

      1. From the Website Configuration Tool, click Page Types > About.
      2. In the About Page Title box, edit the text. The title displays in the browser title bar and below the header on your About page.
      3. In the About Page Contents box, enter and edit content.
        • The contents may optionally include HTML.
        • Note that you can insert images and links, specify fonts and background color using the editor.
        • If you have HTML code you created using another editor that you want to paste into this editor, or if you want to edit in the code view, click the HTML button. (To replace the About page default template with your custom page, see below.)
      4. Click Save Changes.
      5. Click Preview or Publish.

Create help/FAQ page

For this exercise:

      1. Create Help or FAQ Directory name and Folder in Manage files
      2. Upload the index.php file from the sample files

To add custom pages using the Website Configuration Tool

      1. From the Website Configuration Tool, click Custom  > Custom Pages.
      2. Enter the name of the page (letters and numbers only with no punctuation).

Note: The name is used as the breadcrumb link label (does not have to match the file name). We recommend you use short page names to keep URLs shorter and link labels more readable. When you click Save, this becomes the directory name (with any spaces removed, all lowercase letters) for the location where all files for this page (including images) can be uploaded. A blank index.php file also is created. Name the file containing your custom page “index.php” so you can upload it to replace the placeholder page.

      • Global-level custom page directories are created in: <Hostname>/cdm/<directoryname>
      • Collection-level custom page directories are created in: <Hostname>/cdm/<directoryname>/collection/<CollectionAlias>
      1. Check Show this page on my website to enable the custom page.
      2. Check Use website layout and styles if the page should use the same configurations for layout as other pages on your website. Uncheck if the custom page code includes a custom layout and styles.
      3. Click Save Changes to create the directory for the custom page and related files.

      1. Click Manage Files. The Manage Files dialog displays. The Manage Files dialog displays.
      2. Click and Insert Folder name same as the Directory name.
      3. In the folder, use the Upload  tab () and Drop “index.php” from the sample files.

      1. Close the Manage Files dialog.
      2. Click Save.
      3. Click Preview or Publish.

 

Adjust navigation tabs to include: Home, Search, About, Help/FAQ

For this exercise, change navigation tabs to include: Home, Search, About, and FAQ

To configure the header navigation

      1. From the Website Configuration Tool, click Navigation > Global Navigation.
      2. Add or edit navigation links:
        • To add additional links, enter text in the next empty Link Label text box and add the corresponding URL.

The link label is the text that will display. The URL is the hyperlink. Note that any links to pages on your CONTENTdm Website must include “/cdm/”, for example, the link to Browse All is “/cdm/search”. Mailto links should use the form “mailto:”. Web links to pages outside CONTENTdm Website should use the form http://.

        • To edit existing links, edit the text in the Link Labels text box and the corresponding URL.
      1. Click Save Changes.
      2. Click Preview or Publish.

The URL for the FAQ page can be located by accessing Custom  => Custom Pages => Manage Files, and then clicking on the Help of FAQ file. You can then right-click on index.php and click Show URL.

Use the URL from the file that opens.

The URL for the About page will be /cdm/about/collection/[your collection id]. To locate you collection ID, click preview, and your collection id will appear after the /collection in the URL. For example:

For this example, the collection ID would be p15851coll22

The URL you would use in this example for the about page is: /cdm/about/collection/p15851coll22

Select viewing options for PDF and Compound Objects

A compound object displays in a distinct interface that is different from the image viewer. The Compound Object Viewer enables the end user to navigate the objects’ multiple pages and to review page-level or object-level metadata.

The Website Configuration Tool enables you to:

      • Configure which navigation tabs display in the Compound Object Viewer (thumbnails or contents or both)
      • Select whether to show the compound object item title in the viewer tab
      • Select whether to display page-level URLs and URLs for the entire compound object, if the Reference URL link is enabled

For this exercise adjust the following:

      1. Compound objects—limit display to contents
      2. PDF—switch to displaying a link for users to view rather than displaying in website

To configure the navigation tabs

      1. From the Website Configuration Tool, click Page Types > Compound Objects.
      2. In the Display contents navigation tabs box:
        • Select Thumbnails to enable navigation of a compound object by thumbnail images.
        • Select Contents to enable navigation of a compound object by text-based links (the link text is the page Title).
      3. If you chose to display both navigation tabs, in the Choose default view for tabbed area box:
        • Choose Thumbnails to display navigational thumbnail images by default.
        • Choose Contents to display text-based links by default.
      4. Click Save Changes.
      5. Click Preview or Publish.

To select the display of the compound object title in the navigation tab area

      1. From the Website Configuration Tool, click Page Types > Compound Objects. Click More Compound Object Configurations.
      2. In the Item title in tabbed area box:
        • Choose Show (Default) to include the title of the compound object in the tabbed area of the Compound Object Viewer.
        • Choose Hide to hide the title of the compound object in the tabbed area of the Compound Object Viewer.
      3. Click Save Changes.
      4. Click Preview or Publish.

To select Reference URL options for compound objects

      1. From the Website Configuration Tool, click Page Types > Compound Objects.
      2. Click More Compound Object Configurations.
      3. In the Reference URL Preferences box:
        • Select Show reference URL for overall item to display the Reference URL for the compound object.
        • Select Show reference URL for individual pages to display the Reference URL for an individual page of the object.
      4. Click Save Changes.
      5. Click Preview or Publish.

PDF Files

Files in PDF format have additional configurable options for their display in your website.

The Website Configuration Tool enables you to:

      • Select whether to display the PDF file in your website (an embedded version of Adobe Reader displays within the CONTENTdm viewers) or whether to link to the PDF file so that it opens in Adobe Reader in a new window (your website remains open in a separate window)
      • Configure whether portions of the Adobe Reader interface display (embedded version)
      • Select whether search terms are passed through to the Adobe Reader search function (embedded version)

To select whether to display PDF files in your website or link to a separate view in Adobe Reader

      1. From the Website Configuration Tool, click Page Types > PDF Files.
      2. In the PDF File Display box:
        • Choose Display in Website to show PDF files in an embedded version of Adobe Reader that displays within the CONTENTdm viewers.
        • Choose Display link for users to view in Adobe Reader to link to PDF files so that they open in Adobe Reader in a new window (your website remains open in a separate window).
      3. Click Save Changes.
      4. Click Preview or Publish.

To configure whether portions of the Adobe Reader interface display (embedded version)

      1. From the Website Configuration Tool, click Page Types > PDF Files.
      2. In the Show navigation pane within Adobe Acrobat box:
        • Choose Yes to display the Adobe Reader navigation pane by default in the embedded version.
        • Choose No to hide the navigation pane.
      3. In the Show toolbar within Adobe Acrobat box:
        • Choose Yes to display the Adobe Reader toolbar in the embedded version.
        • Choose No to hide the toolbar.
      4. Click Save Changes.
      5. Click Preview or Publish.

To select whether search terms are passed through to the Adobe Reader display (embedded version)

      1. From the Website Configuration Tool, click Page Types > PDF Files.
      2. In the Provide search-term pass-through in Acrobat box:
        • Choose Yes to pass search terms to Adobe Reader in the embedded version. (Terms that match the CONTENTdm search terms are highlighted within the PDF file.)
        • Choose No to disable the pass-through of search terms.
      3. Click Save Changes.
      4. Click Preview or Publish.

 

Summary | Software & Tutorials | Sample Collections | Exercises | Resources & Best Practices