Hampshire College RedDot User's Guide

Version 4.1 / September 9, 2009


Table of Contents


Documentation Updates............................................................................................................................... 3

Before you Begin......................................................................................................................................... 3

About RedDot............................................................................................................................................. 4

Browsers and Platforms............................................................................................................................... 4

Get Started!................................................................................................................................................. 4

RedDot Menus............................................................................................................................................ 5

Left Menu.................................................................................................................................................................................................. 5

Top Menu (only appears when a page is open and is only relevant to the page that is open)................................................... 5

Content Types (Templates)........................................................................................................................... 6

Things to Avoid............................................................................................................................................ 8

Step by Step Instructions............................................................................................................................. 8

Create a New Foundation Page.............................................................................................................................................................. 8

Add a Center Section.............................................................................................................................................................................. 9

Add a Banner Ad................................................................................................................................................................................... 10

Disconnect a Page (recommended instead of Delete)...................................................................................................................... 10

Create URL Pages, File Pages and Page References in the Navigation......................................................................................... 10

Edit Navigation Order............................................................................................................................................................................ 10

Edit Headline and/or Filename of a Foundation Page...................................................................................................................... 10

Setting an appearance schedule (example: set dates to auto publish/expire a banner ad)......................................................... 11

Navigation: SmartEdit vs Page Preview...................................................................................................... 12

Managing Images and Files in the Asset Manager........................................................................................ 12

Switch folders......................................................................................................................................................................................... 12

Uploading Images and Files................................................................................................................................................................. 13

Previewing Images................................................................................................................................................................................. 13

Editing Images........................................................................................................................................................................................ 13

Inserting Images into Content............................................................................................................................................................. 13

Inserting Files into Content.................................................................................................................................................................. 14

Using Firefox to link to a PDF or add an image:.......................................................................................... 14

Text Editor Feature Differences.................................................................................................................. 15

Formatting content within the text editor...................................................................................................... 16

Embedding video in the text editor.............................................................................................................. 17

Workflow.................................................................................................................................................. 17

Updating the A to Z.................................................................................................................................... 19

Updating the Home Page........................................................................................................................... 20

The two banner ad images and the URLs they link to..................................................................................................................... 20

Changing home page images............................................................................................................................................................... 20

Top News Stories................................................................................................................................................................................... 21

Working with News Stories and Student Project Pages............................................................................... 21

News and Project Page Lists..................................................................................................................... 22

Editors and Publishers How-To.................................................................................................................. 23

Important items to remember for both editors and publishers........................................................................................................ 24

To Publish a Page on Demand............................................................................................................................................................. 24

Intranet vs WWW..................................................................................................................................... 26

Navigate to your Intranet page in SmartEdit..................................................................................................................................... 26

Navigation Differences......................................................................................................................................................................... 27

Changing the order of your navigation.............................................................................................................................................. 28

Create and connect a new Intranet foundation page....................................................................................................................... 28

Add a new Intranet file page................................................................................................................................................................ 28

Intranet Files........................................................................................................................................................................................... 28

Reusing content and linking to www pages...................................................................................................................................... 29

Workflow................................................................................................................................................................................................. 29

 


 


Documentation Updates

Updates to this document can be found on the web at the following URL:

http://www.hampshire.edu/reddot/help

A print-friendly PDF version is located at the following URL:

http://www.hampshire.edu/reddot/help/reddot_help.pdf

Before you Begin

Before you begin to edit it is important to understand the intended structure of the web site.  Documentation covering the first few levels of navigation can be found at the following URL:

https://intranet.hampshire.edu/cms/index.php?id=10593

Click on Hampshire nav v.3.5 to view the PDF document.  This structure was designed by the Web Committee members and should be taken into consideration when building pages within RedDot.  It shows you where each department’s information resides in the hierarchy of the website.  Becoming familiar with this structure will make it much easier to navigate when you are editing the web site.

It is also a good idea to spend some time looking at the completed portions of the web site before you start to add your own content.  You can find the web site at www.hampshire.edu. While you work on your own pages you may find it useful to keep the web site open on a browser tab to refer to when you have questions about style and layout.

Understanding the Web Site Navigation

As you look through the web site, notice the different methods used for navigating the web site.  At the top of the screen is a navigation bar for finding general areas within the web site (Admissions, Academics, etc.).  Rolling over those choices pops down a list of choices within that area.  Notice that each are has its own list color (Admissions is maroon, Academics is light blue); these colors are used within each area’s web pages as a visual clue to the current area being browsed.

Once you are off the home page of the web site you will notice a navigation box along the left side.  Listed in this area are the “sibling” and “child” topics for this page.  Sibling topics are at the same level as the topic you are looking at.  Child topics are the lower level topics related to the topic you selected.  In the image above, “School of Cognitive Science” is a sibling of “School of Humanities, Arts, and Cultural Studies,” and “Programs” is a child of “School of Cognitive Science.” 

The final navigation method for the end user is the “breadcrumb” trail above the title of the page.  This allows the user to pop back up to any point in the navigation chain.  This exists on all pages except the very top level home page.

About RedDot

RedDot is the name of the authoring system Hampshire College has chosen to use for creating and editing our web site.  Before you begin using RedDot you will need to have a RedDot account set up and you must attend a training session, which you can initiate by e-mailing reddot@hampshire.edu. You will log into RedDot using a web browser to access the web pages you are editing.

Browsers and Platforms

Internet Explorer version 6.0 or higher is the recommended browser for authoring content in RedDot.  Older versions of Internet Explorer on a Mac will not work with the Hampshire web site.  Most of RedDot's functionality will work in other browsers, but there is one exception:

Changing Navigation Order - The Navigation Manager, which is the tool that allows users to edit the order of the navigation links in the left sidebar, only works in Internet Explorer. We are working to find a solution to this issue. If you are unable to run Internet Explorer on your computer and you need to edit your navigation order, send an e-mail to reddot@hampshire.edu with the page information and proper navigation order.

Safari-specific problems: We have had a few reports from Safari users that have experienced the following problems.  Keep in mind that these reports were from different users on different versions of Safari.  While some of these may function properly depending on the version of Safari used, we recommend that users edit their content in RedDot using Mozilla Firefox if they do not have access to Internet Explorer version 6.0 or higher. See the section titled “Text Editor Feature Differences” for a description of IE vs. Firefox differences.

  1. When a user first logs in and attempts to choose a project, nothing happens when they click on the project.
  2. When searching for a page nothing happens when the user clicks on the Start button to begin the search.
  3. After typing text in the rich text editor, the OK button will not actually save the text.

