Managing Your Website with Convert Community. My MU Health and My MU Health Nursing

Transcription

1 Managing Your Website with Convert Community My MU Health and My MU Health Nursing

2 Managing Your Website with Convert Community LOGGING IN... 4 LOG IN TO CONVERT COMMUNITY... 4 LOG OFF CORRECTLY... 4 GETTING HELP IN CONVERT COMMUNITY... 5 WEBSITE ADMINISTRATION MANAGING YOUR WEBSITE... 5 WEBSITE ADMINISTRATION, SETTINGS... 7 Sample Settings... 9 ARCHITECTURE AND CONTENT WORKSPACE ARCHITECTURE TREE ICONS VIEW OPTION LEVELS OPTION QUICK PAGES MAKE FINDING YOUR WEB PAGES QUICK AND EASY ACCESSING WEB PAGES ON THE QUICK PAGES LIST ADDING WEB PAGES TO THE QUICK PAGES LIST REMOVING WEB PAGES FROM THE QUICK PAGES LIST SEARCH FOR A PAGE MANAGING WEBSITES IN THE SITE ARCHITECTURE THE WEBSITE ADMINISTRATION TOOLBAR ADDING A WEB PAGE TO THE SITE ARCHITECTURE CREATING A BLANK PAGE CREATING AN INTERNAL LINK PAGE CREATING A WWW LINK PAGE REORDERING PAGES IN THE SITE ARCHITECTURE Moving a Web Page Using Drag and Drop Moving a Web Page Using the Toolbar Options (Up and Down Arrows) REMOVING A WEB PAGE FROM THE SITE ARCHITECTURE DEFINING WEB PAGE PROPERTIES GOOGLE ANALYTICS REPORT WEB PAGE TITLES DIRECT FRIENDLY URLS THE PROPERTIES TAB MODULE ADMINISTRATION ADDING STATIC PAGE CONTENT EDIT SCRATCHPAD TAB LINK MANAGER ADD LINKS TO PAGES WITH THE LINK MANAGER ADD GRAPHICS WITH THE LINK MANAGER

3 LINK TO WORKFILE DOCUMENTS WITH THE LINK MANAGER LINK TO MODULE CONTENT WITH THE LINK MANAGER UPDATING A LIVE WEB PAGE USING INLINE EDITING PREVIEWING A WEB PAGE TOOLS DUPLICATE PAGE SHOW LINKS GET HREF AUDIT/RESTORE PAGE COMPARING TWO VERSIONS OF A WEB PAGE RESTORING A WEB PAGE TO AN EARLIER VERSION CLEAR PAGE CACHE PAGE NOTE Adding a New Note to a Web Page Reviewing and Modifying a Page Note LINK REPORT MODULES TAB THE DOCUMENT LIBRARY MODULES AUTOMATED LINKS WEB PAGES HOW TO CREATE LINKS TO DOCUMENT LIBRARY DOCUMENTS Link to a Document Library Document with Link Manager Link to a Document Library Document on Your Website Menu WORKFILES MANAGING WORKFILE FOLDERS CREATE A WORKFILE SUBFOLDER PUBLIC AND PRIVATE WORKFILE FOLDERS GRAPHICS TAB GRAPHICS TAB TOOLBAR MANAGING GRAPHICS FOLDERS CREATING A NEW GRAPHICS FOLDER DELETING A FOLDER RENAMING A FOLDER DELETING AND RENAMING FOLDERS USING FOLDER MANAGER DELETING EMPTY FOLDERS USING FOLDER MANAGER RENAMING EMPTY FOLDERS USING FOLDER MANAGER MANAGING GRAPHIC FILES VIEWING AND OPENING UPLOADED GRAPHIC FILES VIEW OPTIONS FOR GRAPHIC FILES UPLOADING GRAPHIC FILES Uploading Individual Files Uploading a Batch of Files

4 DELETING GRAPHIC FILES WORKFLOW CUSTOMIZING THE WORKFLOW PAGE THE PRIMARY WORKSPACE FOR MAINTAINING YOUR WEB PAGES USING THE TINYMCE EDITOR TO CREATE AND EDIT PAGE CONTENT HOW TO OPEN THE TINYMCE EDITOR TO WORK ON YOUR WEB PAGE THE TINY MCE EDITING TOOLBAR COPYING AND PASTING TEXT FROM WORD, AND OTHER APPLICATIONS Copy and Paste Tools in Convert Community Using Notepad for Copy and Paste WORKING WITH LINKS ADDING LINKS TO WEB PAGE CONTENT (HYPERLINKING TEXT) ADDING AN ADDRESS LINK CHANGING A LINK ADDING A LINK TO AN IMAGE Editing a Link from an Image Changing a Link on an Image Deleting a Link from an Image WORKING WITH IMAGES ADDING A PICTURE TO A WEB PAGE ADDING ALT TEXT TO AN IMAGE

5 Managing Your Website with Convert Community Important! When using the Firefox or Google Chrome browsers, you may notice that some alert messages generated by the MEDSEEK Convert Community software and its modules now give you an option to not display the message in the future. MEDSEEK recommends that you do not turn off any message displays. Doing so will stop the module from displaying alerts and asking for confirmations, resulting in the module not providing all the required functionality. LOGGING IN Log in to Convert Community In your web browser, go to and use your MU Pawprint to login. Log off correctly To avoid possible problems logging in again later, always log off correctly from Convert Community when you are finished with your work or will be away for a while. To log off, click Logout in the upper right corner. If you do not log off correctly, or are automatically logged off due to inactivity, you may see the notice you are already logged into the system when you next try to log on. This message displays because the system thinks you are still logged in from before. Follow the instructions on the screen to close the old session and begin a new one. 4

6 GETTING HELP IN CONVERT COMMUNITY The question mark icon? indicates there is help documentation for the page or function you are working with. Click the question mark? to open that specific.pdf help file. WEBSITE ADMINISTRATION MANAGING YOUR WEBSITE Below is the default view for the website administration home page. This is what you will see when you log in to Convert Community. You can make changes to this view in Settings. The Settings option allows you to configure how the various elements of Website Administration display when it is accessed. For example, you can indicate that you want the Architecture & Content workspace to display with the button bar located at the bottom of the screen in an expanded format, and you want the architecture to display as a list instead of a tree. 5

7 In the Button Bar, Click Settings. The settings options available depend on your level of permissions in Convert Community. See the Website Administration, Settings table for more information about the options. Make the desired changes and click Save. To exit without saving changes, click Close. 6

8 Website Administration, Settings Field Name/Option Type Description General Default Workspace Drop-down list Indicates which workspace is selected when Website Administration is accessed. Options include: Architecture & Content (default) Appearance & Scripts (Enterprise-level access only) Admin Workflow Default Tab Drop-down list Indicates which tab is selected when Website Administration is accessed. Options include: Full Site (default) Graphics Mobile (available only for Mobile-enabled sites) Modules Workfiles Button Bar Location Drop-down list Indicates where the button bar will display when Website Administration is accessed. Options include: Top (default) Bottom Left Right Initial Button Bar View Drop-down list Indicates which button bar view will display when Website Administration is accessed. Options include: Expanded (default) Collapsed The button bar can be expanded or collapsed at any time by clicking. Architecture & Content Default View Radio Button Indicates how the Architecture pane will display when Website Administration is accessed. Options include: Tree (default) List Show Page ID in Tree Checkbox When checked, indicates that the each page s ID will display in the Architecture pane. If not checked (default), the page ID will not display. Root Web Page Drop-down list Indicates which web page will display as the top page in the Architecture pane. Options include: Homepage (default) Default Top Bar Default Left Bar Default Tab Bar Page ID Display Level Drop-down list Indicates how many levels (1 4, All) will display in the Architecture pane. By default, one level displays. 7