Old versions of Mozilla Firefox on MAC:

  1. There has been one report from a MAC user with Firefox 1.0.0.6 that blank pages were appearing when trying to reference a page.  The user upgraded to the latest version of Firefox and this corrected the problem.

Firefox Version 3 on both MAC and PC:  Firefox 3 is still not a RedDot supported browser and therefore we do not recommend using it.  Please e-mail reddot@hampshire.edu if you experience any problems.

  1. There used to a problem with a blank screen appearing upon accessing the search page and the tasks list, but this was fixed on 09/23/2008. 
  2. Discovered on 01/15/2009 – When typing text into the text editor, sometimes the text does not save when the OK button is clicked.  To avoid this problem, be sure to click on the save icon in the text editor before clicking on the OK button.

Get Started!

To start up RedDot, go to https://cms.hampshire.edu/CMS and use your HampNet login information.

The first time you log in you will need to choose project www from the Projects section located in the Main Menu. Once a project is chosen you will see the main menu on the left side of the screen.   You can edit pages by clicking on the SmartEdit tab.

 

 

 

RedDot Menus

Left Menu

Homepage shows a user any pages they are currently working or have sitting in workflow, categorized by their status in workflow

Web Content Manager/SmartEdit is where users go to edit pages.  It looks just like the web site and users can navigate to the pages they want to edit.

SmartTree and Translation Editor are grayed out because users do not have access to them.

Asset Manager will appear in the left menu when a user is on the Homepage.  Use the asset manager to upload, edit and delete images and files.

Search is a powerful tool that allows users to find pages anywhere in RedDot. Users can search page content and headlines and they can filter their search with multiple criteria.

Tasks is where users can submit their pages to workflow or reset pages back to draft status (pull them out of workflow) to work on them again.  This is also where editors and publishers will see pages waiting for them in workflow to approve/reject and publish.

Main Menu contains the Projects section, which is where a user can select to work on www.  This is currently the only project available and users should only need to select this project the first time they login.  This menu also contains Display Settings and User Settings, neither of which should be changed.  Categories, Server Manager and Create a New Unconnected Page options are grayed out because users do not have access to them.

Help is where users can get some basic help with RedDot functionality.  This help menu is not specific to Hampshire's www project, but contains general RedDot helpful information.

 

 

Top Menu (only appears when a page is open and is only relevant to the page that is open)

Properties is where a user can change the headline/title of a page or the filename of a page.

Action is the most-used menu because it contains options to delete a page, submit to workflow, show versions, page preview and edit navigation order.

Linking shows where a page is connected.  For example, if a banner ad page is being used on three different foundation pages, the linking menu will show those three foundation pages.  This is also where a user can access the appearance schedule.  Click on the icon that looks like a clock to set a start and end date/time for a page to appear.

Keywords – users will not need to use this menu.

Notes are visible to any user who has the ability to open the page.  These are mainly used by workflow editors to describe a problem upon rejecting a page change.  If your page has been rejected and is waiting for correction, check the notes menu.

Page Information contains all information about a RedDot page, including the Page ID and the content class.

 

 

 

Content Types (Templates)

Foundation  - There is a foundation template for each section of the web site (Admissions, Academics, etc) that determines the color of the navigation box and the default header image.

Foundation w/o Sidebar – Used in the rare case that a page without the left sidebar or navigation is needed.  The center content area is as wide as the header image.  This template will be available as soon as the proper header images are ready.

URL Page – Used for pages which need to appear in the navigation but redirect a user to an external URL.

File Page – Used for pages which need to appear in the navigation but direct a user to a file, such as a PDF.

Reference Existing Page – Used for pages which need to appear in the navigation but redirect a user to a page in the Hampshire web site (a page that was created in RedDot).  This should always reference a foundation page.

Center Body Shell – Container page that holds containers for other center content sections to populate.

Title and Top Text – Fits into the top container of the center body shell page. Allows users to enter a headline, which appears as the title in uppercase blue letters, and a text field.

Text Left Side – Contains a headline, which does not appear on the page, and a text field.  Fits into a large left column in the center content section.

 

Banner Ad (Did you know?) – Horizontal –Contains a square image, a headline, brief text (should be limited to about 10-12 words) and a link.  The headline does not appear; the headline is an image that says, “Did you know?”

 

 

Banner Ad (Custom) – Horizontal –Contains a square image, a headline, brief text (should be limited to about 10-12 words) and a link.  These function the same as “Did you know?” except that the headline DOES appear.

 

 

Banner Ad (Image) – Horizontal – Contains a single image (created by Communications) and a link.  For example, used for large event banner ads that need pretty fonts.  Used on left sidebar.

 

 

 

 

 

 

 

 

Banner Ad (Did you know?) – Vertical  Contains a small square image (65x65 px), a headline image of “Did you know,” brief text and a link (optional).  Used in right column of center content.

 

 

 

 

 

Banner Ad (Custom) – Vertical - Contains a headline (in green text), brief text and a link (optional).  Used in right column of center content.

 

 

 

 

 

 

 

 

 

Banner Ad (Image) – Vertical – Contains a single image (created by Communications) and a link.  For example, used for large event banner ads that need pretty fonts.  Used in right column of center content.

 

 

 

Contact Us – Used in the lower left corner.  Pre-populated with “contact us” title so headline does not appear on page.  Also pre-populated with “Hampshire College 893 West Street Amherst, MA 01002.”  Fax, (toll free) and Mail Code will only appear if those fields have been populated.  Other fields that may be populated are office/dept name, building/location and e-mail address.

 

Quote Block – Allows user to enter a headline, a quote and the name of the person quoted.

 

 

 

 

Spotlight - Horizontal – Contains headline image of “In the Spotlight,” a square profile image, name, brief description and a link.  Used on left sidebar.

 

 

 

Spotlight – Vertical – Contains headline reading “In the Spotlight,” a square profile image, three brief lines of caption text and a link.  Used in right column of center content.

 

 

 

 

 

Spotlight (Custom Headline) – Vertical – Contains a headline (appears in magenta text), a square profile image, three brief lines of caption text and a link.  Used in right column of center content.

 

 

 

 

Things to Avoid

1         Do not “Connect to an Existing Page” or “Reference Page” in the navigation.  To link to a RedDot page in the navigation, click on “Create and Connect Page” and then choose the “Reference Existing Page” template.

2         Do not use the “Assign URL” option when creating a URL Page in the navigation.  To create a URL Page in the navigation, click on “Create and Connect Page” and then choose the “URL Page” template.

3         Do not use the “Undo Page” option in the action menu.  This will delete your page.

4         Do not delete pages unless you are sure that nobody else is using that content or you are sure that you will not need it again in the future.  Disconnect a page or delete reference, but if you delete a page it will remove it from RedDot entirely, even if another page is using that content.

5         The check spelling option in the action menu does not currently function.  If you want to check spelling on your content, use the spell checker available in the text editor when you edit a text field.

 

Step by Step Instructions

Create a New Foundation Page

1         Click on the  red dot in the upper left corner of the page you want to add a child to.  In the navigation box on the left, click on the red dot.  Choose “Create and Connect a Page” from the menu.

2         If there is more than one template or content class available to choose from, you will need to choose the appropriate content class from the list.  For most pages you will choose the foundation template for the section in which your page will live.

3         Once you choose the content class, you will be asked to enter a headline/title, which will appear in the left navigation box.  Click OK and your page will be created. To add content to this page, click on its title in the left navigation box and then click on the  red dot in the upper left corner.

 

Add a Center Section

1         Open the foundation page by clicking on the  red dot in the upper left corner and then click on the  red dot located under the breadcrumbs.  When you enter a headline/title it will not appear on the page, but still name it logically as it will be useful for searching for the page later on.  This new page is basically a shell for the center content pages

2         .The center section is divided into 3 sections, each of which can be populated with its own page.  There is a top page, which contains a title and some text, a left section containing text and a right section where you can add a spotlight or some text. You do not need to populate all 3 sections, but you will want to have a top section with a title.

3         To add a top section page click on the  red dot next to add/remove a top section with title.  Click on “Create and Connect Page” and you will be asked for a headline/title.  This headline/title will appear at the top of your center content in bold uppercase letters.  Once you add a headline/title the page will be created and then you can click on the  red dot to edit the headline/title and text in the top section.

4         To add a section of text on the bottom left side, click on the  red dot to open the center content page (the shell page) and then click on the  red dot.  The headline on this page will not appear on the page, but remember to name it logically. You can then click on the red dot to edit the text.

5         To add a spotlight to the bottom right section, click on the  red dot to open the center content page and then click on the  red dot.  If you want to create a new spotlight, for example, click on “Create and Connect Page” and choose vertical spotlight from the list of content classes.  Give it a logical headline, but it will not appear on the page. Click on the red dot to edit the spotlight and you will be able to fill out the spotlight fields; choose an image by clicking on the green pencil, fill in the name of the person in the spotlight and a brief caption about them, such as their start year or occupation.

 

Add a Banner Ad

1.        In the left sidebar, click on one of the  red dots.  If you want to show an existing banner ad then click on “Reference an Existing Page” and search for the banner ad.  If you want to create a new banner ad then click on “Create and Connect Page.”

2.        Choose the proper content class for the type of banner ad you would like to create.  In most cases this will be a horizontal banner ad.  Enter a headline/title (this will not appear anywhere on the page, but give it a logical name in case you or another user needs to search for this banner ad in the future).

3.        Once you give it a title, you can click on the  red dot above the banner ad to edit it. Here you can edit the title, if need be, add an Alt attribute, and click on the green pencil to open the asset manager.  The asset manager will allow you to preview and select an image.  To preview an image click on the thumbnail image.  To select an image click on the title of the image and then click OK.

4.        After you've selected an image, you'll need to click on the red dot to edit the banner ad link.  This is the URL or page you want the user to be taken to when they click on the banner ad.  If it is an external page you can choose “Assign URL”. If it is an existing page already living in RedDot then you can choose “Reference Page.”  If the page does not already exist but will live in RedDot, leave it blank for now, create the new page wherever it will live, and then go back and edit the link to reference the page.

Disconnect a Page (recommended instead of Delete)

To disconnect a banner ad, for example, you would click on the open/close page red dot in the upper left corner to open the foundation page, then click on the  red dot.  Here you will have the option to “Disconnect page from list.”  If the banner ad page actually lives somewhere else and your page was only referencing the banner ad page, you would have the option to “Delete Reference” instead of disconnect.

 

Create URL Pages, File Pages and Page References in the Navigation

When you open the foundation page and click on the red dot to add/remove/change navigation, some of the content class options you should have when you choose “Create and Connect Page” are URL Page, File Page and Reference Existing Page.  This will allow you to enter a headline, which will appear in the navigation.  Once the page is created a red dot will appear at the bottom of the navigation box to edit the link for a URL page, edit the document for a file page or edit the reference for an existing page.  Do not use the “Assign URL” option in the red dot menu for add/remove/change navigation.  If you use the “Assign URL” option then your link will not show in the navigation.

 

Edit Navigation Order

NOTE: This currently only works in Internet Explorer.  If you are unable to run Internet Explorer on your computer and you need to edit your navigation order, send an e-mail to reddot@hampshire.edu with the page information and proper navigation order.

 

To change the order of the links in the left side navigation bar, go to the page whose children you want to sort and then open the foundation page by clicking on the  red dot in the upper left corner.  Click on the action menu in the top menu bar and choose “Edit Navigation Order” from the “Navigation Actions” section.  This will show you how the navigation is currently sorted and gives you arrows to move highlighted children up or down in the list.

 

 

Edit Headline and/or Filename of a Foundation Page

Click on the red dot in the upper left corner of the page.  Click on the properties menu in the bar along the top.  A screen will appear allowing you to change the headline/title of the page, which is what appears in the navigation.  This is also where you can add/change a filename.

 

NOTE: Filenames should only be used in those rare cases when you need to specifically name a page so that it has a logical URL when it is published.  An example of this would be a page in the Admissions section that has a filename of wegotin.htm so that when the page is published it can be accessed by typing the following URL into a browser: http://www.hampshire.edu/admissions/wegotin.htm.  Each main section of the site will publish to its own folder, so the main page for each section will have a filename of, for example, index_admissions.htm.  Do NOT change the file name of your main page.

 

 

 

 

 