9 Default Search In Selection List box Indicates which search option(s) are selected by default when searching for a web page in the Architecture pane. By default, all options are selected. List Sort Order Drop-down list Indicates how the web pages will be sorted when viewing the Architecture as a list. Options include: ID Page Name (default) Template Type Default Library Display Radio button Indicates how the web pages in the Library will display by default. Options include: Expanded (default) Collapsed Default Graphics Manager View Drop-down list Indicates how the Graphics tab will display by default when accessed. Options include: Detail (default) List Slide Show Show Page ID in Tree Checkbox When checked, indicates that the each page s ID will display in the Architecture pane. If not checked (default), the page ID will not display. Root Web Page Drop-down list Indicates which web page will display as the top page in the Architecture pane. Options include: Homepage (default) Default Top Bar Default Left Bar Default Tab Bar Page ID Display Level Drop-down list Indicates how many levels (1 4, All) will display in the Architecture pane. By default, one level displays. Default Search In Selection List box Indicates which search option(s) are selected by default when searching for a web page in the Architecture pane. By default, all options are selected. List Sort Order Drop-down list Indicates how the web pages will be sorted when viewing the Architecture as a list. Options include: ID Page Name (default) Template Default Library Display Radio button Type Indicates how the web pages in the Library will display by default. Options include: Expanded (default) Collapsed 8

10 Default Graphics Manager View Default Workfiles Manager View Drop-down list Drop-down list Indicates how the Graphics tab will display by default when accessed. Options include: Detail (default) List Slide Show Tiles Indicates how the Workfiles tab will display by default when accessed. Options include: Detail (default) List Default Graphics & Workfiles Upload Tab Radio button Indicates which option will display first by default when uploading files on the Workfiles tab. Options include: Individual (default) Batch Default View Radio button Indicates how the Workflow screen will display by default when accessed. Options include: All Expanded (default) All sections are expanded. Active Expanded Only sections with active messages/tasks are expanded. Save Button Save the changes made and close the Settings dialog box. The screen will refresh to display the new screen configuration. Close Button Close the Settings dialog box without saving changes. Sample Settings 1. Sample Website Administration, All Default Settings 9

11 2. Sample - Website Administration, Button Bar Location: Left 3. Sample- Website Administration, Button Bar Location: Top, Initial Button Bar View: Collapsed 10

12 4. Sample - Website Administration, Architecture Default View: Tree, Display Level: 3 Architecture and Content Workspace The Architecture & Content workspace functionality allows you to create, organize and manage the web pages that will display on your website. The following tabs are available: Full Site, Modules, Workfiles and Graphics. The structure or organization of your website and its content is referred to as the site architecture, a visual 11

13 representation of the website and its components. The site architecture can be thought of as a site map or the website s table of contents. Looking at the site architecture, you can see how the different pages of your site relate to one another and then ensure that the information is organized in a consistent and predictable way. The website s visual design, organization and navigation work together to help website visitors find key information and complete tasks quickly and easily. Helpful Terms Parent Page A parent page is higher in the architecture hierarchy than its associated child pages. Not every page has a child, but all pages have a parent. Each parent page can have multiple child pages. A parent page may itself be a child of another page. Child Page - A page that is part of the web navigation structure and is linked to the parent page from which it is accessed. A child page is a subpage of a parent page. Each child page can have only one parent page. A child page can have its own child page(s). Library The site s Library is used to store web pages that may not be needed in the main architecture (e.g., pages that we do not want site users to find through navigation, appear in special locations but not on menus, etc.) Web pages in the Library share all the same features as other pages but do not display anywhere on the public website unless links are created to them. The My MU Health site Library is used by IT services and a few key websites for special types of web pages, such as Alerts and particular Modules or Applications. Please consult with the Information Management team if you have a need for Library pages. Most web editors will not use the Library and can disregard that section. 12

14 You can view your website s architecture in the Architecture Tree View or the Architecture List View. When using the Architecture Tree View format, you can add new web pages to the site, reorder pages, remove pages, modify page properties, update page content, etc. When using the Architecture List View format, you can modify page properties and update page content. Sample Architecture Tree View Sample Architecture List View When viewing the Architecture Tree, icons display that help you to distinguish between the various types of web pages. The icons are explained in the table below. 13

15 Architecture Tree Icons Icon Description Home page Static web page that does not have any content. Sometimes referred to a blank page. Static web page that has content. Static web page that is password protected. Script module supplied by MEDSEEK Convert Community. Sometimes referred to as a module page or a dynamic page. Script module that is password protected. External WWW link. Link to another web page within this website (internal link). Include link to another web page within this website (include page). Web page is part of workflow. Web page has not been published. Web page has been published. Expand to view child page(s). Collapse to hide child page(s). View Option The View option allows you to modify the Architecture Tree display. Options include: Display web pages for a specific button bar or show all web pages. Switch between Architecture Tree view and List view. View the Architecture Tree icon legend. Print the Architecture Tree. View the site s Architecture in List view mode, an alphabetical list of all the site s pages, including the page ID and template. View a Legend describing the Architecture Tree icons. Click the Legend title bar to close the list. 14

16 Levels Option The Levels option allows you to change how many hierarchical levels of the Architecture Tree display. You can display 1 4 levels or All to display all levels (5 + levels). QUICK PAGES MAKE FINDING YOUR WEB PAGES QUICK AND EASY Accessing Web Pages on the Quick Pages List The Quick Pages option allows you to place web pages in the Architecture Tree on a shortcut list. You can then use the Quick Pages option to easily access web pages you frequently administer. Click Quick Pages to open the Quick Pages dialog box and view a list of web pages previously added to the Quick Pages list. Click the Page Name to access that web page. Adding Web Pages to the Quick Pages List To add a web page to the Quick Pages list, click the web page in the Architecture Tree and then click +. 15

17 Removing Web Pages from the Quick Pages List There are two options for removing a web page from the Quick Pages list: Click Quick Pages to display the Quick Pages dialog box and then click Remove. Click the web page in the Architecture Tree and then click -. SEARCH FOR A PAGE The Search option allows you to quickly search for and select a specific web page in the site architecture. The Search option is available when viewing the Architecture Tree or when viewing the architecture using the List View. 1. While viewing the site architecture, click Search. 16

18 2. The Search dialog box displays. 3. Enter the keyword(s) that you want to search for. Partial words are allowed. 4. Select which areas you want search for the keywords (i.e., in web page titles, web page content, etc). 5. Click Continue. A list of matching web pages displays. 6. Click the Page Name to display the web page s Properties tab. You can sort the web page list by clicking the desired column heading. For example, click Type to sort the list by web page type. Click the Page Name to access the Properties tab for the web page. Click Tree to display the Architecture Tree. Click Search to search for a specific web page. 17

19 MANAGING WEBSITES IN THE SITE ARCHITECTURE The Website Administration Toolbar Option (field name) Type Description View Site Clickable link Open the public website. Username Clickable link The name of the user currently logged in. Click the username to access the Sticky Notes and Reminders options. Logout Clickable link Log out of the system. Clickable icon Opens a help document specific to the page topic. Button Bar Button Expand/collapse the button bar. Architecture & Content Button Access the Architecture & Content workspace. Admin Button Access the Admin workspace. Workflow Button Access the Workflow workspace. Settings Button Access the Settings option. This option allows you to configure how the Workflow Administration functionality will display by default. Toolbar Save Button Save changes. Cancel Button Do not save changes. Refresh Button Refresh the screen to display information that has been updated and saved. New Button Architecture & Content - Add a new web page to the site architecture. Delete Button Architecture & Content Delete a web page from the site architecture. Move Up Button Architecture & Content Move a web page up in the site architecture. Move Down Button Architecture & Content Move a web page down in the site architecture. Preview Button Architecture & Content Preview the selected web page s scratchpad or live page. 18