WARNING!!!

Do not name any page index.htm or index.html or it will conflict with the home page when published!  If you give your page a filename DO NOT use capital letters, spaces or special characters.  Your filename needs to have .htm at the end of it.  When in doubt, leave the filename blank and RedDot will assign a unique filename to your page, which will be the page ID followed by .htm.

Setting an appearance schedule (example: set dates to auto publish/expire a banner ad)

Appearance schedules can be set for any type of page, not just banner ads, but it is most common to expire a banner ad.

1.        Click on the open/close banner ad section reddot.  Once the banner ad page is opened the menus should appear along the top.

2.        Click on the Linking menu.  The linking screen will show what page(s) and container(s) the banner ad page is connected to.

3.        Click on the clock icon  to the right of the page you want to set an appearance schedule for.  Here you can set a start date/time and an end date/time.  The start date will be the day you want the banner ad to appear on the page and the end date will be the day you want the banner ad to disappear from the page.

NOTE: A page that has expired (the end date of an appearance schedule has already passed) will disappear from your view in SmartEdit, but the page will still be connected.  If you need to see the expired page to edit it and maybe set a new appearance schedule, you must change your RedDot display settings.  To do this, click on the Main Menu button on the left, click on Display Settings, then put a check next to the Ignore appearance schedule option and click OK.  This option will allow you to see expired pages in RedDot, but those expired pages will not actually publish to the live Web site unless their appearance schedule is changed.

Navigation: SmartEdit vs Page Preview

In order to speed up page load times for users working in SmartEdit, we have removed some of the navigation from being displayed in the SmartEdit interface.  This change does not effect how anything is done in RedDot, it is simply a change to the way the navigation looks when one is in SmartEdit. 

On the live Web site and in page preview mode, the navigation in the colored box displays the current page with a white arrow next to it, the child pages indented in a lighter colored area, and the siblings.  In SmartEdit, the navigation in the colored box now only shows the current page with a white arrow next to it and the child pages indented in a lighter colored area.  The siblings are no longer shown. 

Also note that child pages will be listed in the opposite order than they normally appear on the live Web site or in page preview mode.  The actual navigation order and sibling links may be viewed by opening a page preview.  Page preview takes a little longer to render than SmartEdit because it has to show these links.  When a page is published it will look exactly how it looks in page preview mode.  The navigation order can be changed by going to the Action Menu and clicking on Edit Navigation Order.  Note that this change will not be reflected in SmartEdit.  If you would like your navigation order to be reflected in SmartEdit, you can change it manually by clicking on the add/remove/change navigation reddot at the top of the colored navigation box.  From there click on Edit Page Order.  Editing the page order will only be reflected in the SmartEdit interface.  You must edit the navigation order if you want the changes to be reflected on the live Web site.

 

 

Managing Images and Files in the Asset Manager

The Asset Manager is what RedDot uses to organize images and files.  To upload, edit or delete images/files, click on the Homepage button in the left menu and then click on the Asset Manager button.  At the top of the screen you have the option to search images/files by filename, author and last editor.  The folder you are located in appears underneath the search options.  You have the option to view the images by thumbnail or in a list form, and you also have the option to switch folders. 

 

Switch folders: shows a user all folders they have access to use. 

  • Banner Ad Images are maintained by the Communications department.  Used in cases where the entire banner ad needs to be an image, usually for “pretty” font purposes.
  • Custom Banner Ad and Spotlight Images are maintained by the Communications department.  They are all square images used for creating custom banner ads and spotlights.
  • Header Images are maintained by the Communications department.  They are stored in one large folder, which allows users to choose from a wide variety of images across the campus.  We suggest that users check the usage on header images before they select them and if a header image is in use on several pages already then it would be best to choose a different header image.
  • Shared Images/Files is a folder that all users have access to.  If a user wants their image/file to be available to other users on campus they should upload it directly to this folder. 
  • Group/department/office-specific folders are available to users in the respective groups. Only users in specific groups have access to upload, edit, delete and use images and files in these folders.  If you do not see a folder specific to your group and you feel there is a need for one, please e-mail reddot@hampshire.edu with details such as folder name and users who need access to it.

       Uploading Images and Files

·         First a user must switch to a folder that they have access to upload to, which is the shared folder or a group-specific folder within the shared folder.

·         Underneath the Thumbnail, List and Switch Folder options are two links; Select asset from local file system and Move Assets.  Click on Select asset from local file system, then click on the Browse button to search your computer for an image or file to upload (in most cases you will be uploading jpg images and pdf files).  Click on the Move Assets link only if you wish to move images or files from one folder to another.

Note: There is a file size limit of 500,000 bytes for images.  There is no file size limit for PDFs, but for best practice always save files as small as possible.  Files over 5MB are discouraged since they take a very long time to download.

       Previewing Images

·         Click on a thumbnail image to preview the image at its actual size.  It will open in a separate browser window.  You may need to turn off a pop-up blocker or edit pop-up blocker settings to allow pop-ups from this site if you have a pop-up blocker installed.

        

       Editing Images

·         Click on an image filename to select an image.  The following File Information is listed on the right side: Height, Width, Color depth, File size, Original author, Entry date, Last editor, and Modification date.

·         Crop Image - Choose this action to crop an image using the mouse and save it in the following dialog. The cropped image can replace the original file, or you can save it in the Asset Manager with a different name. If versioning is enabled, you can save a new version of the original file with the same name as the original file.

·         Extended Image Editing Options - Choose this action to edit an image in the following dialog. You can flip horizontally and vertically, change the image size, convert it to black and white, or to negative.  You can also enter ImageMagick commands.  Note: The width of an image should be no more than 460 pixels, otherwise the image will expand beyond the limits of the foundation page.

·         Update File - Choose this action to replace a file in the Asset Manager folder with a file of the same name on your local computer. This option is not available if versioning has been enabled for your project.

·         Delete File - Choose this action to delete the file displayed in the info area.

·         Refresh Thumbnail and File Information - Choose this action to refresh the thumbnails and information for the selected file. Files with a custom thumbnail are assigned the default thumbnail as a result.

·         Replace Thumbnail - Choose this action to save a different thumbnail for a file in the Asset Manager folder. You configure the relevant settings in the following dialog.

·         Show Usage - Choose this action to view in the following dialog window where in your project a file is used.

       Inserting Images into Content

·         Add/edit a header image by clicking on the reddot to edit header image.  Then click on the green pencil icon to open the asset manager if it does not open automatically.  You will be brought directly to the header images folder.  Click on the filename to select the image, click on the show usage link on the right side to make sure the image is not being used on too many other pages, then click on the OK button to change the image.

·         Add/edit a banner ad image by clicking on the reddot to edit banner ad image.  Follow the same steps as you would to edit a header image, the only difference being that you will be brought directly to the image or custom banner folder, depending on what type of banner ad you are editing.

·         Add/edit an image inside center content text by clicking on the reddot to edit text.  When the rich text editor opens click on the icon to insert an image.  If you’re using IE, choose the option to select an image from the server then choose the folder containing the image you wish to use.  If you’re using Firefox, click on the Asset Managers tab to choose a folder, then go back to the Image Info tab and click on the Browse button to search for the image. The folder you choose will most likely be the Shared Images/Files folder or a group-specific folder.  If you have yet to upload the image, you can upload it now by clicking on the link in the asset manager to select asset from local file system.  Select the image by clicking on the filename and then click on the OK button. 

Note: If you’re using Firefox and the asset manager window does not close when you click on the OK button, click on the Cancel button after clicking on the OK button and the URL to the image should appear in the URL field next to the Browse button.

       Inserting Files into Content

·         Using Internet Explorer: When the rick text editor is open, highlight the text you want to link to your file and click on the Insert/Edit Link icon .  Click on the Insert File Link icon  to the right of the href field.  Choose Select Image from Server, click OK, and then select the folder where your file is located.  Click on the filename to select the image and click OK. 

·         Using Firefox: When the rich text editor is open, highlight the text you want to link to your file and click on the Insert/Edit Link icon.  Click on the Asset Managers tab and choose the folder where your file is located.  Then click on the Link Info tab and click on the Connect Asset link.  If you have yet to upload the file, you can upload it now by clicking on the link in the asset manager to Select asset from local file system.  Click on the filename to select the image and click OK. 

 

Using Firefox to link to a PDF or add an image:

1. Click on the Red Dot to open the top section.

2. Click on the Red Dot to edit title and top text.

3. Highlight the text you want to link to your file.

4. Click on the Insert/Edit Link icon.

1. Click on the Asset Managers tab.

2. Choose the folder where your file is located or where you will put the file once you upload it from your computer. If you are not sure, put it in the shared folder.

3. Click on the Link Info tab.

4. Click on the Connect Asset link.

5. If the file is already on the web, just find and select the file.

If the file is on your computer

6. Click on the link in the asset manager to “Select asset from local file system.”

 

 

7. Browse for the document on your computer.

8. Find the document and Click Open.

9. Find the document again in the asset manager.

10. Click OK.

11. Click OK to close the text editor.

12. Give yourself a pat on the back! (Don’t forget to submit the page to workflow when you are finished)

 

Text Editor Feature Differences

The text editor features are slightly different depending on whether you use Internet Explorer or Firefox.  Some of the main differences are highlighted below.

·         Spell check - the spell check icon only appears in IE.  Firefox users can spell check their text field by right clicking (or using control+click on a Mac) and choosing spell check this field from the menu.

·         Jump-to marks/anchorsIE has an icon to define jump marks.  Place your cursor where you want a jump mark to be placed and then click on the Define Jump Mark icon.  Here you can give the jump mark a name.  Highlight the text you want to be a link to that jump mark and click on the Insert/Edit Link icon.  Here you can either enter #jumpmarkname (where jumpmarkname is the name you gave to your jump mark) in the href field or you can click on the Insert Jump Mark icon to choose the jump mark you created.  In Firefox the process is similar, but instead of inserting a jump mark you can insert an anchor with the Anchor icon.  Once the anchor is created, highlight the text you want to be a link to that anchor and click on the Insert/Edit Link icon.  On the Link Info tab the Link Type should be set to URL.  Change the Protocol to <other> and in the URL field enter #anchorname (where anchorname is the name you gave to your anchor).

·         Insert/Edit Image – see the section titled, “Inserting Images into Content” above for an explanation on the differences between IE and Firefox.

·         Insert/Edit Table & Table Properties – IE has an icon to insert a table , an icon to format the table , and several icons for manipulating table rows, columns and cells .  Firefox only has one icon to insert/edit table , but it is actually only used to insert the table.  In order to manipulate rows, columns and cells or access table properties, one must right click (or control + click on a mac) and access these options from the menu that appears.

Formatting content within the text editor

·         Images must not exceed a width of 450 pixels.  If you want to use a larger image, do NOT put that image into the text editor and then resize it by clicking and dragging with your mouse.  A large image needs to be resized either in the asset manager with the extended image editing options or in an image editing program such as Photoshop, Picasa or Gimp.

·         Tables must not exceed a width of 450 pixels and they must not have a left alignment set, otherwise the entire page layout will become a jumbled mess in certain browsers.  Tables tend to look much cleaner when there are no background colors or borders.  All of these options may be defined within the format table properties  in the text editor.

·         By default the text editor will begin a new paragraph when a user hits the Enter key, which makes everything look douple-spaced.  To get a single space, hold down the Shift key and hit the Enter key.

·         When copying and pasting from word processing programs, especially from Microsoft Word, use the PASTE UNFORMATTED option  in the IE text editor or the PASTE AS PLAIN TEXT option  in the Firefox text editor.  You may need to redo some of the formatting in the editor afterward, but this will strip out any bad characters, fonts or formatting that should not be included in RedDot pages.


Embedding video in the text editor

Many Web sites with video, including our own multimedia.hampshire.edu, have embed code on the page that you can use to embed their video into your own Web page.  You can do this in RedDot, however, it is a slightly tricky process.  As long as you have the embed code for the video, follow the steps below to put the video inside the title and top text of your RedDot page.  The below example uses embed code from one of the videos on multimedia.hampshire.edu.

1.        Create a normal RedDot page with the necessary center content pages.  Open the title and top text page and click on the reddot to edit the title and top text.