20 Tools Button The Tools options vary based on the selected tab and web page type. Architecture & Content, Full Site tab Duplicate Page Show Links Get HREF Audit/Restore Page Clear Page Cache Architecture & Content, Modules tab Data Export Create Task Button Create and assign a task to another administration user. Access the Workflow workspace to view tasks that have been assigned to you. Send Message Button Create and send a message to another administration user. Access the Workflow workspace to view and reply to messages that have been sent to you. Page Note Button Create and view web page notes. Link Report Button View the Static Content Broken Link report. Upload File Upload files to the Architecture & Content Workfiles tab or the Graphics tab. New Folder Create a new folder on the Architecture & Content Workfiles tab or the Graphics tab. Delete File Delete a file from the Architecture & Content Workfiles tab or the Graphics tab. Folder Manager Delete or rename folders on the Architecture & Content Workfiles tab or the Graphics tab. Adding a Web Page to the Site Architecture 1. Access Website Administration and then click Architecture & Content. 2. If not already displayed, click the Full Site tab. 19

21 The site architecture displays. 3. If not already displayed, select the Architecture Tree view. 4. In the Architecture tree, click the desired Parent Page under which the new page will be added. 5. Click New in the toolbar. The Create New Page dialog box displays. 6. Select which type of page to create. Options include: Blank Page Content entered on a blank page displays on the public side exactly as it is stored. Typically, a blank page contains text or document that has been typed or copied from another source. Also referred to as a static web page. Internal Link Links to other web pages on the site architecture. An internal link is similar to an include page. WWW Link Creates links to other websites and links to modules that are not found directly on the site architecture. Also referred to as an external link. To add a link to an item in the document library, use the WWW Link option. Module Page Dynamically generated content driven by Convert Community module applications. Information generated via a module is stored in a database. Also referred to as a script module. In most cases, it is desirable to consult with a member of the Information Management team for assistance and advice on adding Module Pages. Include Page We recommend that you not use include pages because they can cause confusion and navigation problems in our site architecture. Creating a Blank Page When adding to a site s architecture, a blank page displays information on the public side exactly as it is stored. Typically, a blank page contains content that has been typed in or copied and pasted from another source. A blank page is sometimes referred to as a static web page. 1. In the Architecture Tree, select where you want to create the new page and click New. The Create New Page dialog box displays. 2. Click Blank Page. 3. Click Next to enter the new web page s name 20

22 4. Enter the page name. To create multiple pages, press the Enter key after each one so each page name is on a separate line, as in the following example: 5. After entering the page names, click Next to modify the page properties. Or click Finish and the page properties can be modified later if desired. 6. A confirmation message displays listing the newly created page names. 7. Click Close to close the dialog box. The pages display in the architecture. 8. You can now modify page properties and/or add page content. Remember to go to Properties to add a Page Title for Google Analytics reports (see section below on Defining Properties). You can also add or modify the Direct URL on the Properties tab (see section below on Defining Properties). Creating an Internal Link Page Adding an Internal link page allows you to cross-link to other web pages on the website. In this example, an internal page for the Announcements (CFC) module was created as a child page to the News module page. Website users can quickly link to the Announcements (CFC) page from the News page. 21

23 1. In the Architecture Tree, select where you want to create the new page and click New. The Create New Page dialog box displays. 2. Click Internal Link. 3. Click Next. A list of web pages that were previously added to the site architecture displays, along with each web page s ID. 4. Click the web page name. To select multiple non-adjacent items, press CTRL and then click each desired item in the list. To select multiple adjacent items, click the first desired item, press SHIFT and then click the last desired item. 5. After selecting the web pages(s), click Next to modify the page properties and then click Finish; or click Finish and modify page properties later if desired. After clicking Finish, a confirmation message displays listing the newly created page. 6. Click Close to close the dialog box. The new web page(s) display in the site architecture. 22

24 Creating a WWW Link Page A WWW link page allows you to link to other websites and modules that are not found directly on the website. A WWW link page is sometimes referred to as an external link. Examples of WWW links are: An external web page, such as a page on MUHealth.org A page or document on SharePoint or Docushare A document in the document library Some types of pages created by a module, for example, some types of document library pages that list multiple documents in a document library folder, a page that lists multiple links from Quick Links. 1. In the Architecture Tree, select where you want to create the new page and click New. The Create New Page dialog box displays. 2. Click WWW Link. 3. Click Next to enter the external web page information. 4. Enter the Link Name as you want it to display on the website. This information is required. 5. Enter the external web page s URL. This information is required. 6. By default, the external web page will open in the Same Window. You can select New Window if you want a new window to open when the website user clicks the link. Select New window when: The link goes to an external website, like the public MUHealth.org site, or to restricted access external sites like Docushare, Sharepoint. The link goes to a document in the Document Library that will be opening in another software program, such as Microsoft Word, Excel, PowerPoint, and Adobe Acrobat Reader (PDF files). See the Modules Document Library Section later in this guide for how to create links to documents. 23

25 Reordering Pages in the Site Architecture The website s web pages will display on your site menu in the same order as they display in the site architecture. You can change the order of the web pages in the site architecture using drag and drop or the Move Up and Move Down options in the toolbar. Note that when you move a parent page, all of its child pages will also move. Moving a Web Page Using Drag and Drop 1. In the Architecture Tree, place the cursor on the web page that you want to move. 2. Press and hold down the button on the mouse or other pointing device, to "grab" the object. 3. "Drag" the object to the desired location by moving the pointer there. 4. "Drop" the web page by releasing the mouse button. Moving a Web Page Using the Toolbar Options (Up and Down Arrows) Using the Move Up and Move Down options in the toolbar, you can reorder web pages within a menu. You cannot move a web page from one menu to another. In addition, you can move a child page up and down within its current parent page, but you cannot move a child page to another parent page. 1. Access Website Administration and then click Architecture & Content. 2. If not already displayed, click the Full Site tab. 3. In the Architecture Tree, click the web page that you want to move. 4. In the toolbar, click Move Up to move the web page up in the architecture. Click Move Down to move the web page down in the architecture. Removing a Web Page from the Site Architecture When you remove one or more web pages from the site architecture, all child pages, links and include pages associated with the selected web page(s) are deleted as well. 24

26 1. Access Website Administration and then click Architecture & Content. 2. If not already displayed, click the Full Site tab. 3. In the Architecture Tree, click the web page that you want to remove. To select multiple web pages, press CTRL and then click each web page. 4. In the toolbar, click Delete. A confirmation message displays. 5. Click Delete to remove the web page. or Click Cancel to cancel deletion of the web page. 6. A confirmation message displays alerting you that the web page and all associated links and child pages have been removed from the site architecture. Click Close to close the message box. 25

27 DEFINING WEB PAGE PROPERTIES When you click a web page in the architecture tree or the architecture list, the Properties tab displays. Here you will find basic information about the selected web page such as the page name, page ID number, author, date the page was last updated, etc. You can modify page properties. Options available on the Properties tab vary based on the web page type selected. Google Analytics Report Web Page Titles After creating a new static content web page, go to the Properties tab to add a Page Title (under Appearance Template ) for the Google Analytics report so your web page will show up properly on the analytic reports. Direct Friendly URLs You can use a Direct friendly URL to make your page easier for site visitors to go to directly. This is useful for pages you want to publicize or share with others. Use words specific to your department or site, not generic words that could apply to any site. The View Direct URLs in Use link shows which direct URLs are already in use. 26