2.        When the editor opens, you can type text in the editor as normal if you want to have text above or below the video.  If using Internet Explorer, right click inside the text field of the text editor and choose source code from the menu.  If using Firefox, click on the source tab in the upper left corner of the editor.

3.        Once in source mode, this allows html code to be put into the editor.  Paste the embed code here.  It should look something like this:

4.        Be sure to get out of source code before clicking OK to save.  If using Internet Explorer, right click in the text area and choose standard view from the menu.  If using Firefox, click on source in the upper left corner again.  Once back in standard mode, there should be a big black square in the text area to represent where the video is embedded.  Add any other content if desired and click OK to save.  You should be able to watch the video in both SmartEdit and preview modes, but not inside the actual text editor.

CAUTION: Make sure that the width is no more than 450 pixels, otherwise the page layout will be skewed.

Workflow

When you are finished creating pages or making changes to pages, you must submit them to workflow.  There is a small pool of editors across campus to view your creations/changes to check for problems, such as grammar or spelling errors and style inconsistency.  If necessary, an editor will make slight changes to your page(s) to correct these problems, or they will reject your page with notes to describe the problem.  Once a page is approved by an editor, it then must be approved by the publisher of your section.  Once a page is approved by a publisher it is ready to be published, which will happen overnight.  If a change needs to be published to the live web site right away for emergency purposes, contact the publisher of your section.

·         Tasks: Click on the Tasks button in the left menu to see what status of the workflow process your pages are in.

Pages saved as draft are pages that have not been submitted to workflow yet.  They are locked with your account and no other users are able to view or edit your changes until you submit them to workflow.  To submit to workflow, click on the edit pages link and then on the submit to workflow icon  next to the page you want to submit.

My pages in workflow are pages that you have submitted to workflow and are waiting to be approved.  Click on the edit pages link to see each page and whether it is awaiting editor or publisher approval.  Here you can also pull a page out of workflow to make more changes by clicking on the reset page to draft status icon .

Note: If an editor or publisher makes a change to your page, they will become the author of that page and it will no longer appear in your “my pages in workflow” list.

Pages waiting for correction are pages that have been rejected by an editor or publisher.  Click on the edit pages link to see notes from editor or publisher and to open the page to make corrections.  Once you make corrections you must re-submit the page to workflow.


Updating the A to Z

* The A to Z page is maintained by RedDot publishers.

Navigate to the A to Z page and click on the open/close top section reddot.

·         Add/Edit an entry by clicking on the add/remove page entry reddot.  Click on “Create and Connect a Page” and enter the headline of the page, which is the text that will appear on the A to Z page.  Once the page is created, find the entry in the alphabetical list and click on the “edit entry page reference/url” reddot to define where you want the entry to link to.  If the entry should link to a page that lives in RedDot, choose “Reference Page” from the menu and search for that page.  If the entry should link to a page that lives outside of RedDot, choose “Assign URL” from the menu and type in a URL.  Entries cannot link to files or PDF documents.

·         Remove an entry by clicking on the add/remove page entry reddot.  Click on “Disconnect Page from List” and select the entry that should be removed.  If the entry should be deleted permanently, e-mail the page ID to reddot@hampshire.edu.

There is no workflow on A-Z entry pages, but each entry page must still be submitted to workflow before it can be published and/or changed by another user.  Be sure to check your tasks lists for any of these pages saved as draft and submit them to workflow.

Note: A to Z entries can only link to pages that live in RedDot or URLs outside of RedDot, which means that they CANNOT link to files.  Instead consider linking to a page that links to a PDF document or creating a Web version of the information in a PDF document.

 


Updating the Home Page

* The home page is maintained by the Office of Communications.  The editable sections of the home page are as follows:

       The two banner ad images and the URLs they link to

·         Open the home page foundation by clicking on the open/close reddot in the upper left corner of the home page.

·         Under each of the banner ads there are two reddots; one to edit the banner ad image and one to edit the banner ad link.  When editing the image, the asset manager will open to the structural images folder.  The images are 144 pixels wide by 147 pixels high. 

·         To edit the link, only choose one of two options available in the menu.  If the link will point to a page that lives in RedDot then choose Reference Page and search for the page in RedDot.  If the link will point to a page that lives outside of RedDot then choose Assign URL and enter the URL to that page, beginning with http:// or https://.

NOTE: Do NOT create and connect a page or connect to an existing page here.

       Changing home page images

·         Open the home page foundation by clicking on the open/close reddot in the upper left corner of the home page.

·         Click on the Edit HomePage Images link underneath the open/close reddot in the upper left corner.

·         Click on the open/close list page reddot at the top of the center content area.

·         Click on the add/remove/edit page list reddot.

·         To add an image click on Create and Connect Page and give the page a name that is a brief description of the image.  Click OK and the list of HomePage Images will refresh with the new addition.  Follow the instructions to edit an image.

·         To edit an image click on the HomePage Image page from the list and click on the open/close image page reddot in the upper left corner.  Click on the add/edit image reddot to open the asset manager to the homepage images folder.  Upload and/or choose an image and click OK.  When the asset manager closes, be sure to click on the Action Menu along the top and release the page.  If the page is not released then the image will not publish!!

·         To remove an image click on the add/remove/edit page list and choose Disconnect Page from List from the menu.  Then choose the image page you wish to remove and click OK.  This will remove the image from publishing, but it will not remove the image from the asset manager.  Be sure to perform this step before removing an image from the homepage images folder in the asset manager.

       Top News Stories

·         To edit the news stories links on the home page go to the News section of the Web site.  In SmartEdit only, the top news stories appear as a list at the bottom of the current news stories page.

·         Click on the open/close top news reddot and then click on the add/remove top story reddot. 

·         To create a new top story click on Create and Connect Page.  *Don’t forget to also connect a new top story to the current news stories list if you want it to appear on the current news page as well as in the RSS feed.

·         To use a story that already exists in RedDot click on Connect to Existing Page and search for the news story.  Be sure to choose the page created with Foundation – News Story (as opposed to the center body shell or title and top text).

·         To add a link to a page that lives outside of RedDot click on Assign URL and enter the URL of the page beginning with http:// or https://.

·         To remove a news story from the top list click on Disconnect Page from List, choose the story to remove and click OK.

NOTE: There is a limit of five news stories that will be displayed on the top news stories list.