28 The Properties Tab Option (field name) Type Description General Information ID Display only Web page ID. Each web page is automatically assigned a unique ID number. Updated On Display only Date the web page was last updated. Updated By Display only User who last updated the web page. Created On Display only Date the web page was created. Created By Display only User who created the web page. Notes Publishing and Workflow Page Name Text box Alphanumeric characters Text box Alphanumeric characters Available only if Workflow has been enabled. Web page related notes. Web page name. This information can be modified. This is the main title (H1, or Heading 1) that appears on your web page. Protect Button Consult with the Information Management team (via the Help Desk) if you feel this field should be altered. Update Notifications Button We encourage you NOT to use update notifications. With questions, consult with the Information Management team (via the Help Desk). Published Checkbox When checked (default), the web page is published and can be viewed on the public website. Click to remove the checkmark if you are still editing or designing the page, or if you want to submit the page for revision by others before it is published. Publish On Remove On Text box Alphanumeric and special characters Text box Alphanumeric and special characters Date and time the web page will be published and viewable on the public website. Click Apply to all children pages to publish all child pages associated with this parent page on the same date. Date and time the web page will no longer be published and viewable on the public website. Click Apply to all children pages to unpublish all child pages associated with this parent page on the same date. Workflow Process Drop-down list Available only if Workflow has been enabled. Consult with the Information Management team (via the Help Desk) if you require a workflow process change for your website. Appearance Template Page Title Text box Alphanumeric characters Web page title used for Google Analytics reporting. Enter your web site or department name here followed by the page name. Nursing sites, enter Nursing/Your Unit/The Page Name 27

29 Template Target Direct URL Text box Alphanumeric characters Text box Alphanumeric characters Text box Alphanumeric characters Appearance template associated with this web page. Convert Community automatically provides this. In rare cases, this may need to be changed by clicking Browse to search for an appearance template. The window or frame in which this web page will open when the page link is clicked. Enter frame names or HTML names (i.e., _top or _blank ). Use this if you need a page to open in a new window (for example, a link to an external website or a document in the document library). User- friendly URL used to call this page. For example, defining the Direct URL as exercise results in the URL which is easier to use than Click View Direct URLs in Use to view a list of all direct URLs currently defined for the website MODULE ADMINISTRATION When a MEDSEEK Convert Community module web page is selected Architecture Tree, the Module Admin tab is available, allowing you to define the module s administrative options (i.e., create new records, modify records, configure the module, etc). The Document Library is an example of a module. Your website may have other modules, for example, an FAQ. Directions for using modules are available separately. If your website uses a customized module, you may receive training from the Information Management team on how to use the module. Pages created by entering text in a module are called dynamic pages. ADDING STATIC PAGE CONTENT A static page is a regular blank web page to which content is added by the website editor. When a static web page is selected in the site architecture, the Edit ScratchPad tab and the Edit Live Page tab are available to create and update the page content. The page content can be updated using the TinyMCE Editor WYSIWYG functionality or using HTML (in a special window by selecting the HTML icon in the toolbar). WYSIWYG means What You See Is What You Get and the TinyMCE Editor in used for editing pages in Convert Community works much like Microsoft Word and other word processing software. In the TinyMCE Editor, Link Manager options are available, allowing you to drag and drop workfiles, graphics, module record links and modules themselves into the page content. 28

30 Helpful Terms Dynamic Page Pages created by entering text in a module are called dynamic pages. Static Page A static page is a regular blank web page to which content is added by the website editor. The editor tool (TinyMCE) in Convert Community is used to add and edit content on a static page. Scratchpad A working/staging area for the web page. This is where you can enter and format text, images, etc., and play around with the web page without anyone seeing it. Content entered on the scratchpad is not visible on the public website. Live Page - The web page visible on the public website. Any content entered and saved on the live page is immediately visible to public users. Edit Scratchpad Tab Changes made and saved on the Edit ScratchPad tab are not visible online; however, changes made to the scratchpad can be saved to the live page, which is visible online. Always work first on the ScratchPad and when you are satisfied with the page, then save to the Live Page. 1. Select the static web page in the site architecture and then click the Edit ScratchPad tab. The TinyMCE Editor screen displays. 2. Enter and format the text, insert images, links, etc., using the WYSIWYG functionality. 3. Use the Link Manager options to drag and drop workfiles, graphics, module record links and links to the modules themselves into the page content. 29

31 4. Click the disk icon to save the changes to the scratchpad. The scratchpad s content is replaced with the updated content. Changes made and saved to the scratchpad remain there until it is either saved to the live page or sent to Workflow for approval. Edits saved to the Edit ScratchPad tab can be saved to the live page. This will replace the content currently on the Live Page with the content on the ScratchPad. You can edit directly to the Live Page and save to Live; however, we recommend that you make your edits to the ScratchPad and then save them to the Live Page. If you do make edits directly to the live page, unless this is a special case where you want the Live Page and ScratchPad to remain different for awhile, you should then save any changes to the ScratchPad. If you do not do this, and later change the ScratchPad, then saving it to ScratchPad and to Live, you will lose the changes you made to the Live Page previously. LINK MANAGER The Link Manager option allows you to drag and drop workfiles, graphics, module record links and links to the modules themselves into the page content. You can also upload new workfiles and graphics using the Link Manager option if you cannot find what you want for the web page. The Link Manager options can be found on the right-side of the TinyMCE Text Editor screen. 30

32 Add Links to Pages with the Link Manager Click the Architecture tab to display the Architecture Tree and drag and drop web pages from the site architecture into the page content. You can switch to List View mode, modify the number of levels that display and search for a specific web page. Click the desired web page and then drag and drop it into the desired location on scratchpad or live page. The module link displays in the page content. Add Graphics with the Link Manager Click the Graphics tab to display image folders and previously uploaded images. You can create new folders, delete image files, preview image files and upload new image files. Click the desired image and then drag and drop it into the desired location on scratchpad or live page. The image displays in the page content. Link to Workfile Documents with the Link Manager Click the Workfiles tab to display workfile folders and previously uploaded workfiles. You can create new folders, delete workfiles, and upload new workfiles. Click the desired workfile and then drag and drop it into the desired location on scratchpad or live page. A link to the workfile displays in the page content. 31

33 Link to Module Content with the Link Manager Click the Modules tab to display search for module records. Click the arrow in the Module box and select the desired module. You can enter a Keyword to narrow the record search. Click Search. Click the Modules tab to display search for module records. Click in the Module box and select the desired module. You can enter a Keyword to narrow the record search. Click Search. A list of matching module records displays. Click the desired record and then drag and drop it into the desired location on scratchpad or live page. A link to the record displays in the page content. In the example below, the user has used the Link Manager options to insert a graphic image, a module record, a workfile and a web page link into the static page content. 32

34 UPDATING A LIVE WEB PAGE USING INLINE EDITING You can modify a web page directly from the website using InLine Editing functionality. When modifying a static web page, InLine Editing makes use of the TinyMCE Editor s WYSIWYG technology. You can also access Module Admin and modify a Convert Community module using this functionality. 1. Launch the My MU Health website at 2. Modify the URL by adding the word edit to the end of it (e.g., ). 3. Press Enter. The website s In-Line Editor login page displays. 4. Login using your credentials. The website s homepage displays. 5. Select a web page to modify. 33

35 If you select a static page, the InLIne Editor options display. Click Edit Live Page to open the Edit Live Page dialog box. Using the TinyMCE Editor options, modify the web page. Click the globe icon to save the changes to the live page. The live page s content is replaced with the updated content. Click Close to close the dialog box. Click Edit ScratchPad to open the Edit ScratchPad dialog box. Using the TinyMCE Editor options, modify the web page. Click the disk icon to save the changes to the scratchpad. The scratchpad content is replaced with the updated content. Click Close to close the dialog box. Click Exit Editor to exit the InLIne Editor functionality and return to the website. If you select a Convert Community module web page, the Inline Editor options display. Click Module Admin. The selected module s administrative options display. You can now modify the module (e.g., add a new record, modify a record, update configuration options, etc.) as necessary. Click Exit Editor to exit the InLine Editor functionality and return to the website. 34

36 PREVIEWING A WEB PAGE The Preview option in the toolbar allows you view the web page s scratchpad or live page, as it will display when the user accesses it from the public website. 1. Access the web page from the site architecture. 2. In the toolbar, click Preview and then click Preview ScratchPad or Preview Live Page. 3. The Preview page displays. 4. Click Close to close the Preview page. 35