Working with News Stories and Student Project Pages

News stories are created and maintained by the Office of Communications.  News stories function a little differently than normal pages in RedDot because they do not “live” in the navigation.  Because of this, news stories cannot have any child pages and the only item that appears in the navigation box on a news story is the title of the current page.

·         To create a news story go to the News section of the Web site and click on the open/close news list page at the top of the center content area.  Click on the add/remove news story reddot.  Click on Create and Connect page and give the page a title.  Once the page is created it will appear in the current news story list.  Follow the instructions to edit a news story.

·         To edit a news story click on the title of the news story in the list.  Open the foundation with the open/close reddot in the upper left corner.  This page is edited just like any other page in RedDot, with one exception.  That exception is the header image.  News stories have two reddots to edit the header image.  The reddot to edit the header image goes to the normal header image folder in the asset manager.  The reddot to edit (news specific) header image goes to the news header image folder in reddot, which is only available for use on news stories.  News stories are created without a default header image.

NOTE: If you choose an image from the normal folder and then want to change to an image from the news folder (or vice versa) you must remove the original image first.  To remove the original image click on the reddot to edit the header image (corresponding to the proper folder) and click on the red x icon next to the green pencil icon.

·         To remove a news story go to the News section of the Web site and click on the open/close news list page at the top of the center content area.  Click on the add/remove news story reddot and choose Disconnect Page from List from the menu.  Choose the story to be removed and click OK.

·         To edit the order of the news story list go to the News section of the Web site and click on the open/close news list page at the top of the center content area.  Click on the add/remove news story reddot and choose Edit Page Order.

The above steps can be used for either the current news stories or the top news stories, although top news stories are accessed from the home page.  See the above section titled “Top News Stories” in the “Updating the Home Page” section for more info.

NOTE: Be sure to release each page before publishing.  When publishing a news story leave the “Publish related pages” option checked so that the home page or main news page will also publish to reflect the changes.

The current news stories, including the RSS feed, publish automatically at both noon and 4am each day.

 

News and Project Page Lists

The main Div III / Student Projects page lives in the news section of the Web site and is controlled by Communications.  Project pages are created in a similar way to news stories, in fact they even use the exact same content class.  The difference between a project page and a news story page is simply where the page “lives” or what list it is connected to.

Aside from the main news section navigation, there are 4 lists controlled by Communications:

·         Top News Stories, which we covered above

·         Current News Stories (includes/controls rss), which we covered above

·         Current Projects

·         Div III 2008

 

The breadcrumbs and publishing of a page are controlled by being connected to a list.  If you do not see a news story page or project page connected to a list, connect it, unless it is connected somewhere else.

For pages that already are connected to/living somewhere else in RedDot, you do not need to connect these pages to a list.  An example of this type of page is the "Clues you are a future Hampshire student" as it lives in the Admissions section and is connected to the admissions navigation list.

To see where a page is connected, go to the page, open the foundation in the upper left corner and click on the Linking menu along the top.

If you disconnect a page from the current news or top news list, but you still want to link to it from the projects page, be sure to connect the page to the current projects list.

Editors and Publishers How-To