37 TOOLS When a web page is selected in the site architecture, several Tools options become available based on the page type selected. Duplicate Page The Duplicate Page tool allows you to duplicate a page in the site architecture. You can then modify the new page as desired. 1. Access Website Administration and then click Architecture & Content. 2. Select the web page you want to copy in the site architecture. 3. In the toolbar, click Tools and then click Duplicate Page. 36

38 4. The web page is duplicated. A confirmation message displays. 5. Click Close to close the confirmation message. The duplicate page displays in the site architecture, named Copy of (original page name). 6. Select the Copy of page in the Architecture and on the Properties tab, rename it as desired. Edit as desired in the TinyMCE editor tool. Helpful Terms HREF Href is an acronym for hypertext reference and indicates the URL associated with a web page, in other words, its internet address. URL URL is an acronym for Uniform Resource Locator and is a reference (an address) to a resource on the Internet. Show Links The Show Links tool allows you to quickly view a web page s child pages and the HREF (hypertext reference) for each. 1. Access Website Administration and then click Architecture & Content. 2. Select the web page in the site architecture. 3. In the toolbar, click Tools and then click Show Links. A dialog box displays listing the web page s child pages and their associated HREF. 4. Click Close to close the dialog box. 37

39 Get HREF The Get HREF tool allows you to view the URL associated with the selected web page. 1. Access Website Administration and then click Architecture & Content. 2. Select the web page in the site architecture. 3. In the toolbar, click Tools and then click Get HREF. A dialog box displays listing the web page s URL. 4. Click Close to close the dialog box. Audit/Restore Page The Audit/Restore Page tool allows you to view the changes made to a web page. You can compare two version of the web page and restore the web page to an earlier version if necessary. If a web page is restored to an earlier version, all changes made after that version are lost. 1. Access Website Administration and then click Architecture & Content. 2. Select the web page in the site architecture. 3. In the toolbar, click Tools and then click Audit/Restore Page. The Audit/Restore Page dialog box displays, listing each instance the web page has been modified since its creation. Comparing Two Versions of a Web Page To compare two versions of the web page, click the checkbox for each instance. The two versions display side by side. 38

40 Click Inline to view the two versions of the web page merged. In this example below, the redhighlighted text has been deleted and the green-highlighted text has been added. Restoring a Web page to an Earlier Version If you restore a web page to an earlier version, all changes made since that version will be lost. For example, a web page was created on August 1. On August 2, at 11:01 am you added content; later that day at 2:10 pm you added additional content and several images to the web page. On August 3 you add more content. If the web page is restored to the August 2 11:01 version, all the modifications you made after that time will be lost. 39

41 1. Select the desired version of the web page. An example of the web page as it existed on the selected date/time displays. (See image below.) 2. Click Restore. The page is restored to the previous version. 3. Click Close to close the Audit/Restore dialog box. Clear Page Cache Helpful Term Page Cache A temporary storage area that contains copies of a website s web pages. Caching web pages results in a faster display time on the public side. Changes made to a web page may not immediately display on the public side due to page caching. The cache is periodically refreshed automatically, after which all changes will display. However, you can manually clear the cache for a web page so that changes that have been made will be immediately apparent on the public side. 40

42 1. Access Website Administration and then click Architecture & Content. 2. Select the web page in the site architecture. 3. In the toolbar, click Tools and then click Clear Page Cache. The Clear Page Cache dialog box displays. 4. Click Clear Cache Now. A confirmation message displays. 5. Click Close to close the message box. Page Note The Page Note tool allows you to add notes to a web page. These notes can function as a reminder to yourself regarding some aspect of the web page or they might be used to communicate information to other users working on the same web page. This tool can be accessed from any workspace (i.e., Architecture & Content, Admin and Workflow). Adding a New Note to a Web Page 1. Access Website Administration and then click Architecture & Content. 2. Select the web page in the site architecture. 3. In the toolbar, click Tools and then click Page Note. If there are no current notes for the web page, the Notes for page dialog box displays. 41

43 If notes have been previously added to the web page, they display on the Notes for page dialog box. Click New Note to add a new note to the web page. Note If you access the Page Note tool from the Admin or Workflow workspace, you must first select the web page. The Notes for page dialog box will then display. 4. Enter the web page Note. 5. Click Save. The note is added to the web page and displays on the Notes for page dialog box. 42

44 6. Click Close to close the dialog box. Reviewing and Modifying a Page Note 1. Access Website Administration and then click Architecture & Content. 2. Select the web page in the site architecture. 3. In the toolbar, click Tools and then click Page Note. The Notes for page dialog box displays. See Note above. 4. Click the Note you want to review. 5. Click Back to Listing to return to the notes list. or Make the desired changes and click Save. 6. To delete the note, click the Delete button. 43

45 Link Report The Link Report tool searches for broken internal and/or external links on the selected web pages. This tool can be accessed from any workspace (i.e., Architecture & Content, Admin and Workflow). Important! While processing the Static Content Broken Link Report, the My MU Health website performance will be affected, especially if the entire site architecture is being searched for broken links. MEDSEEK recommends that you run the report at the end of the business day and that you do not select the entire site architecture to prevent a system slowdown. Select only your website to search for broken links. (Selecting Home and all its subpages or selecting to include All pages = selecting the entire site.) 1. Access Website Administration and then click Architecture & Content. 2. Select the web page in the site architecture. 3. In the toolbar, click Tools and then click Link Report. The Static Content Broken Link Report dialog box displays. Click the arrow in the Web pages box and select which web page you want to search. 5. Indicate that you want to search only the selected web page and its subpages - DO NOT SELECT TO SEARCH ALL WEB PAGES. 6. Select which link types you want to search for. Options include: Internal Only search for broken links to internal web pages on the site. External Only search for broken links to external web pages. Both Search for broken internal and external links. 44

46 7. Select Report Timeouts (408) to report instances of connection failures. 8. Click Submit. The report results display. 9. Click the Page Name to open the web page s Scratchpad. 10. Click Print to print the Static Content Broken Link Report. 11. Click Close to close the report dialog box. MODULES TAB The modules available for your use depend on your site permissions. Separate instructions are available for modules. Examples include Document Library, FAQs, Nursing Let s Ask, News features. THE DOCUMENT LIBRARY MODULES All users have access to either the My MU Health Document Library or the Nursing Document Library. File types that can be uploaded to the Document Library are Word, PowerPoint, Excel and PDF files. Each website can have a document library folder. For additional folders, you can create subfolders under your main folder. Be careful to upload and modify documents to your own folders. Automated Links Web Pages Automated web pages can be created for your website that automatically display lists of documents with links to view them in your specified Document Library folders. Whenever a document is added to the appropriate folder, it will automatically appear on the list of documents on the web page that visitors can click to view. Documents removed from the folder no longer appear on the list of links on the page. This means you do not have to manually create a page of links to a group of related documents, such as meeting minutes, newsletters, educational documents, etc., and keep 45