The job of an editor in RedDot is to look at each piece of content as it is created or changed and make sure that there are no spelling, grammar, or style errors.  Editors should refer to the Hampshire College Editorial Style Guide (http://www.hampshire.edu/reddot/help/style_guide.pdf) to maintain consistency and accuracy on the Web site.  If editors have any questions regarding the style guide, they should contact Elaine Thomas, Director of Communications at ethomas@hampshire.edu.

The job of a publisher in RedDot is to look at each page as it is created or changed and make sure that the page contains appropriate content and is located in the proper place on the Web site.  Publishers should keep an eye out to make sure that, for example, banner ads are created properly (with images, text, working links, etc), images and tables are the proper size (no wider than 450 pixels in the center content area), links are working properly, header images are appropriate, the message of the text on the page is appropriate, the content on the page is properly balanced (ie: a page that has a banner ad in the right section of the center content should have a block of text to balance it out on the left side).  Publishers should be available to assist content authors with organizing their section of the Web site to make sure that the site is navigable and organized in a manner that both makes sense and looks good.  Publishers also have the ability to publish pages on demand in situations where a page needs to be on the live Web site right away and cannot wait until the automatic nightly publishing job.

When a page is created or changed and submitted to workflow, all editors are notified via e-mail.  Any one of the editors then will:

1.        Login to RedDot and click on the Tasks button in the left menu.  There should be a section titled “Pages waiting for release” and there should be a link telling the editor how many pages are waiting for release. 

2.        Click on the link to edit pages and a results page will list each page individually that is waiting for release.  Just like any normal search results page, the editor may change the hits per results page in the upper right corner to show more results at one time on the page.

3.        For each page in the list the page ID is shown, as well as some basic information regarding the creation and/or change of the page.

4.        To the right of each page the following icons may appear:

·          Click on this to preview the page in redline mode.  The formatting of the page may look incorrect, but redline mode will show anything that was removed highlighted in red and anything that was added highlighted in green.  The redline mode option is only available when a page is changed since a new page will not have any previous versions to compare.

·          Click on this to preview the page.  This is how the page will appear when it is published to the live Web site.

·          Click on this to release the page.  If you have looked at the page either in preview mode or SmartEdit mode and it does not need to be changed at all then release the page and it will go on to the next step in the workflow process.

·          Click on this to reject the page.  If there are changes that need to be made to this page by the author, reject the page and a screen will appear for entering notes that will be sent back to the author with a rejection notification.

5.        If an editor or publisher needs to make changes to the page, click on the title of the page and it will open in SmartEdit mode.  If it is just a small grammatical error or formatting issue that needs to be changed, most editors and/or publishers will simply make the change to the page and not reject it.  NOTE: If an editor or publisher makes a change to a page then they become the author of the page and must submit the page to workflow as an author.  If an editor makes a change to a page and then the publisher rejects the page, the rejection will go back to the editor since they were the last person to make changes to the page.

When an editor approves a page, the publisher for that section is notified via e-mail and the publisher will follow the same steps listed above to look at the page and approve or reject it.

       Important items to remember for both editors and publishers

·         Foundation pages (including File pages, URL pages and Reference Existing pages) should be approved as quickly as possible.  There is currently a bug in RedDot that will not properly publish links to foundation pages in the navigation if they have not yet been approved through workflow.  Foundation pages do not even need to be previewed, they can simply be approved unless there is a spelling error in the headline.  The only changes that can be made to foundation pages are to the headline or to the header image.  Publishers may want to glance at regular foundation pages to make sure they are connected to the proper page and that the header image is appropriate, but other than that they are generally a quick approval.

·         File pages, URL pages and Reference Existing pages are all special content classes in RedDot.  These pages, when viewed from the Tasks list either in preview or SmartEdit mode, will only show a blank white page with a reference to the file, URL or RedDot page that it is referencing.  It is basically a pointer page that cannot be previewed from the Tasks list but only by clicking on it from its parent page’s navigation.  These pages can simply be approved unless there is a spelling error in the headline, in which case the editor should reject it.

·         Editors will spend most of their time working on pages created with the following content classes: title and top text, text left side, contact us, and various banner ads.  Editors should not start working on a page unless they are able to finish their edits before they log out.  Do NOT start working on a page, log out and then come back to work on it hours or days later because this holds up the page from being approved.  It will get saved in your drafts if you work on it and do not submit it back to workflow.  Editors are not able work on a page if it is saved in another editor’s draft list.

·         Publishers need to have a backup person who can perform their RedDot duties when the publisher is out of the office.  If a publisher is going to be out of the office, send an e-mail to reddot@hampshire.edu to let us know so that the backup person can be given access to perform publisher duties during that period of time.

       To Publish a Page on Demand

·         First be sure to release the page before attempting to publish it.  Pages cannot publish with changes until they have been approved through the workflow process.

·         Go to the page in SmartEdit and open the page with the open/close page reddot in the upper left corner.

·         Click on the Action menu along the top of the page and choose the “Publish page” option.  The following screen will open.

 

By default the option for “Publish related pages” is checked.  Leave this option checked if you want all pages that this page links to or all pages that link to this page to be published.  This takes much longer because it is more thorough.  This option should be checked if a publisher is publishing a brand new page, that way its parent page and its sibling pages will be published with links to this new page.  However, if a publisher is only publishing a page to reflect a change to text, banner ad, etc on one page, then it is best to uncheck this option.

The “Publish all following pages” option is unchecked by default.  This only needs to be checked if a publisher needs to publish every single page that lives at any level lower than the page being published.  Checking this option will publish the page, as well as its children, grandchildren, etc.  In most cases this does not need to be checked.

The “Send e-mail after publication to:” option is checked by default with the user’s e-mail address automatically populated.  This will send a publication report to the person selected as soon as the publish job has finished.  The publisher may choose from the dropdown any other user to receive the e-mail report instead.

Do NOT change any of the other options.


Intranet vs WWW

Updating content on the Intranet is similar to updating content on the external website, also known as www.  Intranet content is password protected, which is why most content lives on www.hampshire.edu.  The Intranet also acts as a portal for Hampshire users to find what they need on the web, which is we have audience path pages and lots of links to pages on www.

       Navigate to your Intranet page in SmartEdit

When you login to RedDot you will be brought to your SmartEdit start page, which will either be your department’s main web page or the home page.  From here, choose Intranet from the quicklinks dropdown in the upper left corner of the page.  You can also access the Intranet home page by searching for it (click on the search button on the left menu, type intranet home into the headline field and click on start).


 

Once you get to the Intranet main page in SmartEdit, it will appear without any content in the center.  This is normal.  All of the main page content (announcements, etc) for Intranet lives outside of RedDot.

 

Navigate to your page by choosing it from the global navigation dropdown, just as you would when working on www content.  The page structure is almost exactly the same as www content; there is a foundation page, a center body shell, a title and top text, and the ability to populate a contact page, banner ad pages, left side center content pages and right side center content pages.  You can also edit the header image as normal.

       Navigation Differences

Intranet pages do not use the RedDot Navigation Manager to display navigation.  They style of navigation on the Intranet is different from www in that siblings no longer appear and all ancestors do appear.  There is an example of each below:

Intranet                                                                          WWW

                       

 


       Changing the order of your navigation

This can be done using both Internet Explorer and Firefox, unlike www pages.

1.        Open the page layout with the reddot in the upper left corner

2.        Click on the add/remove links reddot

3.        Click on edit page order and rearrange the order of your pages. Click OK to save.

       Create and connect a new Intranet foundation page

·         Open the page layout with the reddot in the upper left corner.

·         Click on the add/remove links reddot in the navigation box.

·         Choose create and connect page

·         Choose the Foundation – Intranet (whichever section you’re in) template

·         Go to page 7 of this documentation to follow the rest of steps to create content on your Intranet page.

       Add a new Intranet file page

·         Open the page layout in the upper left corner

·         Click on the add/remove links reddot in the navigation box

·         Choose create and connect page

·         Choose the Intranet File Page template

·         Give the page a headline, which is what will appear in the navigation

·         Click on the page once it is created

·         You will see a white page here where you can attach your PDF to the page

·         Click on the open page to add/edit file reddot

·         Click on the reddot that says click to add/edit file. The asset manager will open to the Intranet Files folder where you can either choose a file that has already been uploaded or click on Select asset from local file system to upload a new document.

       Intranet Files

IMPORTANT: All Intranet files must live in the Intranet Files folder in the asset manager.  This ensures that the files will be password protected when they are published out to the Intranet website.  Do not put any Intranet files into your department folder or else they will not be password protected.

       Reusing content and linking to www pages

You can reuse content and link to pages on www the exact same way you already do.  For example, if you want to create an Intranet page that uses your contact block that lives on your www page, reference that contact page in your contact container on the Intranet page.

If you want to link to a www page from within the center content of your Intranet page, highlight the words you want to be a link, click on the insert/edit link icon in the text editor, and reference the www page.

* If you want to link to a www page from the navigation of your Intranet page, you must link to it via URL.

Click on the add/remove links reddot in the navigation, choose Add URL, give the link a name and type in the URL of the www page from the website.

       Workflow

There is currently no workflow on most Intranet content.  Instead of submitting each page to workflow when it is ready to go live, you must release each page.  This can be done by opening the page with its reddot and clicking on the action menu along the top.

Some sections do have a workflow, in which case each page must be submitted to workflow and approved by an editor before it will be published to the website.