47 them up-to-date just by uploading documents to the correct folders, the Document Library module will update your web page of links for you. You can have the documents displayed on the page by a title you specify for each document when you upload it or by the filename. You can add a description and/or the date of upload or document creation in the description field for your document in the document library. This can be changed later if desired. This description will show up with the document title in website searches, making it easier for users to find the desired document. Documents in the document library can easily be moved from one folder to another if needed by making a selection from a dropdown menu on the document s description page. For example, you wish to reorganize or create a new folder and want to move some documents from their current folder to a new one. Folders cannot be renamed, but you can create a new folder with the desired name and move documents into that new folder before deleting the old folder. When you delete a folder, any subfolders and documents in it will also be deleted. You will receive a warning listing what subfolders or documents will be deleted if you continue and can cancel at that point, or if you wish to delete the folder and all its contents, confirm you wish to delete. How to Create Links to Document Library Documents Link to a Document Library Document with Link Manager On a web page, use the Links Manager and select Module and then your Document Library. You can also add a link in the TinyMCE editor by clicking the chain link icon and entering the address of the page (see examples below. Link to a Document Library Document on Your Website Menu To create a link on your website menu (architecture), select to create a new WWW page and enter the address (URL) in the follow way: If the document is in the My MU Health main document library, the link will appear like this: For example - If the document is in the Nursing document library, the link will appear like this: For example - ICU/Updates/ UPDATES pdf 46

48 WORKFILES Managing Workfile Folders Be Aware: Workfile files and folders have less functionality than Document Library files and folders! See information about the Document Library above. For archiving or publishing sets of multiple documents on related topics, consider using the automated feature of the Document Library to reduce effort in maintaining your site. The Information Management team can assist you in setting up such pages. Create a Workfile Subfolder Folders help organize and categorize the various documents that you upload to the Workfiles tab. Each website can have a workfile folder. For additional folders, you can create subfolders under your main folder. Only create subfolders in your own website s workfile folder. To create a subfolder: Select your main workfile folder Click New Folder. The Create a New Folder dialog box displays. Enter the Folder Name. Click Submit. The new folder is created. Public and Private Workfile Folders Note Public folders can be accessed by other website administrators. Files uploaded to public folders are stored in SiteMaker\websitefiles\yourwebsitename\workfiles. Private folders can be accessed only by the user who creates them. Files uploaded to private folders are stored in SiteMakerPrivate\yourwebsitename\workfiles. Once you create a subfolder within another workfiles folder, you cannot move the subfolder to another folder. If you create it within the wrong folder, you must delete the subfolder and then create it again within the correct folder. A folder can be deleted only if it is empty (i.e., no files have been uploaded to it or all the uploaded files have been deleted). If there are sub-folders within the folder, you must delete uploaded documents from each of the sub-folders (if necessary) and then delete each of the sub-folders before you will be allowed to delete the folder. You can also use the Folder Manager option to delete empty folders. 47

49 GRAPHICS TAB All graphics must be uploaded on the Graphics tab before they can be used in a website. Graphics Tab Toolbar Option (field name) Type Description Toolbar Upload File Button Upload individual files or a batch of files to the Graphics tab. New Folder Button Create a new folder on the Graphics tab. Delete File Button Delete file from the Graphics tab. Folder Manager Button Delete or rename empty folders on the Graphics tab. Managing Graphics Folders Folders help organize and categorize the various images that you upload to the Graphics tab. You can create as many public and private folders as required; multiple folders can be nested within a folder. You should only upload images and create folders in your website folder if you do not have a folder, please contact Information Management via the Help Desk. You can create as many subfolders as you wish within your folder. Do not upload images to other departments folders or make changes or deletions to files in other departments folders. 48

50 Important! The main root Images folder is a special use folder for images used by certain modules (like the banner ad module) or for the entire website (for example, images that create the My MU Health menus). Do not upload images to this folder unless authorized to do so (for example, Public Relation staff members, those who have access to use the banner ad module). If you believe an image in the main root folder should be deleted or modified, contact Public Relations staff and Information Management via the Help Desk. Click the expand arrow to expand and display sub-folders within that folder. Click the collapse arrow to collapse and hide display subfolders within that folder. Click the folder name to display files uploaded to the folder. Click the arrow button to hide or display the folders. Creating a New Graphics Folder 1. Access Website Administration and then click Architecture & Content. 2. Click the Graphics tab. The list of folders displays, along with a list of images in the images folder. 3. Find and click your folder name to create a new folder within it. 49

51 4. Click New Folder. The Create a New Folder dialog box displays. 5. Enter the Folder Name. 6. Click Submit. The new folder is created. Note Once you create a sub-folder within another folder, you cannot move the sub-folder to another folder. If you create it within the wrong folder, you must delete the sub-folder and then create it again within the correct folder. Deleting a Folder A folder can be deleted only if it is empty (i.e., no files have been uploaded to it or all the uploaded files have been deleted) and all the sub-folders within that folder are empty. If there are sub-folders within the folder, you must delete uploaded images from each of the sub-folders (if necessary) and then delete each of the sub-folders before you will be allowed to delete the folder. 1. Access Website Administration and then click Architecture & Content. 2. Click the Graphics tab. The images folder displays, along with any sub-folders that have been created and images that have been uploaded directly into the images folder. 3. Click the folder name. If the folder is empty, the Delete Folder option displays. 4. Click Delete Folder. 5. Click Submit. The folder is removed. You can also use the Folder Manager option to delete empty folders. 50

52 Renaming a Folder A folder can be renamed as long as no images have been uploaded directly to it. The folder can have sub-folders with images, however, and still be renamed. 1. Access Website Administration and then click Architecture & Content. 2. Click the Graphics tab. The images folder displays, along with any sub-folders that have been created and images that have been uploaded directly into the images folder. 3. Click the folder name. If the folder can be renamed, the Rename Folder option displays. 4. Modify the folder name as desired. 5. Click Submit. DELETING AND RENAMING FOLDERS USING FOLDER MANAGER The Folder Manager option allows you to quickly locate empty folders and then delete or rename them; multiple empty folders can be deleted or renamed at the same time. Deleting Empty Folders Using Folder Manager 1. Access Website Administration and then click Architecture & Content. 2. Click the Graphics tab. The images folder displays, along with any sub-folders that have been created and images that have been uploaded directly into the images folder. 51

53 3. Click Folder Manager. The Folder Manager dialog box displays. The Delete Empty Folders option is selected by default. 4. Click each folder you want to delete. Click Select All to delete all empty folders. 5. Click Submit. A confirmation message displays. 6. Click OK to delete the folder(s). or Click Cancel to cancel deletion of the folder(s). Renaming Empty Folders Using Folder Manager 1. Access Website Administration and then click Architecture & Content. 2. Click the Graphics tab. The images folder displays, along with any sub-folders that have been created and images that have been uploaded directly into the images folder. 3. Click Folder Manager. The Folder Manager dialog box displays. The Delete Empty Folders option is selected by default. 52

54 4. Click Rename Empty Folders. The current folder names display. 5. Update the folder name(s) as desired. 6. Click Submit. The folder(s) are renamed. MANAGING GRAPHIC FILES Image files uploaded to the Graphics tab can be viewed as a simple list of file names or as a detailed list that includes file name, date modified, type and size. You can also view the images themselves in a tile view or as a slide show. You can upload individual files to a folder on the Graphics tab or you can upload a batch of files in a ZIP file. The following files types can be uploaded:.png,.jpg,.jpeg,.gif Viewing and Opening Uploaded Graphic Files 1. Access Website Administration and then click Architecture & Content. 2. Click the Graphics tab. The images folder displays, along with any sub-folders that have been created and images that have been uploaded directly into the images folder. 3. Click the desired folder. A detailed list of files uploaded to that folder displays. 53

55 4. To open a file, click the filename. View Options for Graphic Files You can switch between Detail (default view), List and Tiles view using the Display Options functionality. You can also click Slide Show to view and scroll through the images. Detailed View 54

56 List View Tiles View Slide Show 55

57 Uploading Graphic Files Files can be uploaded to the Graphics tab individually (up to seven files can be selected at one time) or as a batch (i.e., ZIP file, not to exceed 28MB). The following files types can be uploaded:.png,.jpg,.jpeg,.gif. Uploading Individual Files 1. Access Website Administration and then click Architecture & Content. 2. Click the Graphics tab. The images folder displays, along with any sub-folders that have been created and images that have been uploaded directly into the images folder. 3. Click the desired folder where you want to upload the file. 4. Click Upload File. The Upload Files dialog box displays. The Upload Individual Files option is selected by default. 5. Click Browse to locate and select the file. Up to seven files can be selected. Note: To remove a file after it has been selected, click Reset. 6. Select Rename if file already exists if you want a duplicate named file to be uploaded and automatically renamed. If Rename if file already exists is not selected, a duplicate named file will overwrite the original file. 7. Click Upload. The list of uploaded files displays. 8. Click Close to close the dialog box. 56

58 Uploading a Batch of Files When uploading a ZIP file containing multiple files, the maximum file size is 28MB. 1. Access Website Administration and then click Architecture & Content. 2. Click the Graphics tab. The images folder displays, along with any subfolders that have been created and images that have been uploaded directly into the images folder. 3. Click the desired folder where you want to upload the ZIP file. 4. Click Upload File. The Upload Files dialog box displays. The Upload Individual Files option is selected by default. 5. Click Upload Batch Files. The batch file option displays. 6. Click Browse to locate and select the ZIP file. 7. Select Overwrite Existing Files if you want a duplicate named file to be uploaded and overwrite the original file. If Overwrite Existing Files is not selected, the duplicate named file will not be uploaded. 57

59 8. Click Upload. A list of files extracted from the ZIP file displays. Note: If Overwrite Existing Files was not selected, the list of files may contain files that were not actually extracted. 9. Click Close to close the dialog box. Deleting Graphic Files 1. Access Website Administration and then click Architecture & Content. 2. Click the Graphics tab. The images folder displays, along with any sub-folders that have been created and images that have been uploaded directly into the images folder. 3. Click the folder that contains the file you want to delete. 4. Click the file you want to remove. The preview dialog box displays. 58

60 5. Click Delete File. A confirmation message displays. 6. Click OK to remove the file from the folder. or Click Cancel to cancel deletion of the file. Note: If you click Cancel to close the confirmation message, you can still delete the image file by clicking Delete File. 59

61 Folder and File Name Tips for Documents and Images When naming folders and files for use on the web, avoid these in the name: Blank spaces Punctuation, except for the. (dot) before the file name extension that indicates the file type, for example, UPDATES pdf Consider using all lower case for file and folder names to make them easier to type and remember. Instead of spaces in a file or folder name, consider one of these approaches: Use an underline for a space Use camel case where the first letter of each word is uppercase and all other letters are lowercase, for example, CaseStudyAngina.pdf (see comment about all lower case above) Shorter, meaningful names are best. Excessively long file and folder names will be difficult to work with and may cause problems with linking in some cases. For documents you will be replacing periodically with newer versions, consider a generic name that will work for all future versions of the document. Then you can just upload each new version to overwrite/replace the existing one and, because the file name of each new version is the same, you will not have to go to the architecture or web page to change any links links will automatically go to the new version that replaced the old with the same name. Create subfolders for groups of related documents. Double check that you are in your own folder before creating a subfolder. This will make it easier to manage your documents and images as time goes by. Consider using some standard conventions to help you identify the correct file to link to or use on a page. For example, you might have three different versions of the same image a thumbnail and a larger version and you might name them annualaward_tn.jpg another named annualaward_150x300.jpg and one more named annualaward_200x400.jpg, so that the _tn would let you know that is the thumbnail version and the _150x300 would let you know the file is 150 pixels by 300 pixels so that you could easily select the correct image to put on your web page. WORKFLOW The Workflow homepage shows announcements. If you are part of a Workflow process in which you approve pages before they are published, you will find pages pending approval here. 60

62 Customizing the Workflow Page When the Workflow homepage is opened, the sections display expanded or collapsed based on the Settings configuration. Each of the sections can be then be expanded and collapsed with the arrows. Note: We do not recommend using the Messages and Tasks available through the Workflow homepage. Unless you are part of a group of several editors working collaboratively on a single subsite who login to Convert Community frequently, messages and tasks likely will not be seen in a timely manner. The preferable option is to use Microsoft Outlook for communicating with other editors. THE PRIMARY WORKSPACE FOR MAINTAINING YOUR WEB PAGES You will usually work on the Architecture and Content, Full Site, Edit ScratchPad tabs. Here you can select the page to work on and use the web editor, TinyMCE, to add and change content. 61

63 USING THE TINYMCE EDITOR TO CREATE AND EDIT PAGE CONTENT Convert Community uses the TinyMCE editor for web page content. TinyMCE is the most widely-used WYSIWYG editor in the world. WYSIWYG (pronounced wiz-e-wig), is an acronym for What You See Is What You Get and it allows you to manipulate the look and layout of a web page without having to use HTML coding. Working in TinyMCE is similar to working in Microsoft Word. Important! Internet Explorer users can use the copy and paste tools on the toolbar as well as CTRL+C and CTRL+V to copy and paste. Firefox and Chrome users can use CTRL+C to copy content and then CTRL+V to paste that content into TinyMCE. Due to restrictions that Firefox and Chrome have put on JavaScript's access to the user's clipboard, the cut, copy and paste options do not work when using the TinyMCE Editor. How to Open the TinyMCE Editor to Work on Your Web Page In Architecture & Content click any static page in your site architecture. Tip: Use QuickPages to go right to your website. If you have Save My Place enabled (Version 8.2), the architecture will appear as you left it previously. Click Edit ScratchPad if not already open. It is best to work on the ScratchPad first and then when you are satisfied with it, save your work to the Live Page. In a module: anytime you see the Open WYSIWYG link, click it to open the TinyMCE WYSIWYG Editor. This Open WYSIWYG link is available in some modules where content can be entered and edited. 62

64 The Tiny MCE Editing Toolbar Save text to live page. Clicking on this link saves the current version to the live site; meaning the changes will be immediately visible on the consumer side. Save text to the Scratchpad, changes will be saved as a draft. The Scratchpad tab is the default view for the editor. Submit text to workflow for approval. View the scratchpad as it will look on the live site. Send a new message. Create a new task. Create a new Page Note. Cut text and remove it from its current location. Works in conjunction with the Paste command. Copy text and leave it in its current location. Works in conjunction with the Paste command. Paste the cut or copied text into a new location. Toggles between paste and paste as plain text. Opens a paste window to paste contents created in MS Word. Find text. Find specified text and replace it with new text. Undo the last action performed. Redo the last action performed. Run the Spell Checker. Click to select a language other than English. Insert/Edit Link Enter properties for a new link or modify properties for an existing link. For more information, see Insert a Hyperlink. Unlink and remove the link properties. For more information, see Delete a link. Insert a new anchor or edit an existing anchor s name. For more information, see Creating & Using Anchors. Insert a horizontal line. Open the Links Manager option. Insert new embedded media (such as Flash) or edit existing media. For more information, see Insert a Media file. View information about TinyMCE and plugins. 1. Create a numbered or ordered list. Create a bullet or unordered list. Move text left (out dent). Move text to the right (indent). Select the text and click this icon to align the text on the left margin. Select the text and click this icon to align text so it is centered on the page. 63

65 Select the text and click this icon to align text on the right margin. Select the text and click this icon to justify the text (align text along both the left and right margin). In justified text, the space between words is stretched or compressed to align the text with both the left and right margins. Insert a new table. View and modify properties for a row in the table. View and modify properties for a cell in the table. Insert a row into the table before the selected row. Insert a row into the table after the selected row. Delete a row from the table. Insert a column into the table before the selected column. Insert a column into the table after the selected column. Delete a column from the table. Split a table cell into multiple cells. Merge multiple table cells into one cell. Toggle between visible guidelines/elements and hidden guidelines/elements. Edit HTML Source code. Cleanup messy code, such as HTML text copied from another source. Insert custom characters or symbols. Select the text and click to view and select from a list of available text styles. The styles available here are custom styles typically added by the MEDSEEK design team or by dedicated or self-hosted clients with proper access. Select the text and click to view and select from a list of available text formatting options. Select the text and click to view and select from a list of available fonts. Select the text and click to view and select from a list of available font sizes. Select the text and click to view and select from a list of available text colors. Select the text and click this to bold the text. Select the text and click this to italicize the text. Select the text and click this to underline the text. Select the text and click this to strikethrough the text. Superscript the selected text. Subscript the selected text. Remove the current formatting for the selected text. Print the page. 64

66 Copying and Pasting Text from Word, and Other Applications You may wish to use content on your web page that you already have in another program, for example, MS Word, Outlook , PowerPoint, Publisher, Adobe Acrobat, etc. The formatting code used by such third-party software is not compatible with standard web page formatting. When pasted into a web page, this code can over-ride the style of the My MU Health website, making it difficult for you to control font sizes and styles. Copy and Paste Tools in Convert Community When copying text from a third-party program like Microsoft Word: Click Paste as Plain Text (the middle Paste tool on the toolbar) to toggle on this feature. Then click Paste (the first Paste tool on the toolbar) or Ctrl V. Now do your formatting and font selections in the SiteMaker editor. This is a best practice for Web content editors and recommended by the maker of Convert Community. When to use the Paste tool in SiteMaker (and when not to): Use the simple Paste tool (the first of the three paste tools on the toolbar) when copying and pasting within SiteMaker, for ex., to rearrange text on your page. Do not use this Paste tool to paste in content from other applications like MS Word, PowerPoint, Adobe Acrobat or PDF documents, or external Web pages unless you have first clicked the Paste as Plain Text button (see above). To paste from Word and keep Word formatting (NOT recommended): Click Paste from Word. Paste the content copied from Word into the small paste window that opens. 65

67 Control V: Holding down the Control (Ctrl) key and pressing the V key pastes in content similarly to the simple Paste tool described above. In a content area of a Web page, click the Paste as Text icon before pressing Ctrl V to avoid copying unwanted Microsoft or other third party formatting code into your Web page. Ctrl V can be helpful when pasting content into fields in some of the popup tools and modules, for example, fields in the Document Library. When pasting text into fields in a module, if no WYSIWYG option is available, you can just press Ctrl V to paste in your text. Always select to use the WYSIWYG editor (which includes the paste tools) if it is available for fields in a module, like the News, FAQ and Let s Talk Nursing modules. To clean up messy formatting issues while in the TinyMCE editor: Select the text you want to clean up Click Ctrl X to cut the text. Click Paste as Plain Text (to toggle on). Click Paste. This will replace your original text with plain text and turns off the Paste as Plain Text toggle. Now do your formatting and font selections in the SiteMaker editor. Note that this method may not always work sometimes unseen code remains after the cut Ctrl X step to cause problems. Using Notepad for Copy and Paste Using Notepad can be helpful if you must pull together content from multiple sources to make into one web page. For example, you receive several s that contain information you want to put into one web page. Copy and paste the desired content from the various sources into Notepad, where the undesirable code is removed. Then you have one document to copy and paste into the Covert Community scratchpad editing view where you can use the web tools to do the desired formatting. To open Notepad, click the Windows icon, select All Programs, Accessories, Notepad. Copy the content and paste it into Notepad. You can do text editing of the content in Notepad if desired and no code will be added. You cannot format in Notepad - it is plain text. Now select and copy the text in Notepad. In SiteMaker click cursor where text is to be inserted and click Paste as Plain Text, then Paste or Ctrl V. Do formatting in the SiteMaker editor. What to do if it doesn t appear to work: make sure that 66

68 you are pasting from your clipboard into SiteMaker the text copied out of Notepad (this is a second copy step) and not pasting the text copied out of Word. After copying the text into Notepad, click your cursor on the Notepad workspace and then select and copy the text in Notepad. WORKING WITH LINKS Using the Link Manager to Add Links and Images to Your Web Page The Link Manager option allows you to drag and drop workfiles, graphics, module record links and links to the modules themselves into the page content. You can also upload new workfiles and graphics using the Link Manager option if you cannot find what you want for the web page. The Link Manager options can be found on the right-side of the TinyMCE Text Editor screen. It can also be accessed by clicking the large chain link icon in the toolbar. See section earlier in this guide for how to use the Link Manager. Adding Links to Web Page Content (Hyperlinking Text) Although the Link Manager allows you to drag and drop links onto your web page, there may be times when you want to select text in the content on your page and hyperlink it. 1. Select the text to be hyperlinked. 2. Click on the small chain link icon on the toolbar. 3. In the dialog box that opens type or paste in the address of the link. 4. Select to open in new window if address leads to an external site. 5. Click insert. 6. If it is an external website address and you are prompted to add select yes. 7. If the address you are linking to uses you will need to enter the because Convert Community does not have the option to add that for you. 67

69 Adding an Address Link 1. To insert an address link, type the address or text to be linked. 2. Select the address or text. 3. Click on the small chain link icon on the toolbar. 4. In the dialog box that opens type or paste in the address. 5. Click insert. 6. When prompted to add mailto: click yes. Changing a Link 1. To change a link, select the link. 2. Click on the broken chain link icon on the toolbar. This removes the old link. 3. Follow the directions above to add a new web page or link. Adding a Link to an Image 1. Click on the image to select it. 2. Click the link icon (chain link) on the Tiny MCE toolbar and enter the URL (web address). Editing a Link from an Image 1. Click the image to select it. 2. Click Insert/edit Link. The existing hyperlink properties will display for you to make changes. Changing a Link on an Image Important unlink, then add new link! If you need to change the URL (web address) do this: Click on the linked image to select it. Click Unlink (the broken chain link icon) on the Tiny MCE toolbar. Now add the new link as described above. Deleting a Link from an Image 1. Click the image to select it. 2. Click Unlink (the broken chain link icon). 68

70 WORKING WITH IMAGES Acceptable file types are.gif,.jpg,.jpeg and.png. Before uploading, images should be resized close to the desired size for the content so they will fit on the web page. In the editor you can do a little more resizing if needed. See the Web Editors Toolbox at for helpful handouts with step-by-step illustrated directions to resize and crop your image using the Microsoft Paint software included with Windows. Graphics files must be uploaded to the Images Directory in SiteMaker in order to have them available to use. Be sure to put the image in your department s folder in the Images Tab. Do not put images in the root or main images folder unless authorized to do so. Some images must be kept in the Root directory. These are usually created by Creative Services or Public Relations staff, for example, the banner images shown at the top and bottom of the home page and some content (body) pages, menu images. Consult with Information Management if you have questions about using the root images (default) graphics folder. Adding a Picture to a Web Page See instructions earlier in this guide on using the Graphics tab on the Links Manager to add images to your web page. Adding Alt Text to an Image If you add images to your site you also have the ability to provide Alt text. Helpful Term Alt Text Alt text provides alternative information for an image if a user for some reason cannot view it. This makes the page accessible for vision impaired users who use a screen reader to browse websites. The Alt text is also useful if a slow connection, error or moved image prevent it from being visible on the page. Alt text is not required but is a recommended best practice for accessibility. If an image is just for decoration (for example the rounded corners on the Quick Poll box, the tab images on the menus, colored lines, etc.), no Alt text should be provided. The text provided for the Alt attribute is an alternative for the image, usually stating its purpose. For example, the Alt text for a stop sign image could be Stop! unless the reason for the image is to illustrate what a stop sign looks like, then Red hexagon with the word Stop in white text would be a better Alt text. 1. In Tiny MCE select the image. 69

71 2. Right click and click Insert/edit image. 3. In the Image description field, type the Alt text. 4. Click Update. 5. To verify the Alt Text exists, mouse over the image. The text should display. 6. If you wish to verify, you can click the HTML icon. Below is an example of the Alt text in HTML. FEEDBACK Additional guides and video tutorials are on the Web Editor s Toolbox site at. If you have suggestions for improving this guide or the Toolbox site, you may use the feedback form on the site to submit them. 70