The i:Create Editor v1.0
The i:Create Editor - Overview 1 Introduction...................................................................................... 6 2
Browser Compatibility...................................................................... 6
3
Accessing I:Create........................................................................... 6
3.1
Logging In................................................................................ 6 3.1.1 Password Recovery..................................................... 8
4
The Toolbar and Basic Editing......................................................... 8
4.1
The Toolbar.............................................................................. 8
4.1.1 Home.......................................................................... 8
4.1.2 Save............................................................................ 8
4.1.2.1 Data Recovery After a Time Out.................... 9
4.1.3 Page Properties........................................................... 9
4.1.4 Undo / Redo................................................................ 9
4.1.5 Spell Checking........................................................... 10
4.1.6 Clean Up MS-Word Content...................................... 10
4.1.7 Paste as Text............................................................. 10
4.1.8 Paste From Word....................................................... 11
4.1.9 Font Style Tools......................................................... 11
4.1.10 List Tools................................................................... 11
4.1.11 Alignment Tools......................................................... 12
4.1.12 Indent Text Tools........................................................ 12
4.1.13 Horizontal Rule.......................................................... 12
4.1.14 Insert Anchor............................................................. 12
4.1.15 Insert / Edit Link......................................................... 13
4.1.16 Remove Link.............................................................. 13
4.1.17 Abbreviation............................................................... 13
4.1.18 Acronym.................................................................... 14
4.1.19 Email Link.................................................................. 14
4.1.20 Insert / Edit Image...................................................... 14
T H E I : C R E AT E E D I T O R - TA B L E O F C O N T E N T S >> support@help.esolutionsgroup.ca
4.1.21 Insert / Edit Embedded Media.................................... 15
4.1.22 Insert / Edit iFrame..................................................... 15
4.1.23 Table Tools................................................................. 16
4.1.24 Toggle Guidelines / Invisible Elements........................ 16
4.1.25 Style… Drop-down.................................................... 16
4.1.26 Font Format… Drop-down......................................... 16
4.1.27 HTML Source Code................................................... 17
4.1.28 Resources................................................................. 17
4.1.29 Menu Manager.......................................................... 18
4.1.30 Website Quality Checker............................................ 18
4.1.31 Release Page............................................................ 18
4.1.32 Insert Photo Gallery................................................... 19
4.2
Basic Editing.......................................................................... 19
4.2.1 Backspace................................................................ 20
4.2.2 Enter.......................................................................... 20
4.2.3 Text Editing................................................................ 20
4.2.3.1 Using Bold, Italics, Underline, Superscript and Subscript.............................................. 20
4.2.3.2 Aligning Text................................................ 21
4.2.3.3 Creating Lists.............................................. 21
4.2.3.4 Indenting Text.............................................. 22
4.2.4 More on Editing Content............................................ 22
5
The Administrative Interface.......................................................... 22
5.1
Accessing the Administrative Interface.................................... 23 5.1.1 Logging Out............................................................... 23
5.2
Components of the Administrative Interface............................ 23 5.2.1 The Resource Tree..................................................... 24
5.2.1.1 Locating Web Pages Using the Resource Tree............................................. 24
T H E I : C R E AT E E D I T O R - TA B L E O F C O N T E N T S >> support@help.esolutionsgroup.ca
5.2.1.2 Locating Modules Using the Resource Tree............................................. 26
5.2.2 The Utilities Pane....................................................... 27
5.2.2.1 Using the Help Desk.................................... 27
5.2.2.2 My Account................................................. 27
5.2.3 The Content Pane...................................................... 28
5.2.3.1 Publishing.................................................... 28
5.2.3.2 Approval...................................................... 29
5.2.3.3 Advanced Release...................................... 29
5.2.3.4 Permissions................................................. 29
5.2.3.5 Search........................................................ 29
5.2.3.6 Reports....................................................... 29
5.3
Editing Pages from the Administrative Interface...................... 29
5.3.1 The Content Page List............................................... 30
5.3.1.1 The Main Options Pull-down....................... 30
5.3.1.2 The New Page Button................................. 31
5.3.1.3 The Files List............................................... 31
5.3.2 Making New Pages.................................................... 33
5.3.3 Functions of the Main Options Pull-down................... 34
5.3.3.1 Releasing Multiple Pages............................. 35
5.3.3.2 Deleting Multiple Pages............................... 35
5.3.3.3 Selecting and Deselecting all Pages............ 35
5.3.4 Functions of the File Options Pull-down..................... 35
5.3.4.1 Changing a Page Short Name or File Name.................................................... 36
5.3.4.2 Editing Page Content.................................. 36
5.3.4.3 Editing HTML Source Code......................... 36
5.3.4.4 Previewing Your Web Page.......................... 37
5.3.4.5 Sending a Page for Review.......................... 38
5.3.4.6 Releasing a Page........................................ 38
T H E I : C R E AT E E D I T O R - TA B L E O F C O N T E N T S >> support@help.esolutionsgroup.ca
5.3.4.7 Copying a Web Page ................................. 39
5.3.4.8 Deleting a Page........................................... 39
5.3.4.9 Restoring a Previous Version of Your Page................................................... 39 5.3.4.10 Examining the Release History of Your Page................................................... 40
5.3.4.11 Changing Page Permissions........................ 41
6
Releasing Pages............................................................................. 41
6.1
Releasing From the Editing Toolbar......................................... 42
6.2
Releasing from the Content Page List..................................... 44
6.3
Advanced Release.................................................................. 45
The i:Create Editor - Links 1 Introduction.................................................................................... 49 2
Rules for Hyperlinks....................................................................... 49
3
Creating Hyperlinks........................................................................ 50
3.1
Logging in to i:Create............................................................. 50
3.2
Creating an Internal Link......................................................... 50
3.3
Creating an External Link........................................................ 53
3.4
Using a Link to Open a Document.......................................... 54
3.5
Creating a Link with Anchors ................................................. 56
3.6
Using Thumbnails to Open Larger Images.............................. 59
3.7
Sending Email with a Hyperlink............................................... 64
4
Testing Hyperlinks.......................................................................... 66
5
Modifying Hyperlinks..................................................................... 66
5.1
Editing a Hyperlink.................................................................. 66
5.2
Deleting a Hyperlink................................................................ 67
The i:Create Editor - Images 1 Introduction.................................................................................... 70 2
About Size and Resolution............................................................ 70
T H E I : C R E AT E E D I T O R - TA B L E O F C O N T E N T S >> support@help.esolutionsgroup.ca
3
Image Format, Colour Space and Compression.......................... 70
3.1
Image Format......................................................................... 70
3.2
Colour Space......................................................................... 71
3.3 Compression.......................................................................... 71 4
Adding Images to your Page......................................................... 72
4.1
Logging in to i:Create............................................................. 72
4.2
Adding an Image.................................................................... 72
5
Image Layout and Formatting....................................................... 74
5.1
Resizing Images..................................................................... 74
5.2
Aligning Images...................................................................... 75
5.3
Wrapping Text Around an Image............................................. 75
5.4
Deleting an Image................................................................... 77
5.5
Modifying Image Properties.................................................... 77
The i:Create Editor - Tables 1 Introduction.................................................................................... 80 2
Tables and Accessibility................................................................. 80
3
Adding Tables to your Page........................................................... 80
3.1
Logging in to i:Create............................................................. 80
3.2
Adding a Table........................................................................ 81
3.3
Editing a Table Row................................................................ 83
3.4
Editing a Table Cell................................................................. 84
3.5
Setting Cell / Table Column Width........................................... 86
3.6
Deleting a Table...................................................................... 87
3.7
Editing Table Structure............................................................ 87
3.7.1 Modifying Table Properties......................................... 87
3.7.2 Adding Rows to a Table............................................. 88
3.7.3 Deleting a Row from a Table...................................... 89
3.7.4 Adding Columns to a Table........................................ 89
3.7.5 Deleting a Column from a Table................................. 89
T H E I : C R E AT E E D I T O R - TA B L E O F C O N T E N T S >> support@help.esolutionsgroup.ca
3.7.6 Merging Table Cells.................................................... 90
3.7.7 Splitting Cells............................................................. 91
4
Adding a Table Style...................................................................... 92
4.1
Removing a Table Style........................................................... 93
The i:Create Editor - Headers 1 Introduction.................................................................................... 97 2 Limitations...................................................................................... 97 3
Locating the Headers..................................................................... 97
3.1
Logging in to i:Create............................................................. 97
3.2
Accessing Headers................................................................. 98
3.2.1 Applying a Header..................................................... 98
3.2.2 Changing a Header.................................................... 99
3.2.3 Removing a Header................................................... 99
The i:Create Editor - Resources 1 Introduction.................................................................................. 102 2
File Formats.................................................................................. 102
3
Locating the Resources............................................................... 102
3.1
Logging in to i:Create........................................................... 102
3.2
Locating the Resources from the Resource Tree................... 103
3.2.1 Adding a Resource (Resource Tree)......................... 104
3.2.2 Deleting a Resource (Resource Tree)........................ 105
3.2.3 Viewing Your Uploaded Resources (Resource Tree)........................................................ 105
3.3
Locating the Resources from the Page Editor....................... 106
3.3.1 Adding a Resource (Page Editor)............................. 107
3.3.2 Deleting a Resource (Page Editor)............................ 108
3.3.3 Viewing Your Uploaded Resources (Page Editor)...... 109
T H E I : C R E AT E E D I T O R - TA B L E O F C O N T E N T S >> support@help.esolutionsgroup.ca
3.3.4 Swapping Out an Image using Resources (Page Editor)............................................................ 109 3.3.5 Swapping Out a Document Link using Resources (Page Editor)............................................................ 109
The i:Create Editor - Menu Manager 1 Introduction.................................................................................. 113 2
Menu Entries vs. Files.................................................................. 113
3
Locating Menu Manger................................................................ 113
3.1
Logging in to i:Create........................................................... 113
3.2
Accessing Menu Manager.................................................... 114
3.2.1 Accessing Menu Manger through the Administrative Interface............................................ 114
3.2.2 Accessing Menu Manager through the Toolbar........ 115
3.2.3 Locking the Menu.................................................... 115
3.2.3.1 Unlocking the Menu.................................. 116
4
Managing Your Menu................................................................... 117
4.1
Navigating Your Menu........................................................... 117
4.2
Adding a Link....................................................................... 118
4.2.1 Linking to Internal Pages.......................................... 124
4.2.2 Linking to External Pages......................................... 127
4.2.3 Adding Quick Links.................................................. 127
4.2.4 Linking from Multiple Menus.................................... 128
4.3
Editing Links......................................................................... 130
4.3.1 Moving Links........................................................... 130
4.3.1.1 Changing a Link’s Position......................... 130
4.3.1.2 Cutting and Pasting Links.......................... 130
4.3.2 Deleting a Link......................................................... 131
4.3.3 Rollback.................................................................. 133
4.3.4 Preview.................................................................... 133
T H E I : C R E AT E E D I T O R - TA B L E O F C O N T E N T S >> support@help.esolutionsgroup.ca
The i:Create Editor - Users, Roles, Permissions and Advanced Workflow 1 Introduction.................................................................................. 136 2
Users and Roles........................................................................... 136
2.1
Adding a User...................................................................... 136
2.1.1 Modifying a User Account........................................ 138
2.1.2 Deleting a User Account.......................................... 138
2.2
User Groups......................................................................... 139 2.2.1 Uses of User Groups............................................... 140
2.3 Roles.................................................................................... 140 3 Permissions.................................................................................. 142
3.1
Assigning Corporate Level Permission.................................. 142
3.2
Assigning Department Level Permission............................... 143
3.3
Assigning Module Level Permission...................................... 144
3.4
Assigning Page Level Permission.......................................... 145
3.5
Hierarchy, Conflicts and Permissions.................................... 146
4
Page Approvals............................................................................ 146
4.1
Approving Pages.................................................................. 146
4.2
Rejecting a Page.................................................................. 149
5
The Workflow Manager................................................................ 150
5.1
Creating a Basic Workflow.................................................... 150
5.2
Creating a Multi-level Workflow............................................. 152
5.3
Editing Workflows................................................................. 153
The i:Create Editor - Link Checker 1 Introduction.................................................................................. 156 2 Limitations.................................................................................... 156 3
Locating the Link Checker........................................................... 156
3.1
Logging in to i:Create........................................................... 156
3.2
Accessing the Link Checker................................................. 157
T H E I : C R E AT E E D I T O R - TA B L E O F C O N T E N T S >> support@help.esolutionsgroup.ca
3.2.1 Accessing the Link Checker through the Administrative Interface............................................ 157
3.2.2 Accessing the Link Checker from the Toolbar.......... 158
4
Creating and Analysing Reports.................................................. 158
4.1
Creating a New Job.............................................................. 158
4.2
Pausing and Restarting a Job............................................... 160
4.3
Viewing a Finished Job......................................................... 160
4.3.1 Filtering the Results.................................................. 161
4.4
Correcting Broken Links....................................................... 162
4.5
Deleting a Job...................................................................... 163
5
Understanding Status Codes...................................................... 163
The i:Create Editor -Search and Reports 1 Introduction.................................................................................. 167 2 Search........................................................................................... 167
2.1
Logging in to i:Create........................................................... 167
2.2
Locating the Search Tools.................................................... 167
2.3
Performing a Search............................................................. 168
2.4
Performing an Advanced Search.......................................... 170
2.5
Exporting Search Results...................................................... 171
3 Reports......................................................................................... 172
3.1
Locating the Reports Tool..................................................... 172
3.2
Creating Reports.................................................................. 173
3.2.1 The Stale Content Report........................................ 173
3.2.2 The Pages by User Report....................................... 174
3.2.3 The Not Released Report........................................ 176
3.2.4 The Statistics Report............................................... 177
3.2.5 The Meta Data Report............................................. 179
3.2.6 The Resource and Media Report............................. 180
T H E I : C R E AT E E D I T O R - TA B L E O F C O N T E N T S >> support@help.esolutionsgroup.ca
The i:Create Editor -iFrames 1 Introduction.................................................................................. 185 2
iFrames and Security................................................................... 185
3
Adding an iFrame to Your Page................................................... 185
3.1
Logging in to i:Create........................................................... 185
3.2
Locating the URL.................................................................. 186
3.3
Embedding an iFrame.......................................................... 186
3.4
Editing an iFrame.................................................................. 188
3.5
Deleting an iFrame................................................................ 189
The i:Create Editor -Secure Email and the Email Manager 1 Introduction.................................................................................. 192 2
About Secure Email...................................................................... 192
3
Adding and Editing Secure Email Links...................................... 192
3.1
Logging in to i:Create........................................................... 192
3.2
Adding a Secure Email Link.................................................. 193
3.3
Previewing a Secure Email Link............................................ 195
3.4
Editing a Secure Email Link................................................... 197
3.5
Deleting a Secure Email Link................................................. 197
4
The Email Manager...................................................................... 197
4.1
Accessing the Email Manager............................................... 197
4.2
Adding Email Addresses to the Database............................. 198
4.3
Editing Email Addresses....................................................... 198
4.4
Deleting an Email Address.................................................... 199
T H E I : C R E AT E E D I T O R - TA B L E O F C O N T E N T S >> support@help.esolutionsgroup.ca
The i:Create Editor - Overview
Contents 1 Introduction...................................................................................... 6 2
Browser Compatibility...................................................................... 6
3
Accessing I:Create........................................................................... 6
3.1
Logging In................................................................................ 6 3.1.1 Password Recovery..................................................... 8
4
The Toolbar and Basic Editing......................................................... 8
4.1
The Toolbar.............................................................................. 8
4.1.1 Home.......................................................................... 8
4.1.2 Save............................................................................ 8
4.1.2.1 Data Recovery After a Time Out.................... 9
4.1.3 Page Properties........................................................... 9
4.1.4 Undo / Redo................................................................ 9
4.1.5 Spell Checking........................................................... 10
4.1.6 Clean Up MS-Word Content...................................... 10
4.1.7 Paste as Text............................................................. 10
4.1.8 Paste From Word....................................................... 11
4.1.9 Font Style Tools......................................................... 11
4.1.10 List Tools................................................................... 11
4.1.11 Alignment Tools......................................................... 12
4.1.12 Indent Text Tools........................................................ 12
4.1.13 Horizontal Rule.......................................................... 12
4.1.14 Insert Anchor............................................................. 12
4.1.15 Insert / Edit Link......................................................... 13
4.1.16 Remove Link.............................................................. 13
4.1.17 Abbreviation............................................................... 13
4.1.18 Acronym.................................................................... 14
4.1.19 Email Link.................................................................. 14
T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
4.1.20 Insert / Edit Image...................................................... 14
4.1.21 Insert / Edit Embedded Media.................................... 15
4.1.22 Insert / Edit iFrame..................................................... 15
4.1.23 Table Tools................................................................. 16
4.1.24 Toggle Guidelines / Invisible Elements........................ 16
4.1.25 Style… Drop-down.................................................... 16
4.1.26 Font Format… Drop-down......................................... 16
4.1.27 HTML Source Code................................................... 17
4.1.28 Resources................................................................. 17
4.1.29 Menu Manager.......................................................... 18
4.1.30 Website Quality Checker............................................ 18
4.1.31 Release Page............................................................ 18
4.1.32 Insert Photo Gallery................................................... 19
4.2
Basic Editing.......................................................................... 19
4.2.1 Backspace................................................................ 20
4.2.2 Enter.......................................................................... 20
4.2.3 Text Editing................................................................ 20
4.2.3.1 Using Bold, Italics, Underline, Superscript and Subscript.............................................. 20
4.2.3.2 Aligning Text................................................ 21
4.2.3.3 Creating Lists.............................................. 21
4.2.3.4 Indenting Text.............................................. 22
4.2.4 More on Editing Content............................................ 22
5
The Administrative Interface.......................................................... 22
T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
5.1
Accessing the Administrative Interface.................................... 23 5.1.1 Logging Out............................................................... 23
5.2
Components of the Administrative Interface............................ 23 5.2.1 The Resource Tree..................................................... 24
5.2.1.1 Locating Web Pages Using the Resource Tree............................................. 24 5.2.1.2 Locating Modules Using the Resource Tree............................................. 26
5.2.2 The Utilities Pane....................................................... 27
5.2.2.1 Using the Help Desk.................................... 27
5.2.2.2 My Account................................................. 27
5.2.3 The Content Pane...................................................... 28
5.2.3.1 Publishing.................................................... 28
5.2.3.2 Approval...................................................... 29
5.2.3.3 Advanced Release...................................... 29
5.2.3.4 Permissions................................................. 29
5.2.3.5 Search........................................................ 29
5.2.3.6 Reports....................................................... 29
5.3
Editing Pages from the Administrative Interface...................... 29
5.3.1 The Content Page List............................................... 30
5.3.1.1 The Main Options Pull-down....................... 30
5.3.1.2 The New Page Button................................. 31
5.3.1.3 The Files List............................................... 31
5.3.2 Making New Pages.................................................... 33
5.3.3 Functions of the Main Options Pull-down................... 34
5.3.3.1 Releasing Multiple Pages............................. 35
5.3.3.2 Deleting Multiple Pages............................... 35
5.3.3.3 Selecting and Deselecting all Pages............ 35
T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
5.3.4 Functions of the File Options Pull-down..................... 35
5.3.4.1 Changing a Page Short Name or File Name.................................................... 36
5.3.4.2 Editing Page Content.................................. 36
5.3.4.3 Editing HTML Source Code......................... 36
5.3.4.4 Previewing Your Web Page.......................... 37
5.3.4.5 Sending a Page for Review.......................... 38
5.3.4.6 Releasing a Page........................................ 38
5.3.4.7 Copying a Web Page ................................. 39
5.3.4.8 Deleting a Page........................................... 39
5.3.4.9 Restoring a Previous Version of Your Page................................................... 39 5.3.4.10 Examining the Release History of Your Page................................................... 40
5.3.4.11 Changing Page Permissions........................ 41
6
Releasing Pages............................................................................. 41
6.1
Releasing From the Editing Toolbar......................................... 42
6.2
Releasing from the Content Page List..................................... 44
6.3
Advanced Release.................................................................. 45
T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
1 Introduction Welcome to i:Create, eSolutions’ Web Content Publishing Tool that enables users to easily update, modify, or expand their website whenever and wherever they choose. It was designed so you can manage your web content on your own even if you are not a webmaster. i:Create has been individually customized based on pre-designed templates for each client. Templates retain the font and paragraph styles for the entire site so your website remains consistent when new content is created. i:Create will enable authorized staff to add, edit or delete content from the web templates. There is no limit on the number of people using i:Create. Every user is assigned a username and password. Administrators control user access to different sections of your website by assigning each user different roles and permissions. In this chapter we discuss how to log into the editor, the specifics of the toolbar and its various icons, and how to publish a page to the internet. In later chapters we will expand on the toolbar and its various applications, as well as detailing a wide number of modules associated with the more technical functions of i:Create.
2
Browser Compatibility
i:Create is a browser based application, and does not require the installation of any client software on the host machine to function properly. All that is needed to use i:Create is a browser and functional internet connection. While i:Create will function with most of the popular web browsing software on the market, certain browsers can create odd visual distortion or minor glitches that can make using the program frustrating. To limit these occurrences please use Microsoft Internet Explorer 8.0 or above whenever possible.
3
There are several pages on most sites that will not allow you to log in. For example, any page created by a module contains no editable elements and cannot be modified by a user. Specific examples include Document Manager, News module, and Calendar pages.
Accessing I:Create
The easiest way to edit a page or site feature in i:Create is to navigate to the page you wish to edit and activate the editor. However, you must first have an account set up within i:Create. Your account must have the proper permission to access the page, and the correct role to carry out the modifications you wish to make. If you do not currently have an account you will have to consult your webmaster or IT department. For further information on Roles and Permissions settings see the Users, Roles, Permissions, and Advanced Workflow chapter later in this document.
3.1
Logging In
To login to the i:Create editor: 1. In your website navigate to the page you wish to edit. If you are modifying a wider aspect of the site, for example something controlled by one of the modules found in the administrative interface, you can log into any page on your site. For more on modules see the Administrative Interface section of this document. 2. Push the Ctrl key on your keyboard twice.
6 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
3. The login screen should then appear in your browser window. On the login screen, enter your Username and Password. If you would like i:Create to remember your username and password, click on the check box beside Remember Me. see Figure 3-1
Figure 3-1: The Login Screen 4.
Click the Login button. The Reset button will clear the fields.
5.
The toolbar will open across the top of your browser window and you can now begin editing your site’s content.
6.
To exit the editor push the Ctrl key on your keyboard twice. Note that you must save any changes that you have made prior to exiting the editor. Failure to do so will result in your changes being discarded. For more information on saving your work see The Toolbar and Basic Editing section of this document.
7 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
3.1.1 Password Recovery If you have forgotten your password you can have i:Create email you the password hint you provided when you personalized your user information. Alternatively, ask your website administrator or contact our support team at support@help.esolutionsgroup.ca. To have your password hint emailed to the account associated with your i:Create login: 1. Enter your Username in the login box. 2. Click the Have your Password Hint E-mailed to You link. An automatically generated email will be delivered to the mailbox associated with the specified username.
4
The Toolbar and Basic Editing
Once you have logged into the editor you can begin making modifications to the content of your page using the tools located across the top of your browser window on the toolbar. see Figure 4-1
If you are familiar with word processors you are already well on your way to mastering i:Create. If you are in doubt about how to use any of the tools try using them as you would in your word processor.
Figure 4-1: The Toolbar In this section we will discuss each tool and its primary function and interface. Many tools have individual sections outlining their detailed use later in this document. If the summary does not answer your questions, please see the tool’s individual section.
4.1
The Toolbar
4.1.1 Home The Home button opens the administrative interface to allow the user to work with various functions of the i:Create backend. These include adding or deleting pages, modifying or creating users, and setting up access permissions. For more information consult the Administrative Interface section.
4.1.2 Save Saving in i:Create can be counter intuitive. If something appears wrong visually on your page, try saving. The forced refresh of the save process will often correct the problem.
The Save button saves any modifications you have made to the contents of the page. Each time this button is clicked it creates a new Revision of the page’s Editing Version (Editing Version is explained further in the Administrative Interface section). The Save button also causes the page to refresh, while running a number of cleanup scripts to assure your page looks and functions as it should. i:Create will time out after approximately 20 minutes with no activity. Saving resets the timer, so saving frequently will prevent the frustration of having to stop and relogin to the editor. If the i:Create times out while you are using it you will receive an Operation Failed error message when you attempt to save. Should this occur you will be unable to save any changes you have made since the last time you saved. Don’t panic, follow this procedure to save your data.
8 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
4.1.2.1 Data Recovery After a Time Out To recover information entered after i:Create times out: 1. Select the content of the page, and copy it to your clipboard (select the content then right click and select Copy, or use the copy shortcut, Ctrl + C). 2. Exit the editor by hitting Ctrl twice on your keyboard. 3. Re-enter the editor by hitting Ctrl twice again. 4. You should be asked to re-enter your user name and password. Login again, then paste the content back into the page. 5. Save immediately, once the content has been pasted.
4.1.3 Page Properties The Page Properties
button opens the Properties dialogue box. see Figure 4-2
Figure 4-2: Properties Dialogue The effect of the fields in this box will vary depending on the design of your website. For details on how this information will impact your web pages please see the custom Style Guide provided for your site.
4.1.4 Undo / Redo The Undo button will reverse the effects of your last change to the page. Most content changes can be undone using this tool, however there are some table editing effects that it will not effect. Most browsers will allow you to use the Undo button to step backwards through your work 5 times, but this can vary depending on your browser and the memory setting of your computer. The keyboard shortcut for Undo is CTRL + Z. The Redo the undo).
button will reverse the effects of clicking the Undo button (it undoes
9 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
4.1.5 Spell Checking The Spell Checking
In some cases your Spell Checking tool may be greyed out. This usually occurs because you have not indicated which of the editable areas on your page you would like to spell check. Simply click inside of the editable area you wish to check and the tool should become useable.
button will open the Spell Checking dialogue box. see Figure 4-3
Figure 4-3: Spell Checking Dialogue Spell checking can be done in one of two ways. To spell check specific text select it and click the Spell Checking button. If you prefer to spell check an entire editable are simply click anywhere inside that area and click the Spell Checking button.
4.1.6 Clean Up MS-Word Content The Clean Up MS-Word Content button is intended to remove “junk� code that is carried over when text is copied and pasted directly from Microsoft Word (and other similar applications). This tool should be considered as a last resort only as there are types of code embedded in some copied text that it cannot remove. If possible, rather than using this tool, delete the mistakenly copied text and use the Paste As Text or Paste From Word Tool (see below for more specific information).
4.1.7 Paste as Text The Paste As Text button allows you to paste content into your web page while stripping out all formatting. This tool will remove fonts and font styles, colours, sizes, links, lists, and any hidden code that may have come along with the text. What it leaves is plain text formatted only by the style sheet of your web site. To use this tool copy the text from the original source as you normally would, then position your cursor within your web page where you would like to place your text. Click the Paste As Text button and the Paste As Text dialogue will open. see Figure 4-4
10 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
Figure 4-4: Paste As Text Dialogue Paste your content into the dialogue box and click Submit to add your text to the page. Paste From Word is a rather poor name for this tool. You can use it to paste text from almost any source including Word documents, .pdf files, web pages and emails. Consider it the Paste With Formatting Tool.
Try to avoid underlining text that is not a link, as this can confuse visitors attempting to navigate through your site.
4.1.8 Paste From Word The Paste From Word button behaves much as the Paste As Text button (see above), and allows you to copy text from formatted sources without bringing in hidden “junk� coding. The difference between this tool and Paste As Text is that this tool will attempt to retain basic formatting. Features retained on pasted text include bold, italic, lists, and links. When in doubt about which tool to use, try using Paste from Word first, as it is likely to save some work in reformatting. If the content comes in with a large number of flaws and garbled coding or appearance it may be necessary to delete it and use Paste As Text, then reformat the data by hand.
4.1.9 Font Style Tools The Font Style buttons all function similarly. To apply a bold, italic, underline, superscript or subscript effect to text select it and click the appropriate button. To remove the effect select the text and click the button again.
4.1.10 List Tools The Insert List buttons create either ordered (numbers) or unordered (bulleted) lists. The easiest way to create either style of list is to create each of your list points one at a time and separate them with a paragraph break (inserted by hitting the Enter key). Once you have created all your items select them and hit either the Insert Ordered or Unordered List button. For more details on lists and sub-lists see the Creating Lists section under Basic Editing.
11 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
4.1.11 Alignment Tools Avoid using the Justify alignment if you can. HTML text will not hyphenate; resulting is some very odd spacing. There are also several older browsers that ignore this alignment entirely.
The Alignment buttons allow you to change the alignment of elements on your page, including text, tables, and images. To set a particular style of alignment select the item you wish to align and click the appropriate button. Note that alignment applies to blocks of content that are usually separated by a paragraph break. If you find that an alignment tool is affecting more content than you would like try placing your cursor between the elements and hitting Enter. This should separate the elements and allow them to be aligned separately.
4.1.12 Indent Text Tools The Indent Text and Remove Indent buttons allow you add or remove space at the left margin of your text. The amount these tools indent is defined by the style sheet that formats your page and cannot be controlled by the editor. Much like the Alignment tools the Indent tools will make changes to the entire block of text. If they are affecting too much of your content, separate your paragraphs into smaller elements by placing your cursor within the block and hitting Enter. These tools are also used in conjunction with the List tools to create sub-lists.
4.1.13 Horizontal Rule The Horizontal Rule button places a thin graphic divider at the location of your cursor. The Horizontal Rule is chiefly used as a break in the content when a space is insufficient to represent the separation of ideas. The Horizontal Rule always spans 100% of the available width of the page.
4.1.14 Insert Anchor The Insert Anchor button inserts an invisible element that can be used with certain types of links as a target for navigating within a page (as opposed to between pages). For more information on using Anchors see the Hyperlinks section later in this document. Clicking the Insert Anchor button will open the Insert Anchor dialogue box. see Figure 4-5
Figure 4-5: Insert Anchor Dialogue
12 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
Note that there is no convenient way to reveal the name of an anchor once you have inserted it into the page, so you may wish to keep notes on where you are placing them and what you are calling them.
4.1.15 Insert / Edit Link The Insert/Edit Link button converts the selected image or piece of text into a hyperlink. Note that unless you have an image or text selected the tool will remain greyed out. Clicking the button opens the Insert/Edit Link Dialogue. see Figure 4-6
Figure 4-6: Insert/Edit Link Dialogue To edit a link after it has been created select the image or place your cursor anywhere within the link and click this button. For more details see the Hyperlinks section later in this document.
4.1.16 Remove Link The Remove Link button is used to remove a link from an image or piece of text. Select the link image, or place your cursor anywhere within a piece of linked text and click this button to remove the link. Note that the text or image itself will remain but it will no longer appear as a link.
4.1.17 Abbreviation The Abbreviation button creates an annotation explaining the meaning of the Abbreviation which is activated by passing your mouse over the specified text. To create an Abbreviation select the relevant text and click the button to open the Abbreviation dialogue. see Figure 4-7
13 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
Figure 4-7: Abbreviation Dialogue Enter the full text of the abbreviation into the title box and hit Submit (e.g. if the abbreviation were SEO you would enter Search Engine Optimization in the dialogue box). Abbreviation also has applications with Assistive Technologies. If a person is using a screen reader the abbreviation will be read out as its individual letters, instead of being sounded out as a single word.
4.1.18 Acronym The Acronym button operates in an identical fashion to the Abbreviation button, with one minor exception. Persons using assistive technologies will have the letters of the acronym sounded out for them as a single word rather than it being read as individual letters (e.g. NASA is always pronounced as a single word, rather than read out as 4 individual letters).
4.1.19 Email Link The Email Link button is used to create a secure email link so that you can receive mail from your site without fear of having your email address stolen. This tool is controlled in part through the Email Manager module. For more information on creating an Email Link, see the Hyperlinks section later in this document.
4.1.20 Insert / Edit Image The Inset/Edit Image button is used to place images within your page content. Place your cursor where you would like to insert your image and clicking the button to open the Insert/Edit Image dialogue. see Figure 4-8
Figure 4-8: Insert/Edit Image Dialogue
14
T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
To edit an image that has been previously placed select it and click Insert/Edit Image again. For more information on inserting and editing images see the Images section later in this document.
4.1.21 Insert / Edit Embedded Media The Insert/Edit Embedded Media button allows you to embed a variety of Flash and video files directly into your page. As with other Insert/Edit tools, place your cursor where you would like to embed the media and click the button to open the Insert/Edit Embedded Media dialogue box. see Figure 4-9
Figure 4-9: Insert/Edit Embedded Media Dialogue To edit an embedded media item that has been previously placed select it and click the Insert/Edit Embedded Media button again. For more information on inserting and editing media see the Video section later in this document.
4.1.22 Insert / Edit iFrame The Insert/Edit iFrame button allows you to embed a floating element that acts as window onto another web page. The most common use for iFrames in i:Create is to embed forms created through i:Survey directly into a web page. To insert an iFrame, place your cursor in the desired location and click the button to open the Inset/Edit iFrame dialogue box. see Figure 4-10
Figure 4-10: Inset/Edit iFrame Dialogue
15
T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
If you are concerned about Accessibility do not copy and paste tables from Word or Excel documents (even using the Paste From Word tool). Such tables will have to be rebuilt manually, or if this involves too much labour, you might consider converting them to PDF files and having your visitors download them.
To edit an iFrame that has been previously placed select it and click the Insert/Edit iFrame button again. For more information on inserting and editing iFrames see the iFrame section later in this document.
4.1.23 Table Tools The Table buttons allow you to add or modify tables. As with other iCreate tools a table can be added to your page by positioning your cursor and clicking the Insert/Edit Table button. For a detailed explanation of each tool and instructions on how to insert and modify table see the Tables section later on in this manual.
4.1.24 Toggle Guidelines / Invisible Elements The Toggle Guidelines/Invisible Elements button will cause hidden page components to appear. This tool will show the location (but not the name) of anchors, and outlines the structure of invisible tables. It will also highlight any links on the page, which can be useful in locating any hidden characters that have accidently been added to the link. As the name suggest this button acts as a toggle. Click it a second time to rehide the invisible elements.
4.1.25 Style‌ Drop-down The Style drop-down allows the application of various pre-built styles to elements on your web page. The content of this drop-down will vary greatly depending on the design of your website, but in most cases it contains specialised visual elements that help create a consistent look. If your images have a decorative border, for instance, you are likely to find it under the Style drop-down. In most cases these styles will be applied by selecting an element on your page the selecting the appropriate style from the drop-down. Some of the styles that you find in this menu may have been created as part of the sites development process and may not operate as you would guess. These styles were not intended to be applied by the end user and require special coding. For more details on the styles that have been created for your site see your Style Guide or contact eSolutions support.
4.1.26 Font Format‌ Drop-down The Font Format drop-down allows you to add HTML Headings to your page content. To add a heading place your cursor within the block of text you wish to format and select the type of heading you would like from the drop-down. Like the Alignment and Indent tools the heading will affect an entire block of text. If you find that your heading are being applied to more content than you would like make sure your target text is separated from everything else by paragraph breaks. Proper use of Headings has a significant impact on both the search engine optimization (SEO) and the accessibility of your site. For more information on how to use them correctly see the Headings section of this document. To remove a Heading from a block of text place your cursor anywhere in the block and select Paragraph from the Font Format drop-down.
16 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
4.1.27 HTML Source Code The HTML Source Code button will open the source code window, showing the HTML code which is used to format the page’s content. see Figure 4-11
Figure 4-11: HTML Source Code Window i:Create is very finicky about modifications directly to the HTML. This has to do with restrictions placed on changes by Accessibility considerations and proper syntax. If you click the Submit button and nothing happens it means that you have made a change that i:Create will not accept. Unfortunately you will have to close the page to exit the screen, so make sure you save before attempting any changes directly to the code.
If you are familiar with HTML you can make modifications directly to the code. Once you have completed your edits confirm any changes by clicking the Submit button. The window will close and the content should now reflect any modifications you made. Across the top of the HTML Source Code Window you may notice a series of tabs labeled with TK followed by a number. The number of tabs will vary depending on the design of your site, but each tab represents one of the editable regions on your web page. In most cases which region you are working on is obvious based on the content, but if you are unsure try exiting the code window ant typing something distinctive into the editable region you are looking for (a line or dashes or x’s works well). Then enter the code window and locate the tab that contains your distinct characters.
4.1.28 Resources The Resources
button opens the Resources Dialogue. see Figure 4-12
17 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
Figure 4-12: Resources Dialogue While using this window to navigate through your site’s structure you can see the various files and pages available. Note the tabs across the top of the window (Pages, Document Files, Image Files, and Media Files) which will allow you to filter the types of resources you are seeing. This dialogue will also allow you to delete or upload additional resources. For further information on managing resources see the Resources section later in this document.
4.1.29 Menu Manager The Menu Manager button will open a Menu Manager window that gives you the ability to make changes to the menu structure of your web site. Make sure that you save any changes made to menu entries before closing the window. For more information see the Menu Manager section later in this document.
4.1.30 Website Quality Checker The Website Quality Checker button opens the Link Checker Dialogue. This tool will allow you to examine all the links on either a single page or across the entire website. It outputs a report that details all the broken links within the scope of its search. Further details on the use of this tool can be found in the Link Checker section of this document.
4.1.31 Release Page The Release Page button opens the Release Page Dialogue and allows you to set the page for release to the public. This dialogue functions identically to the release process discussed in Releasing Pages under the Administrative Interface. For further details regarding releasing pages refer to that section of the manual.
18
T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
4.1.32 Insert Photo Gallery The Insert Photo Gallery button will open the Insert Photo Gallery Dialogue and allow you to select a gallery from a pre-existing list. see Figure 4-13
Figure 4-13: Insert Photo Gallery Dialogue Selecting a gallery from the Title list and clicking submit will insert a note into your content (Photo Gallery: ******** will appear here on the public site). This denotes where the gallery will appear once the page is live. You cannot preview the gallery itself without releasing the page and browsing to it from the public side of your web site. Note that if your website is not equipped with the Photo Gallery module this button may be greyed out, or will not appear on your toolbar. For information on creating and managing galleries refer to the Photo Gallery Module section latter in the manual.
4.2
Basic Editing
Using i:Create to edit basic content is much like using a word processor to make modifications to any local document. To enter text content place your cursor and start typing. However there are a few significant differences between working with i:Create and a word processor. i:Create uses HTML and CSS to code its content, and because of this layout tends to be more rigid than in a specialized word processor, and your options more limited. In addition there are certain keys that work a little differently than you might expect. Some are reserved for use by the browser, and others simply operate in an unusual fashion due to the requirements of HTML.
19 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
4.2.1 Backspace The backspace key is notorious for causing problems with new i:Create users. Many users are used to hitting the backspace key to remove content, however most browsers use the backspace key as the Back command. Pushing the backspace key while in the editor will take you back to the previous page. In most cases this is the same page, but before you opened the editor. If this occurs all unsaved content is dumped as the editor closes. Obviously this can be extremely frustrating. There are a couple of practices you can follow to help prevent this from becoming a problem: 1. Make sure that your focus area is in the editable area of the page. Click into the editable region you are deleting from and make sure you can see your cursor flashing before you push backspace. If you can see your cursor flashing it’s safe to use the backspace key. Be careful not to assume where your cursor is when selecting large blocks of text for deletion. You can select without placing your cursor within the page! 2. Try to use the delete key whenever possible. It might take some practice to get used to, but it won’t accidentally erase your efforts. 3. Save frequently. This is always a good habit, and will minimize losses if you accidently hit backspace.
4.2.2 Enter The enter key acts a little differently in i:Create. As you edit your page you will notice that by default Enter creates a double space rather than dropping to the next immediate line. This is due to how paragraph breaks are handled by HTML. If you would like to move down to the next line, rather than having an extra space use Shift + Enter. Note that lines separated by Shift + Enter are still considered part of the same block of code by i:Create. This means that some tools will affect all lines separated in this fashion. For example, if you were to use the Center Align tool on lines separated only by a Shift + Enter, both lines would center. Unfortunately there is no way to separate the lines in this case but with a full Enter, including its extra space.
4.2.3 Text Editing Editing the text on a web page requires that you Login to i:Create. Once you have navigated to the page you wish to edit follow the Login instructions provided in the Accessing i:Create section. If you are accessing your page through the Administrative Interface you can follow the instructions in that section to begin editing content.
4.2.3.1 Using Bold, Italics, Underline, Superscript and Subscript To use any of the Font Style
tools:
1. Highlight the text you wish to format by clicking and dragging over it. 2. After you have highlighted your text, click the selected style button. 3. To remove the formatting simply select the formatted text and then click on the Respective button again.
20 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
4.2.3.2 Aligning Text The Alignment tools will allow you to place text on your website so that it is aligned to the left, right, centre or is justified (aligned on both the right and left margins). To use these tools: 1. Place your cursor anywhere in the text block or adjacent to the image you wish to align. Selecting is not necessary. 2. Click the selected alignment type. The default alignment is left. 3. To remove the alignment, place your cursor inside the text block again and select a new alignment.
4.2.3.3 Creating Lists The Insert List simple list:
tools are used to create numbered or bulleted list. To create a
1. Create each of your list items and separate them with a paragraph break between each entry (created by hitting the Enter key). 2. Highlight all of the items and click the button for the type of list you would like to create (ordered – numbered or unordered – bulleted). 3. To remove the bullet or numbered list, select the text and click on the button again. To create a sub-list requires that you use the Indent Text tool in conjunction with the Insert List tools. The process is identical to creating a list as above, but adds the following steps: 1. Select the item or items in your list you would like to indent to become a sub-list. 2. Click the Indent Text tool to convert the selected item into a sub-list. see Figure 4-14 Try not to use the Indent Text and Remove Indent tools too much when creating nested lists. Toggling the indents back and forth can create extremely convoluted code and may prevent you from editing the list properly in the future. If a list starts to act oddly it is often best to delete it and start from scratch.
Figure 4-14: Sub-Lists
21 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
3. To remove the sub-list select the sub-list items and click the Remove Indent tool. There is one thing to note about bullet and number styles. Creating a bulleted sublist will change the bullet style from solid to hollow. The is no corresponding change for numbered list. Some word processors convert numbered sub-lists to letters, or roman numerals. i:Create does not offer this option, but it will maintain this style of formatting if the list is pasted in using the Paste From Word tool.
4.2.3.4 Indenting Text The Indent Text and Remove Indent tools indent text, or remove indenting. It can also be used to create sub-lists in either ordered and unordered lists. To indent text: 1. Place your cursor anywhere within the block of text you wish to indent. Selecting the text directly is not required. Click the Indent Text tool. The tool can be clicked multiple times to create deeper indents. see Figure 4-15
Figure 4-15: Indented Text 2. To remove indenting place your cursor within the indented text block and click the Remove Indent tool.
4.2.4 More on Editing Content For more information on using i:Create’s tools to edit the content of your page see the detailed instructions for the task you are performing later in this document. If you continue to have difficulties please contact eSolutions Group support team (support@help.esolutionsgroup.ca or by phone at 1.866.691.5528).
5
The Administrative Interface
The Administrative Interface, also called the Back End or the Resource Tree is the non-public side of your i:Create web site. It contains the tools you need to manage pages, resources, and the websites general interaction with the public. If your site includes features such as a News module, Photo Gallery, or an Alert Banner the Administrative Interface is where you would find them.
22 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
i:Create, and any page you open from the Administrative Interface, have a tendency to hijack open browser windows, even if they are minimized. If you try to open a page from your site’s back end and nothing appears to happen check your other open browser windows. i:Create may have dropped your new page into one of them.
This section describes basic navigation within the Administrative Interface, and how to carry out its basic functions. For more detailed information on working with the various modules associated with your web site please see their individual sections later in this manual.
5.1
Accessing the Administrative Interface
The Administrative Interface can be accessed from almost any page in your website. To open the Administrative Interface: 1. Navigate to any page on your site that allows you to open the Toolbar (pages generated by modules, such as the Document Manager and the News Manager won’t work). 2. Hit CTRL twice on your keyboard to open the toolbar. 3. Click the Home
button to open the Administrative Interface.
5.1.1 Logging Out To log out of the Administrative Interface click the Logout link in the upper right hand corner of the interface. Make sure that you log out if you are stepping away from your desk, as creating mischief is very easy if an unauthorized individual is allowed access to the Administrative Interface.
5.2
Components of the Administrative Interface
The administrative Interface is broken down into several panes, each with its own unique function. Some of these panes will maintain a relatively constant appearance, while others will change depending on what site features or modules you are currently working with. see Figure 5-1
Figure 5-1: The Administrative Interface
23
T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
5.2.1 The Resource Tree Situated at the left side of the Administrative Interface is the Resource Tree, i:Create’s primary back end navigation tool. It allows you to locate pages, resources and modules and provides an excellent overview of how your site is put together. see Figure 5-2
Figure 5-2: The Resource Tree
5.2.1.1 Locating Web Pages Using the Resource Tree The resource tree is not organised as a regular Windows file structure. To locate individual web pages: 1. Expand the Resource Tree hierarchy by clicking on the expand icon the corporation’s top level folder. see Figure 5-3
next to
Figure 5-3: The Corporation’s Top Level Folder
24 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
If you are looking for a file and are unsure where it is located try checking the front end of your site. If you navigate to the page the URL in the address bar will point you at the folder you are looking for.
2. Your website’s file tree will expand revealing its organizational structure. Most i:Create sites will have one folder representing each of the verticals or departments in your site. You might also notice some folders that are not included in your site’s menu structure (such as General or Includes). These folders contain information not generally associated with a specific vertical, such as your home page and modules. Open the department which contains the file you are looking for by clicking its associated expand icon. 3. Under the expanded department you will see two additional folders, Modules and Templates. see Figure 5-4
Figure 5-4: The Modules and Templates Folders 4. The Modules folder is generally empty, unless you are in the General department, but the Templates folder will have at least one entry. Open it with the expand icon. 5. Under the Templates folder you will see an entry called interior. It is possible that you could see other items besides interior, depending upon the design of your website and your current location in the file structure. The interior entry refers to the interior template, the pattern used to create all the internal pages in a department. All pages created from a template are associated with it in the file structure. Click the interior template and the left content page becomes a list of the pages created from that template, called the Content Page List. see Figure 5-5
Figure 5-5: Content Page List
25 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
5.2.1.2 Locating Modules Using the Resource Tree There are many locations within the Resource Tree where you will see the Modules folder. Each department has it’s own, and there is also one in the main corporation folder. However, all but one of these will be empty. To locate your site’s modules: 1. Expand the resource tree until you locate your General folder. 2. Open the General folder and expand the Modules folder you find there. You should now see a list of all the modules attached to your website. see Figure 5-6
Figure 5-6: Modules List
26 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
5.2.2 The Utilities Pane The Utilities pane occupies the lower left corner of the Administrative Interface. From this area you can change your user settings and access the Help Desk.
5.2.2.1 Using the Help Desk Clicking the Help Desk entry in the Utilities pane will open the Help Panel in the right content pane. This screen will provide information on contacting eSolutions Group support. In addition you will also find a number of links to useful video tutorials and documentation including a PDF version of this document under the Manuals section. If you require further assistance you can click Help in the upper right corner of the screen to open i:Create’s online help files.
5.2.2.2 My Account The My Account entry under the Utilities pane will open your User Profile and allow you to make changes to your user information such as your password and email address. see Figure 5-7
Figure 5-7: User Profile
27 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
The fields located in the User Profile are: The Password fields are filled with bullets when you first open the My Account tool. Your password is not actually this long. The bullets are there to make guessing your password based on the number of characters impossible.
Username – Your username. You cannot change your user name from this interface. If you require a new username it involves creating a new account. See the section on Users, Roles, Permissions and Advanced Workflow for more details. Password and Confirm Password – Enter and re-enter your password. i:Create passwords must be at least three characters long but i:Create passwords do not expire, so you may wish to change yours from time to time. Password Hint – If you forget your password there is a button on the login screen that will mail you this hint. Make sure this is something that will jog your memory without completely giving away your password. First and Last Name – Your first and last names. Try to avoid using just initials, as this can make identifying users difficult. E-mail – Your email address. Make sure this is accurate as there are a number of notifications that i:Create auto-mails to you, including when you need to approve pages, and when news items are posted. Preferred Language – If you are working with a bilingual site this will allow you to change the editor’s language to another selection. If your site was designed in only one language, the only option available will usually be English. Current Roles – These outline the various function you are authorized to carry out on the site. For more details about roles see the Users, Roles, Permissions and Advanced Workflow section of this manual. Current User Groups – A list of user groups that have been set up on the site. For more on user groups see the Users, Roles, Permissions and Advanced Workflow section of this manual. If you make any changes to the information under your User Profile make sure you click the Save button at the bottom of the window before you close it.
5.2.3 The Content Pane The content area occupies the majority of the screen in the Administrative Interface and is situated to the immediate right of the Resource Tree and Utilities Pane. It is also the most variable of the panes, changing to reflect the items the user selects in the resource tree. Across the top of the content pane you will find a series of tabs. In most cases the function of these tabs is also context sensitive, reflecting the site elements the user has selected in the Resource Tree.
5.2.3.1 Publishing The Publishing Tab is the most heavily used tab in the Content Pane, as well as being the most variable. When the Corporation or a site department are selected in the resource tree it shows the Manage Resource screen (See Resources for more details), when a template is selected (for example, interior) it will show the Content Page List (see Editing Pages from The Administrative Interface), and when a Module is selected it shows the relevant module’s interface (for more information on Modules see their individual chapters).
28
T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
5.2.3.2 Approval The Approval tab contains a list of all pages waiting to be approved prior to going live. If you have received an email requesting approval for a page, this will be the tab where you find the page. For more information on page approvals and how this tab works see the Users, Roles, Permissions and Advanced Workflow section.
5.2.3.3 Advanced Release The Advanced Release tab allows users to release multiple pages without having to go through them one at a time. Caution should be exercised when using this tool as it can release all the pages in a given department, or even the entire site. For more information see the Releasing Pages section.
5.2.3.4 Permissions The Permissions tab allows you to set user access to various components of the site. Not that the level of customization that can be performed is dependant on your existing role and permissions on the site. For a detailed walkthrough of setting permissions and site security see the Users, Roles, Permissions and Advanced Workflow section.
5.2.3.5 Search The Search tab provides a tool for locating and managing content on your site. It provides tools for locating pages and resources using a variety of search criteria, and can be very useful in finding old, unused, or poorly maintained sections of your site. More details on Search and be found in the Search and Report section of the manual.
5.2.3.6 Reports The Reports tab is another useful tool for managing the content. Like Search it offers a number of criteria than can help you locate and manage resources. Detailed information on how to use the Reports tab can be located in the Search and Report section.
5.3
Editing Pages from the Administrative Interface
Working with Pages in the Administrative Interface is done chiefly through the Content Page List. see Figure 5-8
Figure 5-8: Content Page List
29
T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
The primary component of the Content Page List is a table detailing information about each of the web pages in the selected department. To open the content page list: 1. In the resource tree, select a department and open its folder using the expand icon.
If you do not see the Content Page List when you click your template, make sure that you have the Publishing tab selected at the top of the screen.
2. Under the Department you will see two folders, Module and Templates. Expand the Templates folder. 3. Under Templates you will see a listing of the templates associated with your chosen department. In most cases there will be only one choice, Interior. Select Interior to open the Content Page List. In some cases there may be other entries under Templates. Usually these additional templates show up under the General department and include things like Landing Pages and the Home Page.
5.3.1 The Content Page List The Content Page List includes a number of tools and features that allow you to manage and edit your pages.
5.3.1.1 The Main Options Pull-down The Main Options pull-down allows the user to carry out a number of global or mass functions based on which pages the user has selected from the Files List. see Figure 5-9
Figure 5-9: The Main Options Pull-down The Main Options pull-down contains: Release Selected Pages – This function will create a mass release for any pages selected in the file list. For more information on Releasing and Mass Releasing pages see the Releasing Pages section. Delete Selected Pages – This option will permanently remove any selected pages. Note that there is no way for you to restore a page once it is deleted. Clear Select - The Clear Select option will uncheck any pages that you currently have selected. This can be useful when page scrolling prevents you from seeing all the pages you may have selected. Select All – Checks all page selection boxes in the current department.
30 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
5.3.1.2 The New Page Button Clicking the New Page button opens the General Information pane, which will allow you to create a new page from the currently selected template. see Figure 5-10
Figure 5-10: The General Information Pane For full information on creating new pages see the Making New Pages section.
5.3.1.3 The Files List The Files List shows all files in your current department. see Figure 5-11
Figure 5-11: The Files List
31 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
The components of the file list and their functions are:
Name
Also referred to as the file’s Short Name, this designation is created when you generate a new page and is never seen by the public. It is used by the Files List to alphabetize pages, so changing the Short Name can be used to help in organizing your files.
File
The file name of your page. For more information see the Making New Pages Section. Clicking on the file name will open the editing version of your page.
Editing Version
The Editing Version represents the non-public version of the page saved to the server. It is essentially your save file. The revision number here represents the number of times the file has been saved in its lifetime. Other data listed in this column also includes the date the file was last edited and the user name of the editor who made the changes.
Released Version
The Released Version column of the table shows which of your Editing Version Revisions was last released to the public site. If the revision number here matches that of the Editing Version it means that the live version is up to date with any changes that have been made. Status represents the current release state of the page. There are several Status types you may see. They are: Released – The current editing version of the page has been released and is visible on the public site. Changes Pending – The Editing Version has been modified, but the changes have not yet been released to the live site.
Status
Waiting to Release – The release process has begun, but is not yet complete. In some cases this process can take several minutes, depending on server traffic and your page’s content. Waiting for Approval – Your page is in the process of being released but is being held because your site security requires approval to release material to the public. See the Users and Permissions section for more details.
Expire Date
The date the page will expire. If your page has no set expiry date then this column will be blank.
Live Preview
The Live Preview button will open a new browser window showing you the live version of your web page. In some cases viewing the live version of your page may be the only way to preview certain script based processes, such as news feeds and secure email links.
32 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
New Page
The New Page button will take you to the New Page dialogue and allow you to create a new page. For more information see the Making New Pages section.
Options Menu
The Options menu contains the primary tools for modifying and managing your pages. For more details on specific functions of the tools listed under the Options menu, look at the Functions of the Options Menu section.
5.3.2 Making New Pages To create a new web page within your web site: 1. Login to i:Create using your username and password. If you are logging in from a front end page click the home button on the toolbar to open the Administrative Interface. 2. Select the department you wish to place your new file in from the resource tree on the left. Typically the departments are named the same as the main menu items. 3. Expand the department by clicking on the + sign next to the department name, and then do the same with the template folder. 4. Select the template from which you want to create your new page. Typically you will choose the Interior template. This will be your only option unless the department you are in has custom templates available. If you are in the General or Includes folders you may see other options. 5. Click on the template and the Content Page List will load in the right pane. 6. Click on the New Page button at the top of the page next to the Main Options Pull-down or click the New Page button associated with any file in the list. This will open the New Page dialogue. see Figure 5-12
Figure 5-12: The New Page Dialogue
33 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
7. Enter the requisite information about the page you are creating. The fields in this form are: Short Name
Enter a brief logical name for the content page. The Short Name is used to alphabetize your page in the file list.
File Name
Enter the file name. In most cases this will be similar to the Short Name, but it can contain only letters (case is not relevant), numbers and underscores.
Name
The name of the content page in the site’s default language. This will be the name used to automatically fill out most fields in i:Create, such as the Menu Manager’s Link Text field.
Description
A brief description of the page’s content in the site’s default language.
To update the language specific Name and Description of the content page, click on the corresponding tabs and update the fields. 8. Click Add. The file will be created and the Common Properties of the new content page will display. Click the List button to return to the content list. 9. To edit the content of the page, select Edit Content from the options drop-down.
5.3.3 Functions of the Main Options Pull-down The Main Options pull-down can be found in the upper left corner of the Content page list, adjacent to the New Page button. see Figure 5-13
Figure 5-13: The Main Options Pull-down
34 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
The tools in this menu allow you to perform mass operations on multiple pages.
5.3.3.1 Releasing Multiple Pages To release multiple pages click the Selection Box next to each page you wish to release and select Release Selected Pages from the menu. This will take you to the Page Release Dialogue. For further information on releasing pages to your live site see the Releasing Pages section. Note that using this method requires that all the selected pages are released (and expired) at the same time. If you wish to set individual release and expire dates you must set up the page releases individually.
5.3.3.2 Deleting Multiple Pages To remove multiple pages from your website click the Selection Box next to each file and select Delete Selected Pages from the Main Options Pull-down. Exercise caution when using this tool. These pages are deleted permanently and cannot be restored.
5.3.3.3 Selecting and Deselecting all Pages The Main Options pull-down allows you select or deselect all files in a department rather than clicking their Selection Boxes one at a time. To select all files chose Select All from the Main Options pull-down. Conversely, to deselect all pages use Clear Select from the pull-down.
5.3.4 Functions of the File Options Pull-down The File Options pull-down menu appears at the end of each file’s entry in the Content Page List, and provides the user with a number of useful tools and functions for managing site files. see Figure 5-14
Figure 5-14: The File Options Menu
35 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
5.3.4.1 Changing a Page Short Name or File Name To edit the Short Name or File Name of your page: 1. Select the Edit Properties selection from the File Options menu. This will open the Page Properties dialogue containing the Short Name and File Name fields. see Figure 5-15
Figure 5-15: The Page Properties Dialogue
The Short Name can be changed to almost anything you like, but be careful when changing the File Name. Links are not updated automatically. A different file name can result in error pages and broken hyperlinks, so it’s best to make sure your File Name is what you want when the page is created.
2. Edit the Short Name or File Name as necessary. Note that this will not change the name that appears in the Menu Manager selection screen, or in many of the other auto-populated fields. To change that name click on the Language tab (most often English or French) next to Common Properties at the top of the dialogue window and change the Name entry there as well. 3. Click the Save button to confirm the changes.
5.3.4.2 Editing Page Content To edit page content from the Options menu select the Edit Content entry from the Options drop-down. This will open your page in editing mode with the toolbar already active.
5.3.4.3 Editing HTML Source Code To edit the HTML source code for your page select the Edit HTML Source entry from the Options drop-down. This will open an HTML Editing Dialogue containing a number of Token entry fields. see Figure 5-16
36 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
Figure 5-16: The HTML Editing Dialogue
If you are concerned about accessibility be aware that some HTML tags, such as FONT, can cause problem with assistive technologies such as screen readers. If you are unsure if your code might be an issue contact eSolutions support for assistance.
Each of the Token fields is labeled with TK and a number and represents one of the editable regions on your page. You can type or paste in code as necessary, but remember to click the Save button when you are finished. The List button will return you to the Content Page List, and the Edit Content button opens your page for editing with the toolbar already active.
5.3.4.4 Previewing Your Web Page Selecting the Preview entry from the Options pull-down opens the Editing Version of your page in a new browser window. This performs identically to clicking the file name in the File column of the Content Page List.
37 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
5.3.4.5 Sending a Page for Review In many cases you may wish to get a second opinion regarding the content or appearance of a web page. The Email for Review function in the options pull-down allows you to send a link to your page via email to a second party, even if they are not an i:Create user. Note that this function is not connected to any approval processes that may have been put in place. To Email for Review: 1. From the Options pull-down, select the Email for Review selection. This will open the Email Page for Review dialogue. see Figure 5-17
Figure 5-17: The Email Page for Review Dialogue 2. Enter the destination email in the Email field. 3. Click the Submit button. i:Create will auto generate an email containing a link to the selected page. see Figure 5-18 Hi Recipient, Sender sent you the following page to review: Contact Us - https://icreate4.esolutionsgroup.ca/230000_PAMA/en/contactus.asp This message is auto generated by i:Create. Figure 5-18: Email for Review Message
5.3.4.6 Releasing a Page The process of releasing a page makes its content live to the public. There are a number of ways to release a page, including using the Release selection in the File Options menu. For detailed instructions on the various means of releasing a web page see the Releasing Pages section.
38 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
5.3.4.7 Copying a Web Page Currently i:Create does not support moving pages from one department to another or from one template to another. To move content, copy and paste the content from one page to the next. Or copy the content to a word processor and then copy the contents to the new page.
The File Options pull-down gives you the ability to create copies of pages. This is usually done to save labour when a new, similar page is required. To create a copy of a page: 1. Select Copy from the options pull-down list associated with the file you wish to duplicate. 2. After you select copy, a new page will appear in the content page list with “copyOf_� added to the file name. 3. To change the name of page and the file name, select Edit Properties from the File Options drop-down list. 4. To rename a page enter a new name in the Short Name and File Name boxes, then press Save. Change the language related data to match your new names by clicking the English (and if applicable, French) tab, and making the appropriate modifications. Click Save after any changes.
5.3.4.8 Deleting a Page To delete a web page select the Delete entry from the File Options pull-down associated with the page you wish to remove. You will be prompted to confirm the deletion. Click Yes to remove the page permanently from your site. Note that there is usually no way to restore a web page that has been deleted in this manner. If you do not see the option to delete a page under the Options menu you do not have sufficient permissions to delete pages. Only site administrators have the ability to delete pages.
5.3.4.9 Restoring a Previous Version of Your Page Each time you save your web page it creates a new revision. This can be seen in the Content Page List under the Editing Version column. Each save causes the Revision number to increase by one. By using the Page History option it is possible to roll back your web page to any of these previous versions. This can be very useful if you have accidently saved over or deleted vital data or simply wish to restore old content, such as in seasonal web pages. To restore a previous version of your page: 1. Select Release History from the options pull-down list associated with the file you wish to restore. This will open the Release History List. see Figure 5-19
39 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
Figure 5-19: Page History List 2. If you are unsure which revision you would like to restore you can click the file name under the File column, or select Preview from the Options drop-down to view a previous version. When you have decided which revision you wish to revert to select Make Current from the Options drop-down. 3. When asked to confirm click OK. The Revision Number of your page will increase by one, and the content and appearance of the page will now match that of your selection from the Page History List.
5.3.4.10 Examining the Release History of Your Page There may be times when it is necessary to go back and examine the information which has been released to the public. The Release History selection in the File Options menu provides a list of all the web page revisions that have ever been released. see Figure 5-20
Figure 5-20: Release History List
40 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
The Release History List only gives you the ability to see a preview of the page, by clicking the button under options. Unlike the Page History List, previously released versions of the page cannot be made current. This measure was put in place to prevent the possibility of using the tool to circumvent the release approval process. If you would like to restore a previously released version, make note of the Page Revision number of the version you would like to restore. Return to Release History, and make that revision current. You can then release the old revision to replace the more recently released version.
5.3.4.11 Changing Page Permissions The last entry in the Options drop-down allows you to set the Permissions for individual pages. For detailed instructions and further information on page permissions see the Users, Roles, Permissions, and Advanced Workflow section.
6
Releasing Pages
When pages are edited or created, they are not made live to the public website until you release the content. Prior to release the Revision number of the Editing Version on the Content Page list represents the save file. Once a page is released to the live site the Revision Number of the Released Version shows you which page revision is currently being displayed on the public site. Whatever method you use to release your pages be aware that there will be a delay between the actual release and the appearance of the updated page on your web site. Depending on the time of day and server traffic it can take as much as five minutes for your updates to go live, although the usual delay is only about thirty to forty seconds. If you are unsure if your page has been released check the Content Page List. If the status of your page reads Waiting to Release then your page has yet to go live. There are three ways to release page content. 1. From the editing toolbar – recommended If you are creating a new page or editing a single page. 2. From the Content Page List – Recommended if you are editing multiple pages in the same department. 3. Advanced Release – If you want to release multiple pages from different departments, or large quantities of pages at one time.
41 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
6.1
Releasing From the Editing Toolbar
To release a page from the Editing Toolbar: 1. Save your page using the Save button on the toolbar. If you do not save prior to release your page i:Create will prompt you to do so. 2. Click on the Release Page button (usually the last or second to last button on the toolbar) to open the Page Release Dialogue pop-up. You will see one of two version of this dialogue, depending on the security setting of the site and your permission level. see Figure 6-1 and Figure 6-2
Figure 6-1: The Page Release Dialogue Version 1
Figure 6-2: The Page Release Dialogue Version 2
42 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
3.
4.
To complete the Release fill out each of the fields in the dialogue:
Release Content for all Languages?
If your site is multi-lingual this will release all the versions of your page corresponding to other available languages. By not checking this box you are specifying the release of only the current language.
Approve pages before release?
This will send an approval request to the person specified under the Selected Approver pull-down. Your page will not release until this person has provided their approval. For further information on approval see the Users, Roles, Permissions, and Advanced Workflow section.
Release Date
Specify the date and time of the page’s release using the calendar icon next to the field. If you wish the page to release immediately ignore the field and the calendar icon and click the Current Date/Time check box next to the field.
Expire Date
Select a date for the web page to expire by using the calendar icon next to the field. Expired pages will be removed from the website and visitors will receive a message stating that the page is no longer available.
Send email notifications?
Clicking this checkbox will send a email notification to the selected approved informing them that a page is awaiting their attention. If you do not send a notification the approver will have no indication that a page is waiting.
Select Approver
This pull-down allows you to select a user from the web site to approve the page you are releasing. Only individuals with the proper role and permissions setting to approve your page will appear in this list.
Click the Save button to finalise the release. A confirmation message will appear at the top of the dialogue telling you the release information has been save successfully. see Figure 6-3
Figure 6-3: Release Success Message Note that this message may contain additional information in some cases, such a release date or time.
43 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
6.2
Releasing from the Content Page List
To release single or multiple pages from the Page Content list: 1. Navigate to your web site and hit CTRL twice to Login to i:Create using your username and password. Open the Administrative Interface using the Home button on the toolbar. 2. Click the expand icon next to the department in the resource tree which contains the page or pages you wish to release. 3. Click the expand
icon next to the Templates folder with the selected department.
4. Select the template associated with the web page or pages you wish to release. In most cases this will be the Interior or Content template, but specialised pages such as your home page and custom landing pages may have different templates. 5. A Content Page list will appear in the right hand pane. Select the checkboxes in the first column of the table associated with the files you wish to release. see Figure 6-4
Figure 6-4: Selecting Files in the Content Page List 6. From the Main Options drop-down at the top of the Content Page List select Release Selected Pages. This will open a Page Release dialogue. 7. Fill out the requisite fields in the Page Release dialogue. For a detailed explanation of these fields see the Releasing from the Editing Toolbar section, above. 8. Click the Save button and you will receive a confirmation message letting you know that the release has be successful.
44 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
6.3
Advanced Release
Advanced Release allows the user to release whole departments, or even all the pages in the entire site in one operation. To perform an Advanced Release: 1. Navigate to your web site and hit CTRL twice to Login to i:Create using your username and password. Open the Administrative Interface using the Home button on the toolbar. 2. In the resource tree select the top level of the corporation if you wish to release all the pages in your website, or a department folder if you wish to release all of the web pages in a specific department. 3. At the top of the right content pane click the Advanced Release Tab. This will open the Advanced Release dialogue. see Figure 6-5
Figure 6-5: The Advance Release Dialogue
45 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
4. At the top of the Advanced Release Dialogue you will see 2 fields: Once you have completed your Advanced Release remember to return to your regular interface by clicking the Publishing tab at the top of the right content pane. If you do not return to the Publishing tab you will have trouble locating files and carrying out most regular editing functions.
Release Content for all Languages?
If your site is multi-lingual this will release all the versions of your page corresponding to other available languages. By not checking this box you are specifying the release of only the current language.
Release Date
Specify the date and time of the page’s release using the calendar icon next to the field. If you wish the page to release immediately ignore the field and the calendar icon and click the Current Date/Time check box next to the field.
Complete these fields as required for your mass release. 5. Click the Save button. This will either release all the pages in your web site (if you selected the corporation folder), or the selected department (if you selected a department folder).
46 T H E I : C R E AT E E D I T O R - O V E R V I E W >> support@help.esolutionsgroup.ca
The i:Create Editor - Links
Contents 1 Introduction.................................................................................... 49 2
Rules for Hyperlinks....................................................................... 49
3
Creating Hyperlinks........................................................................ 50
3.1
Logging in to i:Create............................................................. 50
3.2
Creating an Internal Link......................................................... 50
3.3
Creating an External Link........................................................ 53
3.4
Using a Link to Open a Document.......................................... 54
3.5
Creating a Link with Anchors ................................................. 56
3.6
Using Thumbnails to Open Larger Images.............................. 59
3.7
Sending Email with a Hyperlink............................................... 64
4
Testing Hyperlinks.......................................................................... 66
5
Modifying Hyperlinks..................................................................... 66
5.1
Editing a Hyperlink.................................................................. 66
5.2
Deleting a Hyperlink................................................................ 67
T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
1 Introduction Hyperlinks are a vital tool for navigating through the vast amounts of information on the internet and are one of the fundamental components of modern information design and management. This document deals with creating and managing hyperlinks within the i:Create environment. It covers a wide number of hyperlink applications, all of which are intended to streamline and simplify the delivery of your content to your site’s visitors. This document chiefly covers hyperlinks within the content of the page, not those in the menus or quick links. For a detailed examination of the Menu Manager and it associated functions please refer to the Menu Manger documentation.
2
Rules for Hyperlinks
While most people browsing the web now understand how hyperlinks function, it is still important to create hyperlinks that offer simple and intuitive navigation. To facilitate this follow these simple rules when working with hyperlinks: 1. Make sure the name of your hyperlink reflects its function. If your hyperlink takes a visitor to the Event Application make sure the link says “Event Application”, or something equally descriptive. There are many links that follow a description of the link with the term “click here”, such as in “For a copy of the event application click here”. Often the “click here” is the only linked part of the sentence. Not only is this format a little old fashioned it can pose problems for some assistive technologies. Avoid creating “click here” hyperlinks. 2. Be precise. It is easy to select more than was intended when creating hyperlinks. Try to avoid grabbing the spaces before and after your selected text when initially creating a link. Many hyperlinks underline when a web site visitor passes their mouse over them. If you’ve added spaces to the hyperlink they underline as well. This can look amateurish and sloppy. Likewise avoid adding the punctuation to a hyperlink. Periods, question marks, and apostrophes can make the context of the hyperlink more difficult to understand. 3. Don’t underline site content that isn’t a link. The internet is a widely used technology and it is commonly accepted that underlined text is a link. Underlining non-linking text can seriously confuse and annoy site visitors. 4. Always test your links, most especially when they go to external sites. Links that don’t work are a leading cause of lost traffic on the web. Check your links regularly to make sure they are functioning properly and still going to the web sites you pointed them at. i:Create offers the Link Checker module as an automated tool for checking links across your entire web site. For more information on Link Checker see its section in the i:Create manual. 5. Keep site navigation simple. Use fewer links whenever possible. This keeps information linear and more easily understood.
49 T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
3
Creating Hyperlinks
3.1
Logging in to i:Create
Before you can make modification to your page’s content, including adding hyperlinks, you must login to the editor. To enter editing mode: 1. Navigate to the page in your web site you wish to modify. 2. Activate the editor by pushing CTRL twice. You may be prompted to log in. 3. If necessary, enter your Username and Password into the Login Dialogue. see Figure 3-1
Figure 3-1: The Login Dialogue 4. Click the Login button.
3.2
Creating an Internal Link
Internal links are links to pages within your web site. To create and internal link: 1. Locate and log into the page to which you will add your link. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place your cursor where you would like to insert your link, type the link text and select it or select an existing image or piece of text from the page to convert to a hyperlink. 3. Click the Inset/Edit Link button on your toolbar. This will open the Insert/Edit Link dialogue box. see Figure 3-2
50 T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
Figure 3-2: The Insert/Edit Link Dialogue 4. Click the Browse button at the end of the URL field to open the Resources dialogue. see Figure 3-3
Figure 3-3: The Resources Dialogue
51
T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
5. At the top of the Resource dialogue you will see a series of four tabs, Pages, Document Files, Image Files, and Media Files. see Figure 3-4
Figure 3-4: The Resource Tabs Click on the Pages tab. Note that in many cases the Pages tab will already be selected. However, if you have used the Resources dialogue for other editing tasks it is possible that another tab is open. When the Pages tab is opened you will initially see the message “No items to show.� 6. Click the Expand wish to link to. 7. Click the Expand
button next to the department that contains the file you button next to the Templates folder in the selected department.
8. Click the name of the template that your file is associated with. In most cases there will be only one choice, the Interior template. A list of files will appear in the right hand pane of the dialogue box. Occasionally you may see additional templates such as Homepage or Content Pull. In these cases you may have to click on several templates to locate the desired file. 9. In the right pane select the file you wish to link to. 10. Click the submit button to return to the Insert/Edit Link dialogue. The URL field should be automatically filled in for you. Note that changing the file URL will prevent the link from functioning correctly.
For more information on the Title field and accessibility contact eSolutions Group support.
Opening internal pages in another browser window can become extremely confusing for your visitor. Use this technique sparingly and with caution.
11. Complete the title field if necessary. In most cases the title field will be filled out automatically. However, you may need to make adjustments depending on the accessibility requirements of your site and the information that was entered when the file was created. The Title field represents the text that will pop up when the cursor moves over your link. 12. If you are planning on navigating to an anchor on the page you are linking to enter the name of the anchor in the Anchor field. Keep in mind that anchor names are case sensitive. For more information on using anchors see the Creating a Link with Anchors section. 13. Select either Current Window or New Window from the Open In drop-down menu. In most cases internal links will open in the current window to create a sense of continuity. There are times, however, that opening internal pages in another browser window (New Window) may be effective. 14. To finalise your link and return to your page click the Submit button.
52 T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
3.3
Creating an External Link
External links are links to other web sites. To create an external link: 1. Locate and log into the page to which you will add your link. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place your cursor where you would like to insert your link, type the link text and select it or select an existing image or piece of text from the page to convert to a hyperlink. 3. Click the Inset/Edit Link button on your toolbar. This will open the Insert/Edit Link dialogue box. see Figure 3-5
Figure 3-5: The Insert/Edit Link Dialogue 4. In the case of external links there is no way to browse for the URL. Instead you will have to find your target URL through your browser. Open another browser window or tab and navigate to your link’s destination page. For example, if you wish to create a link to Google navigate to the Google home page at http://www.google.ca/. 5. Copy the destination address from your browser’s address bar. 6. Return to the browser window that contains your i:Create editing session and paste the URL from the browser’s address bar into the URL field in the Insert/ Edit Link dialogue. For more information on the Title field and accessibility contact eSolutions Group support.
7. Complete the title field. In the case of external links the Title field will not be filled in for you. For the convenience of your visitor make sure that the external link’s title text includes the address of the destination website. This will make it clear that you are sending them elsewhere on the web. 8.
If you are planning on navigating to an anchor on the page you are linking to enter the name of the anchor in the Anchor field. Keep in mind that anchor names are case sensitive. For more information on using anchors see the Creating a Link with Anchors section.
53
T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
9.
Select either Current Window or New Window from the Open In drop-down menu. External links should be opened in a New Window. This will allow a visitor continued access to your site once they close down the new window.
10. To finalise your link and return to your page click the Submit button.
3.4
Using a Link to Open a Document
Websites often present information to the public in the form of downloadable documents. To create a link that will download a document: 1. Locate and log into the page to which you will add your link. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place your cursor where you would like to insert your link, type the link text and select it or select an existing image or piece of text from the page to convert to a hyperlink. 3. Click the Inset/Edit Link button on your toolbar. This will open the Insert/Edit Link dialogue box. see Figure 3-6
Figure 3-6: The Insert/Edit Link Dialogue 4.
Click the Browse button at the end of the URL field to open the Resources dialogue. see Figure 3-7
54 T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
Figure 3-7: The Resources Dialogue 5.
At the top of the Resource dialogue you will see a series of four tabs, Pages, Document Files, Image Files, and Media Files. see Figure 3-8
Figure 3-8: The Resource Tabs Click on the Document Files tab to display the files list for your corporation. Your file may be present, but if it does not appear here you will have to locate it within one of the departments.
55 T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
Most documents delivered through this technique are PDF’s, but almost any file format will work. Just keep in mind that your visitor will need the appropriate viewer in order to see the linked file. The PDF viewer has become widespread and popular, reducing the possibility that you visitor will miss out on information due to compatibility issues.
For more information on the Title field and accessibility contact eSolutions Group support.
It may be tempting to jump your visitors to the exact location they need on another page. While this makes sense in some cases, having somebody jump from one web page to half way down another can become very confusing. Be cautious.
6.
If your file is not in the corporate list click the Department which contains the document you wish to open. Note that you do not need to expand the department. All documents available within a department will appear as soon as you click it. If your desired document does not appear in any of you departments you may need to upload it to the server. For more information on uploading files, images and other website components see the Resource Management section of the i:Create manual.
7.
In the right pane select the document you wish to link to.
8.
Click the submit button to return to the Insert/Edit Link dialogue. The URL field should be automatically filled in for you.
9.
Complete the title field if necessary. In most cases the title field will be filled out automatically with the name of the document. However, you may need to make adjustments depending on the accessibility requirements of your site and the information that was entered when the file was created. For your visitor’s convenience always include the file extension as part of the title text.
10. Leave the Anchor field blank when linking to documents. 11. Select New Window from the Open In drop-down menu. Opening you document in the current window may make it difficult for your visitor to return to your site. Some older versions of the Acrobat PDF reader actually disable the back button in the browser. 12. To finalise your link and return to your page click the Submit button.
3.5
Creating a Link with Anchors
Most hyperlinks are designed to allow visitors to navigate between web pages and websites. Anchors allow navigation within a web page. This can be useful when your page contains extremely large amounts of information that scroll for several screens. Anchors give you the ability to include an index to facilitate rapid navigation of these multi-screen pages. Unlike other types of links, these navigation systems contain a second element, called an Anchor, which acts as a target for the link. A web page can have an unlimited number of Link / Anchor sets, as well as any number of links which all point at the same Anchor. In rare cases Anchors can also be used to jump a visitors to a location on another page. To create a link within a web page using an anchor: 1. Locate and log into the page to which you will add your link. Use the procedure outlined in the Logging in to i:Create section, above. 2. On your web page select the destination for your link. For example if you are creating a Back to Top Link, the destination would be the top of the page. If you are linking from a question in an FAQ index to its answer, your destination would be the answer.
56 T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
3. Place your cursor at the selected destination and click the Insert Anchor button on the toolbar. This will open the Insert Anchor dialogue. see Figure 3-9
Once an Anchor is created there is no easy way to find it or determine its name. Get in the habit of keeping notes on the names and locations of your anchors. If you are familiar with HTML you can enter the code using the HTML button and locate the Anchor there.
Figure 3-9: Insert Anchor Dialogue 4.
Fill out the Name field. When creating the hyperlink that is paired to the Anchor this will be the name you place in the Anchor field of the Insert/Edit Link dialogue. The name is case sensitive and should contain only letters and numbers, but is not limited in length. Keep your Anchor names as simple as possible, and related to the target of the link. For example a link that points at the answer to question 1 might have an Anchor name q1.
5.
Click the Submit button and you will be returned to your web page.
6.
Select the text or image you would like to use as a link to your Anchor. If the desired image or text is not currently on the page add it now and select it.
7.
Click the Inset/Edit Link button on your toolbar. This will open the Insert/Edit Link dialogue box. see Figure 3-10
Figure 3-10: The Insert/Edit Link Dialogue 8.
Click the Browse button at the end of the URL field to open the Resources dialogue. see Figure 3-11
57
T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
Figure 3-11: The Resources Dialogue At the top of the Resource dialogue you will see a series of four tabs, Pages, Document Files, Image Files, and Media Files. Click on the Pages tab. see Figure 3-12
Figure 3-12: The Resource Tabs The URL for an Anchor link is the same as the page you’ve placed the Anchor on (i.e. it targets its own page). 9.
Click the Expand your Anchor.
10. Click the Expand
button next to the department that contains the file with button next to the Templates folder in the selected department.
58 T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
11. Click the name of the template that your file is associated with. In most cases there will be only one choice, the Interior template. A list of files will appear in the right hand pane of the dialogue box. 12. In the right pane select the file that contains your Anchor. 13. Click the submit button to return to the Insert/Edit Link dialogue. The URL field should be automatically filled in for you, and it should match the page you are currently working on. 14. Complete the title field if necessary. In most cases the title field will be filled out automatically. However, you may need to make adjustments depending on the accessibility requirements of your site and the information that was entered when the file was created. 15. Enter the name of your target anchor in the Anchor field. Remember that anchor names are case sensitive and must be reproduced exactly. 16. Select Current Window from the Open In drop-down menu. Never open Anchor links in a new browser window, as this can become both annoying and confusing for your visitor. 17. To finalise your link and return to your page click the Submit button.
3.6
Using Thumbnails to Open Larger Images
On many websites designers use small images, called thumbnails, as previews for larger image files. Clicking on the thumbnails opens the image at its full size in a new browser window. To use this technique in i:Create you will need two images, the thumbnail and the full size image. Many browsers include a built in zoom function for images larger than their viewable area. Large images are automatically scaled down to fit within the browser’s window. This effect can substantially reduce the effectiveness of this technique. Unfortunately this is controlled by settings in your visitor’s browser and outside your control.
There is no technical requirement for the exact size of a thumbnail, but the purpose of this technique is to speed up browsing and reduce delays for image loading. Given this, making your thumbnails larger than necessary can be counterproductive. Your goal should be to have an image large enough that the content is recognizable, but without significant detail. 150 x 150 pixels is a good default starting size, than adjust up our down depending on your specific needs and the properties of your image. If you can crop all of your thumbnails to a similar size, this will also make designing page layouts much easier. The purpose of this technique is to allow you to include images on your page that would otherwise be too large (either in file size or physical dimension). Therefore, the larger version of the image does not have any size or shape limitations, as it will open in a separate browser window. Preparing images for use with this technique requires digital image editing resources. If you do not have access to the appropriate software or a person with graphic design skills call eSolutions support for assistance.
59 T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
To use a thumbnail to open a larger version of the image: 1. Locate and log into the page to which you will add your link. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place your cursor where you would like to insert your thumbnail image. 3. Click the Insert/Edit Image button. This will open the Insert/Edit Image dialogue box. see Figure 3-13
Figure 3-13: The Insert/Edit Image Dialogue 4. Click the Browse button at the end of the URL field to open the Image Resources dialogue. see Figure 3-14
60 T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
Figure 3-14: The Image Resources Dialogue 5. Select your thumbnail image from the files pane on the right of the dialogue. If your image is not visible click the Expand button next to the Corporation name at the top of the Resource Tree structure. 6. Click the Department which contains your thumbnail image, and click the image to select it. Note that you do not need to expand the department. All images available within a department will appear as soon as you click it. If your desired image does not appear in any of your departments you may need to upload it to the server. For more information on uploading files, images and other website components see the Resource Management section of the i:Create manual. 7. Click the Submit button to be returned to your Insert/Edit Image Dialogue. 8. Insert a description of the image into the Alt Text field. Alt Text may have different requirements based on the accessibility standards that have been set for you site. Check with the appropriate resource to determine what is required and if you are unsure contact eSolutions support for further information.
61 T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
9. The Title field is optional and can be left blank. You will have an opportunity to add Title text to the image when you convert it to a link. Align can also be left as Default, as it is generally easier to use the Style‌ pull-down and the Alignment buttons on the toolbar rather than to set it here. 10. Click the Submit button to insert you image and return to your page. 11. Select your thumbnail image and click the Inset/Edit Link button on your toolbar. This will open the Insert/Edit Link dialogue box. see Figure 3-15
Figure 3-15: The Insert/Edit Link Dialogue 12. Click the Browse button at the end of the URL field to open the Resources dialogue. see Figure 3-16
62 T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
Figure 3-16: The Resources Dialogue 13. At the top of the Resource dialogue you will see a series of four tabs, Pages, Document Files, Image Files, and Media Files. see Figure 3-17
Figure 3-17: The Resource Tabs Click on the Image File tab. 14. Locate the larger version of your image using the same technique you use to locate your thumbnail image (steps 5 and 6, above), and click the image to select it. 15. Click the submit button to return to the Insert/Edit Link dialogue. The URL field should be automatically filled in for you.
63 T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
For more information on the Title field and accessibility contact eSolutions Group support.
16. Complete the title field if necessary. In most cases the title field will be filled out automatically. However, you may need to make adjustments depending on the accessibility requirements of your site. This technique is also a form of file download, so make sure you include the file extension in the title text. 17. Leave the Anchor field blank. 18. Select New Window from the Open In drop-down menu. 19. To finalise your link and return to your page click the Submit button.
3.7
Sending Email with a Hyperlink
Many websites allow visitors to send email to specific contacts by clicking on a link. If you would like to use a person’s email address as the link text (a common practice), i:Create will instantly convert any typed email address directly to a hyperlink without any further action by the editor (this effect can be removed by following the Deleting a Hyperlink procedure under the Modifying Hyperlinks section). eSolutions does not recommend the use of direct email links in web page code. This method of linking can expose the associated email address to theft through automated web crawlers. This will often result in an increase in unwanted junk mail, or spam, to the associated address. To prevent this use the Secure Email link tool instead. For more information on this module see the Secure Email section in the i:Create manual. If you would like to use text other than the recipient email as the link text follow this procedure: 1. Locate and log into the page to which you will add your email link. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place your cursor where you would like to insert your email link and type the link text (for example, Send me Mail) and select it, or select an existing image or piece of text from the page to convert to an email link. 3. Click the Inset/Edit Link Link dialogue box.
button on your toolbar. This will open the Insert/Edit
4. In the URL field type mailto: followed by the email address to which the mail will be sent (do not add a space after the colon). see Figure 3-18
64 T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
Figure 3-18: The Insert/Edit Link Dialogue for Email Links 5. Complete the title field as necessary. Include the name of the mail recipient in the text. 6. Select Current Window from the Open In drop-down menu. 7. To finalise your link and return to your page click the Submit button. Clicking this link will open the visitor’s default email application and start a new message with the recipient automatically set to the address in the link. By adding more information to the URL line you can also set the subject and additional recipients for the email. Add a question mark after the email address in the URL then type the following: Additional Information
Added to URL
Example
Email Subject
subject
mailto:test@test.com?subject=enter subject here
Carbon Copy
cc
mailto:test@test.com?cc=test2@test.com
Blind Carbon Copy
bcc
mailto:test@test.com?bcc=test2@test.com
Body
body
mailto:test@test.com?body=body text
If you would like to add multiple pieces of additional information to a single email link separate each of the new elements with an ampersand (&). For example to set the subject, carbon copy address and the body of an email the link would look like this: mailto:test@test.com?subject=enter subject here&cc=test2@test.com&body=body text
65 T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
4
Testing Hyperlinks
All of the various types of hyperlinks should be tested once they are inserted into your page. Testing is as simple as clicking on the link and making sure it goes where you have pointed or performs as you expect. There is one limitation to testing links that all i:Create users should be aware of. While you have the editing bar active none of the links on your page will function. While leaving the editor can be done simply by hitting CTRL twice on your keyboard, many users, especially new ones, forget one vital step in the process. You must save your page prior to leaving the editor or all changes and modification will be dropped and the page will revert to its previous Editing Version. For more information on saving pages and Editing Version see the Editor section of the i:Create manual. To test a link: 1. Create the link using the procedures outlined in this section. 2. Save your page by clicking the Save button in the i:Create toolbar. A confirmation dialogue will appear to let you know your file has been saved successfully. 3. Exit the editor by hitting the CTRL key twice. 4. Clink the link you wish to test. 5. If the link functions as expected you can return to editing your page. If the link operates unexpectedly, you will have to make modifications to correct the problem. See the Modifying Hyperlinks section for instructions on how to edit your link.
5
Modifying Hyperlinks
There are many situations in which you will have to update, modify or delete links. This section details the procedures necessary for managing hyperlinks after they are created.
5.1
Editing a Hyperlink
To edit an existing hyperlink: 1. Locate and log into the page which contains the link you wish to modify. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place you cursor anywhere within the link to be modified (or select the linked image). Do not attempt to select a text link in its entirety, as there are often hidden code elements that may be included in the selection. If you proceed to the next step and find that your Insert/Edit Link dialogue is empty this is usually the cause.
66 T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
3. Click the Insert/Edit Link
button to open the Insert/Edit Link dialogue.
4. Make any modifications to the fields required to update, repair or re-task the link. 5. Click the Submit button to confirm your modifications and return to your page. 6. Click the Save
5.2
button to save your modifications.
Deleting a Hyperlink
It can be necessary to remove hyperlinks entirely in some circumstances. The procedure outlined here will remove a hyperlink from a segment of text or an image, but will not delete the object itself. If you wish to remove the link and the image or text to which it was applies simply select the item and hit the Delete key. To delete a hyperlink from your page: 1. Locate and log into the page which contains the link you wish to modify. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place you cursor anywhere within the link to be modified (or select the linked image). Do not attempt to select a text link in its entirety, as there are often hidden code elements that may be included in the selection. 3. Click the Remove Link specified element. 4. Click the Save
button and the link should be removed from the
button to save your modifications.
67 T H E I : C R E AT E E D I T O R - L I N K S >> support@help.esolutionsgroup.ca
The i:Create Editor - Images
Contents 1 Introduction.................................................................................... 70 2
About Size and Resolution............................................................ 70
3
Image Format, Colour Space and Compression.......................... 70
3.1
Image Format......................................................................... 70
3.2
Colour Space......................................................................... 71
3.3 Compression.......................................................................... 71 4
Adding Images to your Page......................................................... 72
4.1
Logging in to i:Create............................................................. 72
4.2
Adding an Image.................................................................... 72
5
Image Layout and Formatting....................................................... 74
5.1
Resizing Images..................................................................... 74
5.2
Aligning Images...................................................................... 75
5.3
Wrapping Text Around an Image............................................. 75
5.4
Deleting an Image................................................................... 77
5.5
Modifying Image Properties.................................................... 77
T H E I : C R E AT E E D I T O R - I M A G E S >> support@help.esolutionsgroup.ca
1 Introduction Images on the web serve a number of useful functions. Diagrams, info graphics, charts, vital elements of news stories or biographies, warning symbols, and simple decorations lend impact to your content and help to convey your message to website visitors. This document covers techniques for adding images to your content, and formatting and managing how they interact with your text elements.
2
About Size and Resolution
Size and resolution are related image characteristic which can cause some confusion for the web novice. These two factors can have a major impact on the function and appearance of the images on your web site. To help you understand some of the aspects of this chapter better we have provided a brief explanation of these two important factors. Image size represents the physical dimensions of an image, measured in pixels. Such measurements are always given with the image width first, so a picture with a physical size of 200 x 300 is 200 pixels wide by 300 pixels high. A pixel is something of an abstract measurement, one of the “dots” used by computers to draw an image. The actual size of the pixels depends on the resolution of the image. Image resolution is the number of pixels per inch in an image. An image’s resolution can have a large impact on file size and how it will look on your page. Most images on the web have a resolution of 72 pixels per inch. As a simple example an image 144 pixels across at 72 pixels per inch would be approximately 2 inches across. This can vary a bit based on your monitor size and the video settings of your computer. Images from some sources will have much higher resolutions. Some digital cameras produce picture with resolutions as high as 300 pixels per inch, and scanners can import images at resolutions of 1300 pixels per inch or more. This results in images with huge file sizes. None of these types of images is suitable for use on your web page. They must be processed down to reasonable sizes and resolutions prior to being uploaded to your web site. This process may require special software and skills. If you do not have access to these resources contact eSolutions support for assistance.
3
Image Format, Colour Space and Compression
3.1
Image Format
Digital images come in a variety of formats, and some are better suited for use on your website than others. eSolutions recommends that you use images in the .jpeg (Joint Photographic Experts Group) or .png (Portable Network Graphics) format. While there are other formats that may work these other file types have a tendency to cause unexpected problems on your page. Avoid them if you can.
70 T H E I : C R E AT E E D I T O R - I M A G E S >> support@help.esolutionsgroup.ca
If you are unsure of an image’s format you can right click the file in the Windows file list and select properties to receive a full set of details. If an image is not in one of the recommended formats most image editing software packages offer easy methods for re-saving a file in a new format. You can also contact eSolutions support for assistance.
3.2
Colour Space
Colour Space is an invisible property of image files which can make them unsuitable for use on your website. In many cases the colour characteristics of an image may be specifically tuned to its intended purpose. If an image was designed for use on the web its colour space will be RGB (Red, Green, Blue, the colours used in computer monitors), but if it was intended for print it will be CMYK (Cyan, Magenta, Yellow, and Black, the colours of the inks used in printing). CMYK images may look like any other digital image, but when used in conjunction with i:Create they often appear blank, distorted, or garbled once you see them on the live site. If you are experiencing these issues incorrect colour space is the most common reason. As with image format most image editing software can easily covert images from one colour space to the next. Unfortunately, determining the colour space of your files can be more challenging than figuring out their format. You will usually have to examine the file inside of some king of image editor to determine its colour space.
3.3 Compression Compression is another aspect of digital images that can create problems with your i:Create web page. In order to reduce the file size, and thus the load time, of certain types of images they are compressed when they are created. Compression allows the sacrifice of image quality in exchange for creating a smaller (and faster downloading) file. Many images that are in digital formats have already had some form of compression applied to them. Often these previously compressed files will be edited and resaved, and in the process recompressed. With each consecutive recompression image quality will drop. If one of your images seems to be losing picture quality each time you alter it for a new purpose, this is the culprit. Always keep an original, unedited version of your image on hand, and if you must create alternate or resized versions always work from this original. Avoid making copies of copies. Compression can also be responsible for the extremely large file size of some images. When compressing images don’t be afraid to sacrifice some image quality to speed up your visitor’s experience. The return is often worth the small loss, as reducing quality by as little as 5% can half the file size of your images.
71 T H E I : C R E AT E E D I T O R - I M A G E S >> support@help.esolutionsgroup.ca
4
Adding Images to your Page
4.1
Logging in to i:Create
Before you can make modification to your page’s content, including adding images, you must login to the editor. To enter editing mode: 1. Navigate to the page in your web site you wish to modify. 2. Activate the editor by pushing CTRL twice. You may be prompted to log in. 3. If necessary, enter your Username and Password into the Login Dialogue. see Figure 3-1
Figure 3-1: The Login Dialogue 4. Click the Login button.
4.2
Adding an Image
1. Locate and log into the page to which you will add your image. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place your cursor where you would like to insert your image. You have only a very limited ability to place images. In most cases it is easier to insert you image and then consider layout afterwards. If your cursor will not click on a given section of your page chances are you cannot insert an image there. 3. Click the Insert/Edit Image dialogue box. see Figure 3-2
button. This will open the Insert/Edit Image
72 T H E I : C R E AT E E D I T O R - I M A G E S >> support@help.esolutionsgroup.ca
Figure 3-2: The Insert/Edit Image Dialogue 4. Click the Browse button at the end of the URL field to open the Image Resources dialogue. see Figure 3-3
Figure 3-3: The Image Resources Dialogue
73
T H E I : C R E AT E E D I T O R - I M A G E S >> support@help.esolutionsgroup.ca
5. Select your image from the files pane on the right of the dialogue. If your image is not visible click the Expand button next to the Corporation name at the top of the Resource Tree structure. 6.
Click the Department which contains your image, and click the image to select it. Note that you do not need to expand the department. All images available within a department will appear as soon as you click it. If your desired image does not appear in any of your departments you may need to upload it to the server. For more information on uploading files, images and other website components see the Resource Management section of the i:Create manual.
7.
Click the Submit button to be returned to your Insert/Edit Image Dialogue.
8.
Insert a description of the image into the Alt Text field. Alt Text may have different requirements based on the accessibility standards that have been set for you site. Check with the appropriate resource to determine what is required and if you are unsure contact eSolutions support for further information.
9.
The Title field is optional and can be left blank. Align can also be left as Default, as it is generally easier to use the Style‌ pull-down and the Alignment buttons on the toolbar rather than to set it here.
10. Click the Submit button to insert you image and return to your page.
5
Avoid resizing images using this technique if you can. Small images will rapidly loose quality if enlarged and large images may cause excessive load times if shrunk. It is better to upload you images pre-sized to the proper dimensions if possible.
Image Layout and Formatting
When you insert your image you will notice that your ability to position and format your new content seems limited. HTML, the coding language used to create websites, often has a difficult time with the graphic elements of a web page. i:Create does provide several tools that can help you mitigate the limitations of HTML. This section will outline some of the options you can use for modifying and positioning your image elements.
5.1
Resizing Images
1. To resize an image you have added to an i:Create page: 2. Locate and log into the page which contains the image you wish to modify. Use the procedure outlined in the Logging in to i:Create section, above. 3. Click the image to select it. Once selected a series of box like handles will appear at the edges of the image. see Figure 4-1
74 T H E I : C R E AT E E D I T O R - I M A G E S >> support@help.esolutionsgroup.ca
Figure 4-1: Image Resizing Handles 4. Click and drag any of the handles to resize the image. Note that there is no way to maintain the aspect ration of the image when resizing using this method. Aspect ratio is the image’s proportion of height to width, and if it changes during this process you will get distortion in your image. You will have to use your best judgement and a steady hand to keep the image looking correct.
5.2
Aligning Images
Images, much like text, can be aligned relative to the content area of the page. To align an image: 1. Locate and log into the page which contains the image you wish to modify. Use the procedure outlined in the Logging in to i:Create section, above. 2. Click the image to select it. 3. In the Toolbar click the Alignment button that best represents your desired position for the image. Do not use the Justify alignment. In most cases it will have no visible effect on the image or how the browser reads it. 4. Aligning an image will automatically place it inside its own code block. If there was text on the same line as your image it will shift to either above or below the image, depending on where it was originally positioned.
5.3
Wrapping Text Around an Image
A common way of making images seem more integrated into the content of your web site is to wrap the text around them. To wrap text around an image: 1. Locate and log into the page which contains the image you wish to modify. Use the procedure outlined in the Logging in to i:Create section, above. 2. You may need to move your image so that it is associated with the text you wish to wrap. You can click and drag your image or cut and paste it, but it should share the first line of the paragraph you wish to wrap. see Figure 4-2
75 T H E I : C R E AT E E D I T O R - I M A G E S >> support@help.esolutionsgroup.ca
Figure 4-2: Initial Image Position for Text Wrapping 3. Select the image by clicking it. 4. On the toolbar open the Style‌ pull-down and select either imageleft or imageright. Imageleft will place you image on the left with the text wrapped to the right. see Figure 4-3
Figure 4-3: Imageleft Text Wrapping
76 T H E I : C R E AT E E D I T O R - I M A G E S >> support@help.esolutionsgroup.ca
Imageright will place you image on the right with the text wrapped to the left. see Figure 4-4
Figure 4-4: Imageright Text Wrapping If you need to remove the text wrap at some point select the image and chose the None option from the Style‌ pull-down.
5.4
Deleting an Image
To remove an image from your website: 1. Locate and log into the page which contains the image you wish to modify. Use the procedure outlined in the Logging in to i:Create section, above. 2. Click the image to select it. 3. Press the Delete key. Note that removing an image will also delete any hyperlinks you have applied to it.
5.5
Modifying Image Properties
You may need to return to edit the URL information, Alt text, Title data or Alignment characteristics of your image after you have added it to your page. To re-open the Inset/Edit Image Dialogue to modify these aspects of your image: 1. Locate and log into the page which contains the image you wish to modify. Use the procedure outlined in the Logging in to i:Create section, above. 2. Click the image to select it. 3. Click the Insert/Edit Image button. This will open the Insert/Edit Image dialogue for the selected image and allow you to modify its properties. 4. Once you have completed your edits, click the Submit button to confirm your changes and return to your web page.
77 T H E I : C R E AT E E D I T O R - I M A G E S >> support@help.esolutionsgroup.ca
The i:Create Editor - Tables
Contents 1 Introduction.................................................................................... 80 2
Tables and Accessibility................................................................. 80
3
Adding Tables to your Page........................................................... 80
3.1
Logging in to i:Create............................................................. 80
3.2
Adding a Table........................................................................ 81
3.3
Editing a Table Row................................................................ 83
3.4
Editing a Table Cell................................................................. 84
3.5
Setting Cell / Table Column Width........................................... 86
3.6
Deleting a Table...................................................................... 87
3.7
Editing Table Structure............................................................ 87
3.7.1 Modifying Table Properties......................................... 87
3.7.2 Adding Rows to a Table............................................. 88
3.7.3 Deleting a Row from a Table...................................... 89
3.7.4 Adding Columns to a Table........................................ 89
3.7.5 Deleting a Column from a Table................................. 89
3.7.6 Merging Table Cells.................................................... 90
3.7.7 Splitting Cells............................................................. 91
4
Adding a Table Style...................................................................... 92
4.1
Removing a Table Style........................................................... 93
T H E I : C R E AT E E D I T O R - TA B L E S >> support@help.esolutionsgroup.ca
1 Introduction Tables are incredibly versatile tools which allow you to control the layout of your website’s contents with much greater precision than would otherwise be possible. In HTML (the programing language used on the internet) tables are one of the most complex aspects of coding websites, but i:Create offers a simple set of tools for building and editing tables. In this chapter we discuss techniques and methods for using tables to better manage your data.
2
Tables and Accessibility
Assistive technologies for people with visual impairments can have a difficult time with complex tables. If accessibility is a consideration on your web site try to organise your tables so that they read from left to right. For example a listing of your hours of operation most likely reads left to right. Avoid table nesting, tables within tables. Do not merge rows, and do not use layouts that read from top to bottom, such as in the case of a classic calendar. Remember to fill out your table’s Summary field. This will give visitors using assistive technologies the option to skip over your table if it does not contain information they need. If you are unsure of the accessibility requirements for your website please consult your organizations accessibility resources or contact eSolutions Group support for further assistance.
3
Adding Tables to your Page
3.1
Logging in to i:Create
Before you can make modification to your page’s content, including adding tables, you must login to the editor. To enter editing mode: 1. Navigate to the page in your web site you wish to modify. 2. Activate the editor by pushing CTRL twice. You may be prompted to log in. 3. If necessary, enter your Username and Password into the Login Dialogue. see Figure 3-1
Figure 3-1: The Login Dialogue 4.
Click the Login button.
80
T H E I : C R E AT E E D I T O R - TA B L E S >> support@help.esolutionsgroup.ca
3.2
Adding a Table
1. Locate and log into the page to which you will add your table. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place your cursor where you would like to insert your table. The location you choose for your table is limited based on the other content you have added. Tables will occupy their own paragraph block, and cannot have text wrapped around them. However, you can place one table inside another as a simple way of creating the same visual effect. 3. Click the Insert/Edit Table button. This will open the Insert/Edit Table dialogue and allow you to specify the characteristics of the table you are inserting. see Figure 3-2
Figure 3-2: The Insert/Edit Table Dialogue
81 T H E I : C R E AT E E D I T O R - TA B L E S >> support@help.esolutionsgroup.ca
4. Complete the fields in the Insert/Edit Table dialogue to set the basic parameters for your table. These fields are:
Table widths can be set to absolute (nonpercentage) values. Any number without a percent sign following it will be treated as a pixel value. However, to meet accessibility requirements the percentage is required. The content of all page elements must scale to fit changing browser widths. Check your accessibility requirements before using absolute values.
Cols
The number of columns or vertical elements you would like in your table.
Rows
The number of rows, or horizontal elements you would like in your table.
Padding
The amount of space between the edge of the cell and your content. If your content appears cramped in the available space increasing the padding can help open the table up. Additional padding can also make a table more readable, but the default value of 2 is usually sufficient.
Spacing
Spacing represents the gap between cells. Large amounts of spacing will create cells that are very spread out, an effect that can be confusing in larger, more complex tables. The use of spacing in tables has fallen out of fashion on the web and this value is usually set to 0.
Width
The overall width of your table. This value represents the width of your table as a percentage of the total available width of the website. Therefore, a table set to 50% will be half the available width of your page.
Align
The basic alignment of the table relative to the other content (Default, Left, Center, or Right). You can also use the Align controls on the toolbar after the table is created.
Border
The border setting represents the thickness of the lines surrounding the outer edge of the table. The most common settings for Border are 1, which gives a simple, thin, table surround, or 0, which creates an invisible table excellent for laying out page elements.
Class
Class is used by automated features in i:Create to change the appearance of the table. This field is filled in automatically when your table is styled (see Styling a Table). Do not delete or alter any data in this field, as it can create unexpected results.
Summary
Summary is a text description of the table contents used by screen readers. Summary text is required to qualify your table as accessible. For further information consult your organizations accessibility resources or contact eSolutions Group support for further assistance.
82 T H E I : C R E AT E E D I T O R - TA B L E S >> support@help.esolutionsgroup.ca
5.
Once the fields have been set, click the Submit button to finalise your table and return to your web page. Your table will appear on the page matching the selected parameters. Note that if you set the Border value to 0 your table will not be visible.
6.
Click the Save button to save and update your page. If you do not save your page immediately following the creation of a table you may find there are aspects of the table that cannot be edited, and it may react to changes unpredictably.
7.
You can now click any cell in your table and start entering content. You can place text, images, and even other tables inside a table cell. However, keep in mind that tables will stretch to fit the content, so do not overfill you cells. If you cannot see the table or cells you can click the Toggle Guidelines/Invisible Elements button to show a series of dotted boundaries to assist you.
3.3
Editing a Table Row
Editing tables one cell at a time can be very tedious and labour intensive. By using the Edit Table Row tool you can make some edits to an entire row of cells, speeding the process up substantially. To edit a table row: 1. Locate and log into the page to which you will add your table. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place your cursor into any cell in the row you wish to edit and click the Edit Table Row button. This will open the Edit Table Row dialogue. see Figure 3-3
Figure 3-3: The Edit Table Row Dialogue
83 T H E I : C R E AT E E D I T O R - TA B L E S >> support@help.esolutionsgroup.ca
3. Complete the fields in the Edit Table Row dialogue to set the parameters for your row. These fields are:
Width
Width has no effect on table rows. If you wish to alter the width of a row you must change the width of the table. Leave this field empty.
Align
Align is the horizontal alignment of the cell’s content, for each cell in the row. Available options are Default, Left, Center and Right. The default alignment is Left.
Vertical Align
Vertical Align specifies how content is aligned from top to bottom in each cell in the row. Available options are Default, Top, Middle, and Bottom. The default vertical alignment is Middle.
Class
Class is used by automated features in i:Create to change the appearance of the cells in a row. This field is filled in automatically when your table is styled (see Styling a Table). Do not delete or alter any data in this field, as it can create unexpected results.
4.
Once the fields have been set, click the Submit button to finalise your edits and return to your web page. All of the cells in your selected row should now share the same attributes.
5.
Your table may not appear as expected. In most cases this is due to the browser failing to update page content based on the new information you have entered. Click the Save button to save and update your page. This forced update should correct your table row’s appearance.
3.4
Editing a Table Cell
Table cells can be edited individually to allow more control over content and layout. To edit the attributes of an individual cell: 1. Locate and log into the page to which you will add your table. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place your cursor into the cell you wish to edit and click the Edit Table Cell button. This will open the Edit Table Cell dialogue. see Figure 3-4
84 T H E I : C R E AT E E D I T O R - TA B L E S >> support@help.esolutionsgroup.ca
Figure 3-4: The Edit Table Cell Dialogue 3. Complete the fields in the Edit Table Cell dialogue to set the parameters for your cell. These fields are:
Width
The width of the individual cell (and also the column). This value should be a percentage, but it differs slightly from the Width value in the Insert/Edit Table dialogue. This value refers to the percentage of the table width, not that of the web page.
Align
Align is horizontal alignment of the cell’s content. Available options are Default, Left, Center and Right. The default alignment is Left.
Vertical Align
Vertical Align specifies how content is aligned from top to bottom in the cell. Available options are Default, Top, Middle, and Bottom. The default vertical alignment is Middle.
Class
Class is used by automated features in i:Create to change the appearance of the cell. This field is filled in automatically when your table is styled (see Styling a Table). Do not delete or alter any data in this field, as it can create unexpected results.
Scope
Scope can be used to define if a cell is part of a HTML header or header group. This function is generally unused in i:Create due to the way table styles are coded. This field can be ignored.
Heading Cell
This check box defines your selected cell as a header cell. Do not use this checkbox in conjunction with the table styles provided with your template. The results can be unpredictable and visually chaotic.
85 T H E I : C R E AT E E D I T O R - TA B L E S >> support@help.esolutionsgroup.ca
4. Once the fields have been set, click the Submit button to finalise your edits and return to your web page. Your cell should now have the attributes you entered. If your cell does not appear as expected click the Save button to save and update your page. This should correct any discrepancies your edits have created.
3.5
Setting Cell / Table Column Width
Column widths are not fixed in HTML tables. As you start adding content to your new table you will notice that columns shift. Tables automatically adjust the column width to match the amount of content entered into the column. The more data in a cell the more of the table’s width will be devoted to that column. This can be very convenient, as the table auto sizes to fit your content, but there are situations where it is useful to have a little more control over your table. In HTML tables the width of a column is controlled by the width of the largest cell in that column. To set the width of the column select any cell in the column and set it to your desired width. Note that it can be difficult to locate the cell you have edited after the fact, so it is recommended that you always set the width of the top cell in the column. To set the width of a cell / column: 1. Locate and log into the page which contains the table you wish to modify. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place your cursor in the top cell of the column you wish to edit and click the Edit Table Cell button. This will open the Edit Table Cell dialogue. see Figure 3-5
Figure 3-5: The Edit Table Cell Dialogue 3. Complete the fields in the Edit Table Cell dialogue to set the parameters for your column. For a detailed description of these fields see Editing a Table Cell, above. 4. Once the fields have been set, click the Submit button to finalise your edits and return to your web page. Your cell, and its associated column, should now be the width you entered. 5. If your table does not appear as expected click the Save update your page.
button to save and
86
T H E I : C R E AT E E D I T O R - TA B L E S >> support@help.esolutionsgroup.ca
3.6 It can be challenging to select a table. Positioning you cursor on the outer edge can take a steady hand, but there is no trick to make it easier. Be patient. It may take several attempts.
Deleting a Table
To delete a table from a web page: 1.
Locate and log into the page from which you wish to delete a table. Use the procedure outlined in the Logging in to i:Create section, above.
2. Move your cursor over the outer edge of the table you wish to delete and it will convert to the Move icon. Click to select the table and a series of box handles will appear around the table. see Figure 3-6
Figure 3-6: The Table Selection Indicators 3. Once the table is selected, press the Delete key to remove it from your page. Remember to save your changes before exiting the editor.
3.7
Editing Table Structure
In some situations it may be necessary to make large scale changes to the structure of a table, such as adding or removing rows and columns. From working with other i:Create tools you may be familiar with using the Inset/Edit tools to make modifications to items you have added to your page. However, using the Insert/Edit Table tool to modify your table provides only limited options.
3.7.1 Modifying Table Properties To modify the basic table properties of an existing table: 1. Locate and log into the page which contains the table you wish to modify. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place your cursor inside any cell in the table you wish to modify. 3. Click the Insert/Edit Table button to open the Insert/Edit Table dialogue. Note that this dialogue is substantially different from the dialogue that appeared when you first created your table. see Figure 3-7
87 T H E I : C R E AT E E D I T O R - TA B L E S >> support@help.esolutionsgroup.ca
Figure 3-7: The Insert/Edit Table Dialogue Table Editing Version 4. Complete the fields in the Insert/Edit Table dialogue to edit the parameters for your table. Note that you cannot modify the number of columns and rows, unlike when you created the table. For a detailed description of these fields see Adding a Table, above. 5. Once the fields have been set, click the Submit button to finalise your table and return to your web page. Your table will appear on the page matching the selected parameters. 6. Click the Save
button to save and update your page.
3.7.2 Adding Rows to a Table To add rows to a table after it has been created you cannot use the Insert/Edit Table button. Instead you will use the Add row tools. When using these tools cursor placement within your table is vital. To add a row to an existing table: 1. Locate and log into the page which contains the table you wish to modify. Use the procedure outlined in the Logging in to i:Create section, above. 2. Decide where in your table you would like to add a new row. You can add rows either above or below your cursor, so place your cursor within the table in any cell above or below where you would like to add the row. 3. If you have placed your cursor below where you would like a new row, click the Insert Row Before button. This places a new row above your cursor location. If you have placed your cursor above where you would like the new row, click the Insert Row After button. This inserts a row below the current cursor location.
88 T H E I : C R E AT E E D I T O R - TA B L E S >> support@help.esolutionsgroup.ca
3.7.3 Deleting a Row from a Table Removing a row from a table is extremely easy, but be aware that deleting a row will also permanently delete the contents of all the cells in that row. To delete a row: 1. Locate and log into the page which contains the table you wish to modify. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place your cursor inside any cell in the table row you wish to delete. 3. Click the Remove Table Row button, and the row containing your cursor will be deleted. Adjacent rows will move up or down to fill the gap, depending on the location of the deleted row and the configuration of the table.
3.7.4 Adding Columns to a Table To add columns to a table after it has been created you cannot use the Insert/Edit Table button. Instead you will use the Add column tools. To add a column to an existing table: 1. Locate and log into the page which contains the table you wish to modify. Use the procedure outlined in the Logging in to i:Create section, above. 2. Decide where in your table you would like to add a new column. You can add a column either to the left or right of your cursor, so place your cursor in any cell left or right of where you would like to add the column. 3. If you have placed your cursor to the right of where you would like a new column, click the Insert Column Before button. This places a new column to the left of your cursor location. If you have placed your cursor to the left of where you would like the new row, click the Insert Column After button. This inserts a row to the right of your current cursor location.
3.7.5 Deleting a Column from a Table Removing a column from a table is very simple, but deleting a column will also permanently delete the contents of all the cells in that column. To delete a column: 1.
Locate and log into the page which contains the table you wish to modify. Use the procedure outlined in the Logging in to i:Create section, above.
2.
Place your cursor in any cell in the table column you wish to delete.
3.
Click the Remove Table Column button, and the column containing your cursor will be deleted. Adjacent columns will move over to fill the gap.
89 T H E I : C R E AT E E D I T O R - TA B L E S >> support@help.esolutionsgroup.ca
3.7.6 Merging Table Cells It is possible to merge cells in HTML tables, but the coding for merges is primitive compared to similar functions in spread sheets and word processors. To prevent difficulties with editing the table later on try to avoid merging and unmerging table cells as much as possible. To merge table cells: 1. Locate and log into the page which contains the table you wish to modify. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place your cursor in the upper left corner of the group of cells you wish to merge, or if you are merging cells on a single row, within the left most cell you wish to merge. In this example we will merge the four cells in the center of the table into one large cell. see Figure 3-8
Figure 3-8: Cell Merging Example, Before Merge 3. Click the Merge Table Cells
button to open the Merge Table Cell dialogue.
see Figure 3-9
Figure 3-9: The Merge Table Cell Dialogue 4. Enter the number of Column and Rows you wish to merge in the appropriate field. The number entered in the Cols field represent the total number of cells across you wishes to merge, starting with the column your cursor is placed in and moving right. The Rows field represent the total number of cells down you wish to merge, starting with the row your cursor is placed in and moving down. In the case of our example the values are 2 and 2. 5. Click the Submit button and the cells will be merged, and you will be returned to your page. Our example will now look like this, with the four central cells merged. see Figure 3-10
90 T H E I : C R E AT E E D I T O R - TA B L E S >> support@help.esolutionsgroup.ca
Figure 3-10: Cell Merging Example, After Merge
3.7.7 Splitting Cells The tools that i:Create provides for splitting cells are limited in that they can only split cells that have been previously merged. This limitation is an outgrowth of the simplified function provided by the basic HTML code. If you wish to create more complex table configurations you may find yourself having to add additional columns and rows and merge them, rather than splitting existing cells. To split cells that you have previously merged: 1. Locate and log into the page which contains the table you wish to modify. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place your cursor inside the merged cells you wish to split. see Figure 3-11
The Split Merged Table Cells button is almost identical to the Toggle Guidelines/ Invisible Elements button right next to it on the toolbar. Make sure you know which is which before you click on them.
Figure 3-11: Cell Splitting Example 3. Click the Split Merged Table Cells button. This will divide the merged cells back into their original configuration. Note that you cannot partially Split a group of merged cells, this is an all-or-nothing tool.
91 T H E I : C R E AT E E D I T O R - TA B L E S >> support@help.esolutionsgroup.ca
4
Adding a Table Style
eSolutions Group designers provide most new websites with a customized table style, attached to the site’s CSS. This style can be applied to any table in the site to enhance consistency and appearance, and make table content more readable. To apply your custom style to a table: 1. Locate and log into the page which contains the table you wish to modify, or to which you wish to add a table. Use the procedure outlined in the Logging in to i:Create section, above. 2. If necessary use the procedures outlined above to create a new table. Always remember to save your page right after you create a new table. If you are styling an existing table this step will not be necessary. 3. Once your table has been saved, right click on it. This will bring up the browser’s right click menu. see Figure 4-1
Figure 4-1: The Browser Right Click Menu
92 T H E I : C R E AT E E D I T O R - TA B L E S >> support@help.esolutionsgroup.ca
4. Right click a second time to open the Table Style menu. see Figure 4-2
Figure 4-2: The Table Style Menu 5. The Table Style menu will usually contain three options. Select the option that best matches your needs:
Style Table
This will apply the default CSS style to your table. Table styles for most i:Create sites include a coloured header row and alternating row colours to make content more readable. Styles will vary greatly from site to site. For a detailed listing of your style colours and configuration see the Style Guide provided for you website.
Style Table (No Header)
This will apply a table style identical to the default style, but without the coloured header bar. This can be useful when using tables for layout purposes that may not include column headings.
Clear Table Styles
This will remove any style that has been previously added to the table.
6. Selecting a style will apply it to your table and close the Table Style Menu. Click the Save button to save and update your page. Saving may be necessary to complete the process and refresh the page.
4.1
Removing a Table Style
To remove a custom style from a table: 1. Locate and log into the page which contains the table you wish to modify. Use the procedure outlined in the Logging in to i:Create section, above. 2. Right click on the table whose style you would like to remove. This will bring up the browser’s right click menu. see Figure 4-3
93 T H E I : C R E AT E E D I T O R - TA B L E S >> support@help.esolutionsgroup.ca
Figure 4-3: The Browser Right Click Menu 3. Right click a second time to open the Table Style menu. see Figure 4-4
Figure 4-4: The Table Style Menu 4. Select Clear Table Styles from the Table Style Menu. 5. This will clear the style and close the Table Style Menu. Click the Save button to save and update your page. Saving may be necessary to complete the process and refresh the page.
94 T H E I : C R E AT E E D I T O R - TA B L E S >> support@help.esolutionsgroup.ca
The i:Create Editor - Headers
Contents 1 Introduction.................................................................................... 97 2 Limitations...................................................................................... 97 3
Locating the Headers..................................................................... 97
3.1
Logging in to i:Create............................................................. 97
3.2
Accessing Headers................................................................. 98
3.2.1 Applying a Header..................................................... 98
3.2.2 Changing a Header.................................................... 99
3.2.3 Removing a Header................................................... 99
T H E I : C R E AT E E D I T O R - H E A D E R S >> support@help.esolutionsgroup.ca
1 Introduction Headers are an important part of content formatting. They establish hierarchy, divide content, and assist with Search Engine Optimization. There are six Headers preloaded into your “Font Format..� menu drop-down. The Header styles, colours, and attributes of each Header have been custom coded for your website. Heading 1 should only be applied to the page title and should only appear once on each web page. Heading 1 is used by the Search Engine web crawlers to index your web page, so remember to keep it relevant to your content. Heading 2 - Heading 6 are used as subheads to break up remaining content into subsections.
2 Limitations Headers should follow each other in a logical sequence: Heading 1 - 6. You should not skip over a sequenced Header simply because you prefer the format of another. Assistive devices, such as screen readers, follow the Header order (similar to a table of contents) for navigational purposes. Disregarding the nested order of the Headers can confuse visitors using assistive technologies. See Figure 2-1
Heading 1 Heading 2 A paragraph with some body copy.
Heading 3 A paragraph with some body copy.
Heading 4 A paragraph with some body copy.
Figure 2-1: Example of Nested Heading 1 - 4 Headers should not a have hyperlink applied to them as this can cause accessibility issues. It is better to apply a hyperlink to a relevant portion of your body copy instead. You cannot edit or change the styles, colours or attributes of the Headers. If you require a change to a Header, please contact eSolutionsgroup.
3
Locating the Headers
3.1
Logging in to i:Create
Before you can apply the Headers, you must login to the editor. To enter editing mode: 1. Navigate to the page in your web site you wish to edit. 2. Activate the editor by pushing CTRL twice. You may be prompted to log in.
97 T H E I : C R E AT E E D I T O R - H E A D E R S >> support@help.esolutionsgroup.ca
3. If necessary, enter your Username and Password into the Login Dialogue. see Figure 3-1
Figure 3-1: The Login Dialogue 4. Click the Login button.
3.2
Accessing Headers
The Headers are found in the “Font Format..” drop-down menu in the top right of each page. The menu will not be active unless you are in editing mode.
3.2.1 Applying a Header To apply a Header to a line of copy: Heading 1 should only be used for your first line of web page copy. Subsequent Headers should follow logical numerical order from Heading 2 to Heading 6.
1. Double click into the line of content where you wish to apply the Heading style. 2. When the cursor is flashing (indicating you are in editing mode), navigate up to the “Font Format..” drop-down and select the appropriate Heading style from the menu. see Figure 3-2
Figure 3-2: Font Format Drop-down
98 T H E I : C R E AT E E D I T O R - H E A D E R S >> support@help.esolutionsgroup.ca
The Header that you choose will be applied to all copy that is contained within the same Paragraph. If the Header you’ve chosen appears to be applied to more than just the line you’ve designated as your Header, navigate to the end of the Header line and click Enter. To remove the unwanted Header formatting, click inside the Paragraph and select Paragraph (or the next nested Header) from the “Font Format..” drop-down.
3.2.2 Changing a Header To change a Header in a line of copy: 1. Click the line of content where you wish to apply the Heading style. 2. From the “Font Format..” drop-down, select the appropriate Heading style.
3.2.3 Removing a Header To remove a Header in a line of copy: 1. Click the line of content where you wish to remove the Heading style. 2. From the “Font Format..” drop-down, select the appropriate replacement Heading style or Paragraph style.
99 T H E I : C R E AT E E D I T O R - H E A D E R S >> support@help.esolutionsgroup.ca
The i:Create Editor - Resources
Contents 1 Introduction.................................................................................. 102 2
File Formats.................................................................................. 102
3
Locating the Resources............................................................... 102
3.1
Logging in to i:Create........................................................... 102
3.2
Locating the Resources from the Resource Tree................... 103
3.2.1 Adding a Resource (Resource Tree)......................... 104
3.2.2 Deleting a Resource (Resource Tree)........................ 105
3.2.3 Viewing Your Uploaded Resources (Resource Tree). 105
3.3
Locating the Resources from the Page Editor....................... 106
3.3.1 Adding a Resource (Page Editor)............................. 107
3.3.2 Deleting a Resource (Page Editor)............................ 108
3.3.3 Viewing Your Uploaded Resources (Page Editor)...... 109
3.3.4 Swapping Out an Image using Resources (Page Editor)............................................................ 109 3.3.5 Swapping Out a Document Link using Resources (Page Editor)............................................................ 109
T H E I : C R E AT E E D I T O R - R E S O U R C E S >> support@help.esolutionsgroup.ca
1 Introduction Resources is the area within the i:Create editor that stores and organizes all of your uploaded images and linked files for your website. There is a Resources folder at the top level of each of your website verticals, as well as a folder at the top level of your website. Resources can be uploaded, deleted, and reviewed through the Corporation Tree or through the Page Editor.
2
File Formats
When uploading your image and document files into your Resources, you must first determine that the file extension will be recognized by i:Create. Acceptable image and document file formats include: Image File Extensions
.jpg, .jpeg, .gif, .png, .bmp
Document File Extensions
.pdf, .doc, .docx
If your file extension is not listed above, please convert the image or document file to an accepted format before uploading. The maximum file size for upload is 45MB. If you require assistance with image or document file conversion, please contact eSolutionsGroup for assistance.
3
Locating the Resources
3.1
Logging in to i:Create
Before you can begin working with your site resources, you must login to the editor. To enter editing mode: 1. Navigate to any page in your web site. 2. Activate the editor by pushing CTRL twice. You may be prompted to log in. 3. If necessary, enter your Username and Password into the Login Dialogue. see Figure 3-1
Figure 3-1: The Login Dialogue 4. Click the Login button.
102
T H E I : C R E AT E E D I T O R - R E S O U R C E S >> support@help.esolutionsgroup.ca
3.2
Locating the Resources from the Resource Tree
The Resource Tree (also referred to as the Administrative Interface, also called the Back End) is the non-public side of your i:Create web site. To access the Resource Tree, login to i:Create using your username and password. If you are logging in from a front end page click the home button on the toolbar to open the Administrative Interface. see Figure 3-2
Figure 3-2: The Resource Tree Each folder or “Vertical� you see in the Resource Tree (with the exception of Modules and Users), will have its own Resources. To navigate to the Resource area for each vertical: 1. Login using the instructions provided in the Logging in to i:Create section. 2. Click on the top level of an unexpanded folder. 3. On the righthand side of the i:Create interface, you should now see Manage Resources. If not, make sure you have the Publishing tab selected in the top of the righthand menu bar. see Figure 3-3
103 T H E I : C R E AT E E D I T O R - R E S O U R C E S >> support@help.esolutionsgroup.ca
Figure 3-3: Manage Resources Through the Resource Tree
3.2.1 Adding a Resource (Resource Tree) 1. Login using the instructions provided in the Logging in to i:Create section. 2. Navigate to the folder (vertical) under which you want the image/document to be added. 3. Click on the top level of the unexpanded folder. 4. On the righthand side of the i:Create interface, you should now see Manage Resources. If not, make sure you have the Publishing tab selected in the top of the righthand menu bar. 5. Click Browse button next to one of the numbered file fields and navigate your computer to the file you wish to upload. 6. Select the file you wish to upload and click Open. You will see the file’s path appear in the box. 7. By repeating this process, you can select up to 9 other files to upload. Once you are finished selecting files click Upload. 8. You will see a success message in yellow at the top of the Manage Resources window. see Figure 3-4
Figure 3-4: Upload Success Message
104 T H E I : C R E AT E E D I T O R - R E S O U R C E S >> support@help.esolutionsgroup.ca
3.2.2 Deleting a Resource (Resource Tree) 1. Login using the instructions provided in the Logging in to i:Create section. 2. Navigate to the folder (vertical) which contains the image or document you wish to delete. 3. Click on the top level of the unexpanded folder. 4. On the righthand side of the i:Create interface, you should now see Manage Resources. If not, make sure you have the Publishing tab selected in the top of the righthand menu bar. 5. You will see two drop-down menus on the lower half of the window: Documents and Images. See Figure 3-5
Figure 3-5: Documents and Images Drop-Down 6. Open the drop-down that applies to the file type you wish to delete, and select the file from the menu. 7. Selected images will show a Preview below the Images drop-down. If you want to Preview a selected Document to ensure you have the correct file, click the Preview button next to the Documents drop-down. 8. Click the corresponding Delete button. 9. You will see a pop-up asking you “Do you really want to delete the selected file?� See Figure 3-6
Figure 3-6: Delete Confirmation Pop-up 10. Click OK to delete.
3.2.3 Viewing Your Uploaded Resources (Resource Tree) 1. Login using the instructions provided in the Logging in to i:Create section.
105
2. Navigate to the folder (vertical) under which your images or documents have been uploaded.
T H E I : C R E AT E E D I T O R - R E S O U R C E S >> support@help.esolutionsgroup.ca
3. Click on the top level of the unexpanded folder. 4. On the righthand side of the i:Create interface, you should now see Manage Resources. If not, make sure you have the Publishing tab selected in the top of the righthand menu bar. 5. You will see two drop-down menus on the lower half of the window: Documents and Images. 6. Open the drop-down that contains the documents or images you wish to review. Selected images will show a Preview below the Images drop-down. If you want to Preview a selected Document, click the Preview button next to the Documents drop-down.
3.3
Locating the Resources from the Page Editor
Resources can also be uploaded, deleted, and viewed through the Page Editor. 1. Login using the instructions provided in the Logging in to i:Create section. 2. From the web page, hit CTRL twice to drop into the Page Editor. 3. In the toolbar, click the Resources icon . You will see the Resources popup with your Resource Tree on the left, and four tabs on the right - Pages, Document Files, Images Files and Media Files. These tabs contain a list of the specified type of file stored in your selected folder. See Figure 3-7
Figure 3-7: Resources
106
T H E I : C R E AT E E D I T O R - R E S O U R C E S >> support@help.esolutionsgroup.ca
3.3.1 Adding a Resource (Page Editor) 1. Login using the instructions provided in the Logging in to i:Create section. 2. In the top menu bar, click the Resources icon
.
3. In the Resources pop-up, navigate to the folder (vertical) under which you want the image/document to be added. 4. Click on the top level of the unexpanded folder. 5. On the righthand side of the i:Create interface, choose the tab that corresponds with the type of file(s) you want to upload (Document Files, Image Files). 6. Click Upload and a File Uploader window will appear. See Figure 3-8 Figure 3-8: File Uploader Window
7. Click the Add button and navigate to the file on your computer you wish to upload. 8. You can select additional files in the same manner by clicking the Add button and navigating to the file on your computer. 9. Once you have added all of the files you wish up upload, click Upload at the bottom of the dialogue. 10. You will see a window pop-up that says “Uploaded Successfully.� See Figure 3-9
107 T H E I : C R E AT E E D I T O R - R E S O U R C E S >> support@help.esolutionsgroup.ca
Figure 3-9: File Upload Success Message 11. Click OK. 12. Click the Close button at the bottom of the File Uploader Window. 13. Your uploaded image(s) or document(s) now appear on the righthand side of the Resources window.
3.3.2 Deleting a Resource (Page Editor) 1. Login using the instructions provided in the Logging in to i:Create section. 2. In the top menu bar, click the Resources icon
.
3. In the Resources pop-up, navigate to the folder (vertical) which contains the image or document you wish to delete, and select the top level of the unexpanded folder. 4. On the righthand side of the i:Create interface, choose the tab that corresponds with the type of file(s) you want to remove (Document Files, Image Files). 5. Click on the file in the righthand window of the interface (you can hold down the Shift key to select more than one item to remove). 6. Click the Remove button at the bottom of the window. 7. A warning dialogue box will appear “Are you sure you want to delete the selected resources?�. See Figure 3-10
Figure 3-10: Deleting a Resource Confirmation 8. Click OK.
108 T H E I : C R E AT E E D I T O R - R E S O U R C E S >> support@help.esolutionsgroup.ca
3.3.3 Viewing Your Uploaded Resources (Page Editor) 1. Login using the instructions provided in the Logging in to i:Create section. 2. In the top menu bar, click the Resources icon
.
3. In the Resources pop-up, navigate to the folder (vertical) under which you want review the image(s) or document(s) and click on the top level of the unexpanded folder. 4. On the righthand side of the i:Create interface, choose the tab that corresponds with the type of file(s) you want to review (Document Files, Image Files). 5. Scroll through the image previews or the document listings to review your uploaded Resources.
3.3.4 Swapping Out an Image using Resources (Page Editor) You can also swap out an existing image wtih a newly-uploaded image file. 1. From the web page, hit CTRL twice to drop into the Page Editor. 2. Double click in the content to enter Editing mode. Click on the image you want to swap out and click the Insert/Edit image icon in the top menu bar.
The “swap” method is especially useful for adding updated images without having to reinput any of the Alt Text, or Title Field Text (providing the information is still relevant to your new image.)
3. Next to the URL field click the ... button. Note: Because you’ve chosen an existing image, the Resources window opens up to the Image Files tab by default. 4. Use the Resource Tree to navigate to the replacement image and select it. (Alternatively, you can navigate to the folder where the new image is to be uploaded and Click Add. Navigate to the image on your computer and click Open. Click Upload on the File Uploader window. Click Ok in the success dialogue to confirm. Click Close on the File Uploader window. Select your newly uploaded image from the righthand window). 5. Click Submit.
3.3.5 Swapping Out a Document Link using Resources (Page Editor) Alternatively, you can also upload a new document and swap it with an existing document from the Page Editor. 1. From the web page, hit CTRL twice to drop into the Page Editor. 2. Double click in the content to enter Editing mode. Click on the document link you want to edit and click the Insert/Edit link icon in the top menu bar. 3. Next to the URL field click the ... button. Note: Because you’ve chosen an existing link, the Resources window opens up to the Document Files tab by default.
109 T H E I : C R E AT E E D I T O R - R E S O U R C E S >> support@help.esolutionsgroup.ca
The “swap� method is especially useful for adding updated documents without having to reinput any of the Title, Anchor or Open In fields (providing the information is still relevant to your new document.)
4. Use the Resource Tree to navigate to the document you want to replace and select it. (Alternatively, you can navigate to the folder where the new document is to be uploaded and Click Add. Navigate to the document on your computer and click Open. Click Upload on the File Uploader window. Click Ok in the success dialogue to confirm. Click Close on the File Uploader window. Select your newly uploaded document from the righthand window). 5. Click Submit.
110 T H E I : C R E AT E E D I T O R - R E S O U R C E S >> support@help.esolutionsgroup.ca
The i:Create Editor Menu Manager
Contents 1 Introduction.................................................................................. 113 2
Menu Entries vs. Files.................................................................. 113
3
Locating Menu Manger................................................................ 113
3.1
Logging in to i:Create........................................................... 113
3.2
Accessing Menu Manager.................................................... 114
3.2.1 Accessing Menu Manger through the Administrative Interface............................................ 114
3.2.2 Accessing Menu Manager through the Toolbar........ 115
3.2.3 Locking the Menu.................................................... 115
3.2.3.1 Unlocking the Menu.................................. 116
4
Managing Your Menu................................................................... 117
4.1
Navigating Your Menu........................................................... 117
4.2
Adding a Link....................................................................... 118
4.2.1 Linking to Internal Pages.......................................... 124
4.2.2 Linking to External Pages......................................... 127
4.2.3 Adding Quick Links.................................................. 127
4.2.4 Linking from Multiple Menus.................................... 128
4.3
Editing Links......................................................................... 130
4.3.1 Moving Links........................................................... 130
4.3.1.1 Changing a Link’s Position......................... 130
4.3.1.2 Cutting and Pasting Links.......................... 130
4.3.2 Deleting a Link......................................................... 131
4.3.3 Rollback.................................................................. 133
4.3.4 Preview.................................................................... 133
T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
1 Introduction Menu Manger allows i:Create users a simple, fast, and efficient way of controlling the menu structure of their website. It lets you move and modify menu entries, create and delete new menus and sub-menus, add Quick Links, and ultimately provides you with control over how your visitors receive your website content.
2
Menu Entries vs. Files
The interface for menu manger looks very much like a typical Windows file tree. This can create some confusion for new i:Create users. It is important to remember that modifications to the Menu Manger do not change the content of the site’s file structure. Deleting a file’s entry in Menu Manager will not delete the associated file. In most cases there is a purely cosmetic resemblance between the entries in the menu manager and the file structure in the Resource Tree. This is a good thing, as it represents a well-organized site, with pages arranged in an intuitive and easy to find manner. However, the Resource Trees arrangement has no real connection to what you see in the Menu Manager. You can just as easily create a menu containing files from five separate departments as you could from one. Be aware that the location of the files in your site does not limit how you present you information to the visitor via menu manager.
3
Locating Menu Manger
3.1
Logging in to i:Create
Before you can make modification to your menu, you must login to the editor. To login: 1. Navigate to any page in your web site. 2. Activate the editor by pushing CTRL twice. You may be prompted to log in. 3. If necessary, enter your Username and Password into the Login Dialogue. see Figure 3-1
Figure 3-1: The Login Dialogue 4. Click the Login button.
113 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
3.2
Accessing Menu Manager
The Menu Manager can normally be found in the Administrative Interface, along with all the other modules your organization uses in association with i:Create. However, because it is such a frequently used tool, a shortcut has also been provided on the toolbar.
3.2.1 Accessing Menu Manger through the Administrative Interface To access the Menu Manager through the Administrative Interface: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Open the Administrative Interface using the Home 3. Click the expand open it.
button.
icon next to the General department in the Resource Tree to
4. Click the expand icon next to the Modules folder in the General department to see a list of modules. 5. Click on the Menu Manger module to select it and the Menu Manager interface will open in the right content pane. see Figure 3-2
Figure 3-2: The Menu Manager Interface
114 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
3.2.2 Accessing Menu Manager through the Toolbar To access Menu Manager through the toolbar: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Click the Menu Manager button on the toolbar to open a floating Menu Manager Interface window. see Figure 3-3
Figure 3-3: The Menu Manager Interface Window
3.2.3 Locking the Menu When you initially access the menu manager it will be unlocked (if it is not you will need to contact the person who has locked it before proceeding). In order to work with the menu manager you must lock it. This is intended to prevent other users from attempting to make modifications to the menu while someone is working with it. If you unlock the menu while another user is working with it any changes you make may be overwritten when they save their work. To lock the menu: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Access the Menu Manager using whatever technique you prefer. The procedures are outlined in Accessing the Menu, above. 3. Click the Lock button at the top of the menu list. see Figure 3-4
115
T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
Remember to unlock the menu when you are finished with it. Another user may have to come looking for you if you don’t.
Figure 3-4: The Lock Button 4. Upon locking the menu the information in the right content pane will become editable. You will also see the Menu Toolbar appear at the top of Menu Manager Interface. see Figure 3-5
Figure 3-5: The Menu Toolbar
3.2.3.1 Unlocking the Menu To unlock the menu: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Access the Menu Manager using whichever technique you prefer. The procedures are outlined in Accessing the Menu, above. 3. Click the Unlock button in the Menu Toolbar. see Figure 3-6
Figure 3-6: The Unlock Button 4. A confirmation dialogue box will pop up. Click OK to confirm that you wish to unlock the menu.
116 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
4
Managing Your Menu
4.1
Navigating Your Menu
Locating specific links and locations in your menu can be challenging. Remember your website’s menus are designed to be intuitive, and the links in Menu Manger follow those of your website exactly. If you are unsure where to find a link in menu manager locate it on your live site first. Each of the entries in your Menus list corresponds to a set of menus on your page. If you expand the MainNav entry in Menu Manager it contains all the top level links to you site departments. As an example this is what a typical MainNav might look like. see Figure 4-1
Figure 4-1: Typical MainNav Expanded You can see that each of these entries corresponds to a menu in the site’s main navigation interface. see Figure 4-2
Figure 4-1: The Corresponding Navigation Bar Note that occasionally long menu names may be cut off because of the limited space available in the display. If you are still unsure, consult the Style Guide that was provided with your website for more information.
117 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
4.2
Adding a Link
One of the most basic functions of working with Menu Manger is adding another link to your site navigation. To add a new link to your website menu: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Access and lock the Menu Manager using whichever technique you prefer. The procedures are outlined in Accessing the Menu Manager, above. 3. Select where in the menu structure you would like to place your new link. Click the expand icon next to the entry in the Menus list that will contain your new link. If you are creating a sub-menu entry you may have to expand the menu more than once. In our example we will place a link under the Our Collection department of the main navigation menu. To reach this location in the menu we would have to expand MainNav, and then Our Collection. see Figure 4-3
Figure 4-3: Example Menu List Expanded 4. Click on the parent menu item under which you will place your link to select it. For example if you wish to add a link to the Our Collection department the parent link would be Our Collection. If, however you wanted to add an additional sub-menu to Collection Highlights, Collection Highlights would be the parent. The parent menu item will highlight when you select it. see Figure 4-4
118 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
Figure 4-4: Parent Item Highlighted 5. Click the New Menu button in the Menu Toolbar. This will open the Link Parameters dialogue in the far right content pane. see Figure 4-5
119 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
Figure 4-5: The Link Parameters Dialogue 6. Fill out the Link Parameters dialogue to create your new link. The fields are as follows:
Link Text
This is the text your visitors will see in the menu. If you are creating a new link to an internal page leave this blank. When you select a page from the Page Selector the link text will be filled in automatically.
URL
The URL of the link’s destination page. For internal pages you can use the Browse button next to the field. If you are creating a link to an external page you will have to copy the URL from another browser window or enter it from memory. See Linking to Internal Pages and Linking to External Pages below for more details.
Title
Enter the title text for you link here. Title text is the text that pops up when a visitor moves their mouse over the link. If accessibility is a requirement for you site you may have specific restrictions and requirement for title text. Consult you organizations accessibility resources or contact eSolutions support for assistance.
120 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
Image Name
In most cases this field will remain blank. If you see an entry in this location do not edit it, as it may damage the appearance of your menu. Image Name is most often used to attach an icon or graphic to a link. In almost all cases this will have been pre-built by eSolutions’ designers.
New Window
Checking this box will cause the link you create to open in a new browser window or tab (depending on the browser you are using). Use this option if you are linking to an external site.
Inherit
Checking Inherit will cause your new link to use the metadata from its Parent Item. If you do not wish to specify Keywords or a Page Description for the individual link use this option. If you do not uncheck this box anything entered in the Keywords and Page Desc. fields will be ignored.
In Sitemap
Each site created by eSolutions has a sitemap, a web page showing the entire structure of the site with all the pages, and under what menus they can be found. Checking this box automatically adds your page to this map. Unchecking it will make your page invisible on the sitemap.
Default Link
Default link sets your link’s location as the department from which it will inherit its menu. Leave this box checked unless you are creating multiple links to the same page in other menus. See the Linking from Multiple Menus section for more details.
Visible
This checkbox determines whether or not a page is visible in the menu. This option can be useful if you are performing page maintenance and you do not want visitors using the page until your updates are complete. Rechecking this box will add the link back into the menus.
Indent Level
This item is a remnant, left over from earlier versions of i:Create, which was left in place to facilitate the use of some older style menus. You can safely ignore this field.
Our example link will direct visitors to Google and looks like this. see Figure 4-6
121 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
Figure 4-6: Example Link 7. Click the Save button at the bottom of the Link Parameters dialogue to confirm your settings and add your link to the menu. You will receive a message at the top of the dialogue that the link has been added successfully. see Figure 4-7
Figure 4-7: Menu Item Added Message 8. Your link will be added to the bottom of the menu associated with the Parent item you selected. In our example it appears at the bottom of the Our Collections department. see Figure 4-8
122 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
Figure 4-8: New Link Location The new link will be highlighted when you create it, allowing you to easily make further edits, including moving you link up and down in the menu. For detailed instruction on making various edits to your link see the Editing Links section. 9. If you check your website at this point you will notice that your link does not appear in any of the menus. Like web pages, the menu must be released before modifications will appear on your live web site. To release your menu click the Release button on the Menu Toolbar. You will see a pop-up box asking you confirm the menu release. 10. Click OK to confirm the release of you menu and i:Create will give you a confirmation message at the top of the Menu Manager interface. see Figure 4-9
Figure 4-9: Menu Release Confirmation
123 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
Unlike releasing web pages, menu releases occur almost instantaneously. If you return to your website you should now be able to see that the link has been added to your menu. If you do not see the link, try refreshing your page. see Figure 4-10
Figure 4-10: Example Menu with New Link
4.2.1 Linking to Internal Pages Creating a menu link to an internal page (a page within your website) is as simple as browsing for the file and selecting it from you website’s file list. To create a link to an internal page: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Access and lock the Menu Manager using whichever technique you prefer. The procedures are outlined in Accessing the Menu Manager, above. 3. Decide where in the menu structure you would like to place your new link. Click the expand icon next to the entry in the Menus list that will contain your new link. If you are creating a sub-menu entry you may have to expand the menu more than once. 4. Click on the parent menu item under which you will place your link to select it. 5. Click the New Menu button in the Menu Toolbar. This will open the Link Parameters dialogue in the far right content pane. 6. In the Link Parameters dialogue start by filling out the URL field. To locate the URL for an internal link click the Browse button next to the URL field. This will open the Page Selector window, which has a file tree on the left and a page list on the right. see Figure 4-11
124 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
Figure 4-11: The Page Selection Window 7. The left pane of the Page Selection window will be empty when you first open it. You will have to navigate to the department and template associated with your destination link. To do this click the expand icon next to the corporation name in the file tree (in the left pane) to expand it. Locate the site department that contains the file you wish to link to and click the expand icon next to it. 8. In most cases, within the department folder you will see two additional folders, Modules and Templates. Click the expand icon next to Templates to open a list of available templates. see Figure 4-12
Figure 4-12: Expanded File Tree Example 9. Click the template associated with the file you wish to link and a Content Page list will open in the right pane. see Figure 4-13
125 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
Figure 4-13: The Content Page List Note that the name you see in the Content Page list may not correspond to the file name of the page you are looking for. If you do not see your file the list open the file you wish to link to in the i:Create editor and use the Properties button in the toolbar. The Page Name field will show you the name your page is using in the Content Page list.
10. Locate the page you wish to link to in the Content Page list and click the Add button at the end of its line. You will be returned to the Link Parameter dialogue and the URL field will now contain the address for the file you selected. The Link Text field will also be automatically filled in with the page’s name. 11. Fill out the rest of Link Parameters dialogue to create your new link. For a detailed description of the various fields see Adding a Link, above. 12. Click the Save button at the bottom of the Link Parameters dialogue to confirm you settings and add your link to the menu. 13. Your link will be added to the bottom of the menu associated with the Parent item you selected. To add your link to your public menu you must release it. To release your menu click the Release button on the Menu Toolbar, and click OK in the confirmation window.
126 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
4.2.2 Linking to External Pages External pages pose a slightly different challenge. Because they are not internal to the site there is no way to browse and locate their URL. Instead you will have to visit the site and copy and paste the URL. To link to an external page: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Access and lock the Menu Manager using whichever technique you prefer. The procedures are outlined in Accessing the Menu Manager, above. 3. Decide where in the menu structure you would like to place your new link. Click the expand icon next to the entry in the Menus list that will contain your new link. If you are creating a sub-menu entry you may have to expand the menu more than once. 4. Click on (select) the parent menu item under which you will place your link. Browsing to your target website offers two advantages. First, copying and pasting the site URL assures that there won’t be any spelling mistakes in your link. Second, by visiting the site you can confirm that the link will actually send visitors to the destination you intend.
5. Click the New Menu button in the Menu Toolbar. This will open the Link Parameters dialogue in the far right content pane. 6. In the Link Parameters dialogue start by filling out the URL field. To locate the URL for an external link you will have to browse to the website you are planning on linking to. Open a new window or tab in your browser and navigate to your target website. Copy the website’s URL from your browser’s Address bar. 7. Return to the Link Parameters dialogue in i:Create and paste the target page’s URL into the URL field. 8. Fill out the rest of the Link Parameters dialogue to create your new link. For a detailed description of the various fields see Adding a Link, above. 9. Click the Save button at the bottom of the Link Parameters dialogue to confirm you settings and add your link to the menu. 10. Your link will be added to the bottom of the menu associated with the Parent item you selected. To add your link to your public menu you must release it. To release your menu click the Release button on the Menu Toolbar, and click OK in the confirmation window.
4.2.3 Adding Quick Links Quick links are a special variety of link that are shared across all the pages of a department. They are intended to help website visitors locate featured points of interest and other vital information. In most eSolutions designed web pages the Quick Links are located on the right side of your web page, often directly below an image. To add Quick Links: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Access and lock the Menu Manager using whichever technique you prefer. The procedures are outlined in Accessing the Menu Manager, above.
127 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
3. Quick Links are specific to individual departments. Select the department in the menu who’s Quick Links you would like to edit. Click the expand icon next to the department’s entry in Menus list. 4. Within each department you will see a QuickLinks entry. This sub-menu has been pre-programed to place its associated links into the Quick Links area of your web pages. Click the QuickLinks menu item to select it. 5. Click the New Menu button in the Menu Toolbar. This will open the Link Parameters dialogue in the far right content pane. 6. Fill out the Link Parameters dialogue to create your new link. For a detailed description of the various fields see Adding a Link, above. 7. Click the Save button at the bottom of the Link Parameters dialogue to confirm you settings and add your link to the menu. 8. Your link will be added to the bottom of the Quick Links menu associated with the Department you selected. To add your link to your public menu you must release it. To release your menu click the Release button on the Menu Toolbar, and click OK in the confirmation window that follows.
4.2.4 Linking from Multiple Menus In some cases you will want to link to a single page from multiple menus. This is a common practice, especially in the Quick Links menus. For example, you may have a Contact Us link in every Quick Links menu which all point to the same page, or you may link to a Community Events Calendar from two or three locations on your website. When you do this there are two considerations you must take into account. The first is the link’s default location. When you link to a page from multiple locations in the menu, only one location can be the default. The purpose of selecting a default location is to tell the menu structure which section of the main navigation menu provides the page’s default menu. For example, if you have two links to your Events Calendar, one in the About Us menu and one in the Things to Do menu, only one can be the default. If you were to set the link in About Us as the default, then your Events Calendar page would always show the About Us menu. If you set the link in Things to do as the default, then the calendar will show the Things to Do menu. Make sure if you create multiple links to the same page in your menu that only one of the links is set as the default. Multiple default links pointing at the same page can confuse the system, and can occasionally result in the wrong menu appearing on a given page. The second consideration is the link’s Menu Context. When we were talking about default links, above, we mentioned that the default link defines the menu that will appear for any given page. However, this can be overridden using the Stay in Same Menu Context check box. see Figure 4-14
128 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
Figure 4-14: The Stay in Same Menu Context Check Box This check box will appear below the URL field in the Link Parameters Dialogue Box only when your page is linked from multiple locations in your menu. see Figure 4-15
Figure 4-15: The Stay in Same Menu Context Check Box Dialogue If this checkbox is clicked the page associated with this link with show the main menu from its current location in the menu structure. If it is left unchecked it will show whatever menu is associated with the default link. For example, you have two links to your Events Calendar, one in the About Us menu and one in the Things to Do menu, and About Us is the default menu. The menu item under Thing to Do will have a Stay in Same Menu Context checkbox. Leaving the box unchecked will mean you visitors see About Us menu when they visit the page (the default link). Checking the box overrides the default link and attaches the menu form the Things to Do to the page.
129 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
4.3
Editing Links
This section covers the methods and techniques for editing links and menus once they have been put into place.
4.3.1 Moving Links The Menu Manager provides two sets of tools for modifying the location of links within your menus. You can change the links position within a specific part of the menu using the Up and Down buttons, or you can make major changes in link location by using the Cut and Paste tools.
4.3.1.1 Changing a Link’s Position To move a link up or down within its current menu or sub-menu: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Access and lock the Menu Manager using whichever technique you prefer. The procedures are outlined in Accessing the Menu Manager, above. 3. Navigate to the section of the Menu Manager which contains the link you would like to move. To do this you may have to expand several menus and sub-menus. If you are unsure where in Menu Manager to find your target link, compare the menu of your live site to the file structure of the menu. This should point you at the correct section of the Menu Manager. 4. Select the link you wish to move by clicking on it. The Link Text will bold to indicate it has been selected. The Up and Down buttons can only move items within their specific menu or submenu. To move items between menu you would have to use the Cut and Paste tools.
5. To move your link up in the menu structure click the Up button. To move links down click the Down button. You will often notice the interface flash after you click on of the buttons. This is the Administrative Interface refreshing after the move. If you need to move your link several times to get it to its final location wait to see that the item has moved after each click before clicking again. Clicking the Up or Down buttons too quickly can cause the editor to act erratically and even close or crash. 6. To add your modifications to the public menu you must release them. To release your menu click the Release button on the Menu Toolbar, and click OK in the confirmation window that follows.
4.3.1.2 Cutting and Pasting Links When moving links outside of their original menu or sub-menu you will need to cut and paste them. To cut and paste a link: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Access and lock the Menu Manager using whichever technique you prefer. The procedures are outlined in Accessing the Menu Manager, above.
130 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
3. Navigate to the section of the Menu Manager which contains the link you would like to move. To do this you may have to expand several menus and sub-menus. If you are unsure where in Menu Manager to find your target link, compare the menu of your live site to the file structure of the menu. This should point you at the correct section of the Menu Manager. 4. Select the link you wish to move by clicking on it. The Link Text will bold to indicate it has been selected. 5. Click the Cut button on the Menu Toolbar. Unlike the cut function in most other applications, in Menu Manager the cut object does no disappear from its original location. It will continue to appear in its old menu location until you paste it. 6. Select the parent link of the menu or sub-menu you would like to paste the link into. For example to paste the link into the About Us menu, you would select About Us. 7. Click the Paste button on the Menu Toolbar. The menu item will now disappear from its previous location and appear inside the selected menu or submenu. Note that it will appear at the bottom of its new menu, so you may wish to reposition it using the procedure for Changing a Link’s Position, outlined above. 8. To add your modifications to the public menu you must release them. To release your menu click the Release button on the Menu Toolbar, and click OK in the confirmation window that follows.
4.3.2 Deleting a Link To delete a link from your menu: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Access and lock the Menu Manager using whichever technique you prefer. The procedures are outlined in Accessing the Menu Manager, above. 3. Navigate to the section of the Menu Manager which contains the link you would like to delete. To do this you may have to expand several menus and sub-menus. If you are unsure where in Menu Manager to find your target link, compare the menu of your live site to the file structure of the menu. This should point you at the correct section of the Menu Manager. 4. Select the link you wish to delete by clicking on it. The Link Text will bold to indicate it has been selected. 5. Click the Delete button in the Link Properties dialogue on the right side of the screen. see Figure 4-16
131 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
Figure 4-16: The Link Properties Dialogue 6. A confirmation box will appear, asking if you really want to delete the link. Click OK. see Figure 4-17
Deleting a menu item has no effect on the page it links to. Even if you remove all links in your menu to a given file it can still be found in the Content Page List of its associated department.
Figure 4-17: The Delete Link Confirmation Box The link will disappear from the menu. A deleted link can be restored using the Rollback option, providing you have not released the menu since you deleted it. Once the menu is released the deletion is permanent. If you wish to restore the link you will have to recreate it. 7. To add your modifications to the public menu you must release them. To release your menu click the Release button on the Menu Toolbar, and click OK in the confirmation window that follows.
132 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
4.3.3 Rollback The Rollback tool allows you to undo an entire group of modifications. Rollback reverts the menu to the last time it was released, so if you are unsure about a number of changes you are making you can wait to release them until you have completed all of them. If you decide they are not changes you wish to keep a Rollback will remove them all. Conversely, if you are in the habit of releasing your menu after each change, then Rollback will remove only that single modification. To Rollback your menu click the Rollback button on the Menu Toolbar. There is no indicator or dialogue box when you click the Preview button. It will appear that the button does nothing until you open the Editing Version of one of your web pages.
4.3.4 Preview Preview allows you to test the appearance and functionality of your website menu without releasing it to the public. Clicking the Preview button on the Menu Toolbar will attach the current menu to the Editing Version of your site’s pages. On the live side of your website you will continue to see the original menu until you do a full release.
133 T H E I : C R E AT E E D I T O R - M E N U M A N A G E R >> support@help.esolutionsgroup.ca
The i:Create Editor Users, Roles, Permissions and Advanced Workflow
Contents 1 Introduction.................................................................................. 136 2
Users and Roles........................................................................... 136
2.1
Adding a User...................................................................... 136
2.1.1 Modifying a User Account........................................ 138
2.1.2 Deleting a User Account.......................................... 138
2.2
User Groups......................................................................... 139 2.2.1 Uses of User Groups............................................... 140
2.3 Roles.................................................................................... 140 3 Permissions.................................................................................. 142
3.1
Assigning Corporate Level Permission.................................. 142
3.2
Assigning Department Level Permission............................... 143
3.3
Assigning Module Level Permission...................................... 144
3.4
Assigning Page Level Permission.......................................... 145
3.5
Hierarchy, Conflicts and Permissions.................................... 146
4
Page Approvals............................................................................ 146
4.1
Approving Pages.................................................................. 146
4.2
Rejecting a Page.................................................................. 149
5
The Workflow Manager................................................................ 150
5.1
Creating a Basic Workflow.................................................... 150
5.2
Creating a Multi-level Workflow............................................. 152
5.3
Editing Workflows................................................................. 153
T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
1 Introduction The purpose of this document is to assist i:Create administrators in managing site users, user roles, permission settings, and workflow setup through the Workflow Module.
2
Users and Roles
2.1
Adding a User
To add a new user to an i:Create website your user role must be set to Administrator, and your permission level for the site must be Administer. If you are unsure of your current role or permission level speak to your site administrator or call eSolutions support for assistance. To add additional users to your i:Create site:
If you have multiple sites under your main folder assure that you are working in the correct location prior to adding users. Most multi-website arrangements place users in the top level of the site, in the user folder outside of the individual sites.
1.
Log into i:Create by navigating to your website and hitting CTRL twice on your keyboard.
2.
If you are asked to log in enter your user name and password.
3.
In the i:Create toolbar, click the Home icon Administrative Interface.
4.
In the folder list open the main site and locate the Users folder. see Figure 2-1
to open the
Figure 2-1: Locating the Users Folder 5. Click on the Users folder and the User Group List dialogue will open in the content pane on the right of the screen. To proceed to the User List click the All Users group. Note: The Add button located on this screen is used to create additional user groups, which are discussed more extensively later in this document. 6. Click the Add button at the top of the User List dialogue. This will open the User Profile dialogue. see Figure 2-2
136 T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
Figure 2-2: The User Profile Dialogue 7. Fill out the User Profile for the new user. Note that all the fields in this form are required. These fields are:
Username
This will be the name the user will log in with. Username cannot be edited once the user is created, so assure it is accurate before you save the user profile.
Password
The user’s password. Passwords in i:Create do not have character restrictions, nor do they expire.
Confirm Password
Retype the password to confirm there are no errors.
Password Hint
Should you forget your password i:Create will give you the option of having this hint mailed to you via the login screen.
First Name
The User’s first name.
Last Name
The User’s last name.
The User’s email address. This is the address to which i:Create will mail all automated notifications and system messages.
Preferred Language
English or French. i:Create will translate much of the user interface into the chosen language. Note that you must log out and back in again for changes in Preferred Language to take effect.
137 T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
Role
These checkboxes determine the new user’s role. See the Roles section later in this document for a full description of the Roles.
Current User Groups
If your site currently has User Groups defined, each one will appear here, accompanied by a checkbox. Check the box for each group the new user will belong to. For more information on User Groups see their section later in the document.
8. Click the Save button to complete the User. While the user is now part of the site, you must also set their Permissions to allow them to carry out site related tasks. Permissions are discussed in section 3. Without Permissions in addition to the role the user is essentially locked out of the site.
2.1.1 Modifying a User Account
Editing user accounts can only be done by the user themselves, or by users who have an administrator role and administer permission.
User Accounts can be updated to change the user’s personal details, or to add, modify or delete a role. Most commonly, the user account section is used to reset passwords. To modify an existing account: 1. Click on the Users item from the Resource Tree. 2. Click on the All Users group from the list. 3. Locate the user you want to edit from list and click on the username field to edit. 4. To reset the password, just type in a new password and enter the same new password in the confirm password field. 5. Click save.
2.1.2 Deleting a User Account To delete an existing account: 1. Click on the Users item from the Resource Tree. 2. Click on the All Users group from the list. 3. Locate the user you want to edit from list and click on the username field to edit. 4. Click the delete button at the bottom of the page.
138 T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
2.2
User Groups
Groups can be created to easily manage a number of user accounts simultaneously, assigning permissions and roles to a group rather than on an individual basis. i:Create has one default user group, All Users. This group lists all users who are associated with your i:Create corporation. It cannot be deleted. To create a user group: 1. In the folder list under the Resource Tree open the main site and click the Users folder. This will open the User Group List dialogue. see Figure 2-3
Figure 2-3: User Group List Dialogue Be aware that User Groups can create issues by allowing a User to perform task they would normally be locked out of. If you assign an Editor to a User Group with an Administrator role, that editor will have administrator level access to any location in the site you give your group access to.
2. Click the Add button to open the Add New User Group dialogue. Enter a name for your group. The description field is optional, but may help you with managing your site by providing an explanation of the group’s purpose. 3. Click the Save button and the Edit User Group Dialogue will open (see Figure 2-4). Select a Role that will apply to everyone who is part of the group and click Save. You will receive a message that your group has been saved successfully.
Figure 2-4: Edit User Group Dialogue
139 T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
4. Add users to your User Group. There are two ways of doing this. First, you open each user’s profiles under the All Users group and select the checkbox that corresponds to the group you wish to add them to, then click Save. Second, you can click the Add button at the bottom of the Edit User Group dialogue when you create the group. This will bring up a User Profile dialogue identical to the one which appears when adding a new user from the User List. Fill this out as you would any User Profile and click Add. This will add the new user to both the User List and the User Group.
2.2.1 Uses of User Groups User groups are primarily used as a means to reduce work load, allowing site administrators to assign groups of people to certain tasks rather than individuals. By not assigning a role or permission to a user when they are created you can effectively lock them out of the entire site, and then give them access only through a group. However, keep in mind using this technique does require a substantial amount of planning on the part of the site administrators, as they will need to know the future roles and permission settings for each group prior to adding in the users.
Make sure you do not assign the Denied permission to users or groups at your site’s top level. This will override all subsequent settings, locking them out of the entire site. Use the Read permission instead. This will prevent them from changing content, but will not limit your ability to assign different permissions lower in your hierarchy.
Another possibility is to add all the users to a specific group that is locked out of all aspects of the site except the one they are responsible for. This is often done by creating a group call “Not Administrators”, and then adding everyone too it except the admins. In permissions you could then assign them “read only” access at the top level of the site, giving user groups access only at the level they are responsible for. For more details on how Permission work see section 3.
2.3 Roles Roles determined the types of tasks the user is permitted to carry out. Each Role has access to a number of functions. Admin
Desktop, Publishing, Approval, Advanced Release, Manage Users, Permissions, My Account
Publisher
Desktop, Publishing, Approval, Advanced Release, My Account
Editor
Desktop, Publishing, My Account
Approver
Desktop, Approval, My Account
140 T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
The details of these functions are: Desktop
Access to the Resource Tree and back end of the i:Create system.
Publishing
The ability to edit content. Note that in this case Publishing does not relate to the ability to release a page to the public.
Approval
The user can approve pages, allowing them to be sent out to the public website.
Advanced Release
Gives the ability to perform a mass release on multiple pages.
Manage Users
The ability to modify roles, as well as add, edit and delete users.
Permissions
The user can edit permission information.
My Account
All users have access to the My Account dialog, accessed through the Utilities pane in the bottom left corner of the i:Create main interface. This allows the user to change the details of their account (excluding user name).
The exact capabilities of each role are outlined in Figure 2-4 Action
Approver
Editor
Publisher
Administrator
•
•
•
•
Edit a page
•
•
•
Release a page
•
•
•
Delete a page
•
•
•
Manage Menus
•
•
•
Manage Resources
•
•
•
•
•
•
•
Create a new page
Approve a page release
•
Advanced Release of pages Create and manage user accounts
•
Create and manage groups
•
Figure 2-4: User Role Capabilities
141 T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
3 Permissions Permissions define the actions that a user or user group can perform in i:Create. Permissions may be granted to users or a user group on four different levels: corporation, department, module, or template. Roles define the functions a user can carry out, whereas Permissions define the access the user has to various parts of the site. Together, Roles and Permissions determine the user/user group’s privileges. The levels of permission are: Denied
No access to perform any task for the selected left tree item
Administer
Read, write, create and delete access to the selected left tree item
Read
Read only access to the selected left tree item
Read + Write
Read and write access to the selected left tree item
Read + Write + Create Read, write and create access to the selected left tree item Read + Write + Delete Read, write and delete access to the selected left tree item In addition Administer access is required to perform any level of user management, so while a user can have an Administrator role, they can only add new users if they also have administer level permission.
3.1
Assigning Corporate Level Permission
To assign permission to the entire site (corporate level): 1. Once the user or user group has been created, select the top level of your site in the resource tree by clicking on the corporate name. see Figure 3-1
Figure 3-1: The Top Level of the Website 2. Select the Permissions tab along the top of the dialogue window. see Figure 3-2
Figure 3-2: The Permissions Tab
142
T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
3. This will display the permissions list. At the corporate level of the site this list should include a complete index of all site users and user groups. Click the Edit button at the end of the line associated with the user or user group who’s permission you would like to modify and the Add Permission dialogue appears. see Figure 3-3
Figure 3-3: The Add Permission Dialogue 4. Select the level of permission you would like to assign and click the save button. See the Permission breakdown at the start of this section for further details on the various permission levels.
3.2
Assigning Department Level Permission
Department level permissions allow the administrator to limit access to a single vertical of the website. The process is essentially identical to assigning corporate permissions, with only a few small differences. To assign department level permissions: 1. Once the user or user group has been created, select the appropriate department in the resource tree by clicking on the department name. 2. Select the Permissions tab along the top of the dialogue window. see Figure 3-2 3. This will display the permissions list. At the department level of the site this list will include only those users and groups which have been specifically added by an administrator. 4. If the user or group is already part of this list click the Edit button at the end of the line associated with the user or user group whose permission you would like to modify and the Add Permission dialogue appears. see Figure 3-3 5. If the user or group is not part of this list click the Add Permission button bellow the permission list. An Add Permission dialogue will pop up, and you will be able to select both a User/Group and a Permission level. see Figure 3-4
143 T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
Figure 3-4: Department Level Add Permission Dialogue A site’s modules are contained within the General department. Thus, giving a user or group access to the General folder also gives them access to the modules. Keep this in mind when setting up your General department permissions.
6. Select the level of permission you would like to assign and click the Save button.
3.3
Assigning Module Level Permission
Modules often contain sensitive or critical information, such as the contacts database, or the site’s menu structure. As such many organizations seek to limit user access to these critical components. Setting permissions for modules follows a similar pattern to the steps followed to set them for a department. To assign module permissions: 1. Once the user or user group has been created, select the module in the resource tree by navigating to the General department, and opening the Modules folder. Click the module to which you wish to assign permissions. 2. Select the Permissions tab along the top of the dialogue window. see Figure 3-2 3. This will display the permissions list. At the module level this list will include only those users and groups which have been specifically added by an administrator. 4. If the user or group is already part of this list click the Edit button at the end of the line associated with the user or user group whose permission you would like to modify and the Add Permission dialogue appears. see Figure 3-3 5. If the user or group is not part of this list click the Add Permission button bellow the permission list. An Add Permission dialogue will pop up, and you will be able to select both a User/Group and a Permission level. see Figure 3-4 6. Select the level of permission you would like to assign and click the Save button.
144 T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
3.4
Assigning Page Level Permission
Assigning specific permissions to pages is not an ideal situation as it creates a level of complexity that may be difficult to manage for site administrators. However, allowing access to pages on an individual basis is sometimes a necessary part of maintaining site security and work flow. To assign permissions to a specific page: 1. Once the user or user group has been created, navigate to the Department the target page is housed under. In the Department open the Templates folder, and select the template used for the page you are working with (in many cases the only option will be interior). A Content Page List will appear in the right content pane with a list of all pages in the department. Navigate to the page you wish to assign permissions to, open its Options pull down, and select Permission. see Figure 3-5
Figure 3-5: The Options Pull Down 2. Select the Permissions tab along the top of the dialogue window. see Figure 3-2 3. This will display the permissions list. At the page level this list will include only those users and groups which have been specifically added by an administrator. 4. If the user or group is already part of this list click the Edit button at the end of the line associated with the user or user group whose permission you would like to modify and the Add Permission dialogue appears. see Figure 3-3 5. If the user or group is not part of this list click the Add Permission button bellow the permission list. An Add Permission dialogue will pop up, and you will be able to select both a User/Group and a Permission level. see Figure 3-4 6. Select the level of permission you would like to assign and click the Save button.
145 T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
3.5
Hierarchy, Conflicts and Permissions
When applying permission to your site remember that permissions applied to broader elements can be overridden by those applied to more specific elements. Site wide permissions will be superseded by those at the Department level, and Department level Permissions will be overridden by Page and Module permissions. Example: A user is set to read only permission at the top level of the site; however they are then set to administer at the department level. The user now has full access to that department only. The exception to this rule is the Denied permission. Should you apply this at any level of the site the user will be locked out of all subsequent permission levels. Example: A user is set to Denied at the top level of the site. No matter what their permission is set to at the Department or Page level they will have no access. Should two permission levels come into conflict at different points in the site hierarchy the highest level will apply. Example: A user is set to administer at the top level of the site, but is set to read only in the Business department. Since administer is a higher level of access than read the user will have administer access even in the Business department. This can become extremely convoluted and difficult to manage as additional users and groups are added to the web site. Planning how your users will interact with the site prior to implementing permissions and workflow is vital to the success of any security plan. It can be very useful to create a tracking document early in the process that will act as a master reference for which users have access to what material.
4
Page Approvals
The approval tab is an optional part of the work flow available in i:Create. This option is used if you would like to have an Administrator, Publisher or an Approver approve a user’s page before releasing it onto the public web site.
4.1
Approving Pages
When any Editor who is not part of a managed workflow (see Workflow Manager in section 6) releases a page they will find several additional fields in the Page Release dialogue. see Figure 4-1
146 T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
Figure 4-1: Selecting an Approver The editor will be required to choose an approver from the Selected Approver pull down. Note that unless the Send Email Notification box is checked the selected approver will have no way of knowing a page approval request is waiting. If an email notification is sent i:Create will automatically send an approval request to the address associated with the approvers user profile. see Figure 4-2 Hello User Name, The following approval request was created by Editor Name on 12/02/2011 14:35 About Us - https://icreate4.esolutionsgroup.ca/test/en/businesssectors/ AboutUs.asp The page will be released on 12/02/2011 14:31. Please login to i:Create and approve this page. This message is auto generated by i:Create. Please do not respond. Figure 4-2: The Approval Request Email
147 T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
If the Editor or the page are connected to a managed workflow the Editor will not be required to select an approver during this process. The approval email will be automatically sent to the approver attached to the Editor or page’s designated workflow. To approve the page: 1. Follow the link included in the email to the page requiring approval. 2. Review the contents of the page to assure it meets all criteria for approval, and the information it contains is legible and accurate. 3. Open the page in the i:Create editor by pressing CTRL + CTRL. 4. Click the Home button on the i:Create toolbar to jump to the administrative interface. 5. In the File Tree select the top level of your corporation and then click the Approval tab at the top of the right dialogue to see a list of all pages waiting for approval. see Figure 4-3
Figure 4-3: Releases Waiting for Approval You can also click the page’s department in the file tree. This approval tab will show you only the pages in that department which are waiting for approval. 6. Click on the Approve button under the options column to approve the page for release. You will be asked to confirm your selection. Selecting okay in the confirmation dialogue will send the page out to the live site. The person who requested approval will then receive an email letting them know the page has been released. see Figure 4-4
148 T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
Hello User Name, The following page was approved by Approver Name on 04/30/2012 13:01:14. About Us - https://icreate4.esolutionsgroup.ca/test/en/businesssectors/ AboutUs.asp The page will be released on 04/30/2012 12:19:16. This message is auto generated by i:Create. Please do not respond. Figure 4-4: The Approval Request Email
4.2
Rejecting a Page
To reject a page: 1. Follow the link included in the approval email. 2. Open the page in the i:Create editor by pressing CTRL + CTRL. 3. Click the Home
button on the i:Create toolbar to jump to the back end.
4. In the File Tree select the top level of your corporation or the page’s department and then click the Approval tab at the top of the right dialogue to see a list of all pages waiting for approval. 5. At the top of the Releases Waiting for Approval dialogue you will see a form field labeled Reject reason. Enter your reason or reasons for rejecting the page in this field. You will not be able to complete the rejection process without entering a reason. This information is amended to the rejection email received by the Editor who submitted the file for approval. 6. Click on the Reject button under the options column to reject the page’s release. You will be asked to confirm your selection. Selecting okay in the confirmation dialogue will send a rejection email to the requesting user. see Figure 4-5 Hello User Name, The following page was rejected by Approver Name on 04/30/2012 13:01:14. About Us - https://icreate4.esolutionsgroup.ca/test/en/businesssectors/ AboutUs.asp The page was rejected on 04/30/2012 12:19:16. Rejection reason: Further revisions are necessary. This message is auto generated by i:Create. Please do not respond. Figure 4-5: The Approval Rejection Email
149 T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
5
The Workflow Manager
The Workflow Manger allows site administrators to lay out how pages will be handled during the release process. Adding a user or web page to a workflow eliminates the need for the Editor to select an approver. Instead the Workflow Manager automatically directs the page to the appropriate approver based on preset guidelines. In the Workflow Manager pages can be distributed to Approvers based on two possible criteria. Either a page can be assigned to an approver, meaning that regardless of the Editor working on the page it will always be sent to a particular user for approval. Or the work of particular Editors can be sent to an approver, without consideration for the page which is being released. Assigning workflow based on Editor or page should be determined by the size and organization of your site. In large sites assigning pages to a workflow can become time consuming and impractical, resulting in the need to select hundreds of pages one at a time. Assigning individual Editors directly to their supervisors for approval can simplify the process if your site’s structure allows for this. Note that once a page is added to a workflow it will always have to be approved from the Approval tab prior to release, even if the release was performed by an Administrator who normally has release permission. An Administrator can go directly to the Approval tab and approve the page for release, however Approvers and Publishers cannot. They will have to wait for the Workflow’s selected approver to release the page.
5.1
Creating a Basic Workflow
A basic workflow consists of a single step between the Editor and releasing the page to the live site. To create a basic workflow: 1. Locate your Workflow Manager in the resource tree under Templates in the General department. Select the module and the Workflow Manager will open in the right content pane. 2. In the Workflow pane click the Add a Workflow icon Workflow Form dialogue. see Figure 5-1
. This will open the
150 T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
Figure 5-1: The Workflow Form Dialogue 3. Fill out the name field and a description for your new Workflow. The description will appear as a tool tip when you mouse over the name of your workflow. Click the save button. Use a name that provides some indication of what the workflow will be used for, for example Business Development Approval Process. 4. Select the name of your new Workflow in the Workflow Pane. Click the Add a Workflow Step icon in the Workflow Step pane. This will open the Workflow Step Form. If you do not select the Notification box when creating a Workflow Step, the approver will have no indication there are pages waiting for approval.
5. Enter a name and description for your workflow step and click Save. Again, select a name that provides some explanation for the step. If you would like the approver to receive email notifications via email when a page is waiting for approval select the Notification box. 6. Select the name of your new step in the Workflow Step pane, then click the Add a Workflow Step Approver icon in the Workflow Step Approver pane. This opens the Workflow Step Approver Form. 7. From the Approver pull down select the user who will be responsible for approving pages attached to this workflow, and click the Save button. You can repeat this step if you would like to add additional approvers to the workflow. It can often be helpful to have at least one backup approver for each workflow in case the main approver is unavailable. Note that either approver can provide release permission. Approvals from both are not required. 8. Decide if this workflow will be based on individual pages or users. If the workflow will be based on a page click the Add a Workflow Assigned Page icon in the Workflow Assigned Page pane. This will open the Workflow Assigned Page Form which will allow you select a language and a page URL from the site. Once you have selected the page, click the Save button. Note that French and English pages have separate workflows and must be added individually. Once a page is added to a workflow in this manner any attempt to publish it will initiate the approval process (and an email to the designated approver if this option was selected). Any number of pages can be added to the workflow by repeating this step.
151 T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
9. If you have decided to arrange page approvals based on users click the Add a Workflow Assigned User icon in the Workflow Assigned User pane. This will open the Workflow Assigned User Form. Select a user from the drop-down and click the Save button. Note that language is not relevant as the approval process is based on the output of the user not a specific page.
Sites generally have fewer users than pages, making this is the preferred method for setting up Workflow. This also makes tracking the approval process more intuitive for Administrators, thus simplifying maintenance.
Workflow cannot be assigned based on both users and pages, as this can create conflicts that can become impossible to manage. In addition, if assigning Workflow based on pages no page can belong to more than one process. If you attempt to add a page to a second workflow the software will return an error informing you of the conflict.
5.2
Creating a Multi-level Workflow
The example outline above provides a single level of approval. In many cases your organization may need to create workflows that operate on multiple levels. For example, a department head may have approval of a specific page, but the president also wishes to have final say on content before it is exposed to the public. This would be a two level approval. The Workflow Manager can create approval processes up to five levels deep. To create a multi-level workflow: 1. Follow steps 1 through 9 under Creating a Basic Workflow. Make sure you are assigning users or pages to the initial approver. 2. Add an addition Workflow Step. Select the name of your Workflow in the Workflow Pane. Click the Add a Workflow Step icon in the Workflow Step pane. 3. Enter a name and description for your workflow step and click Save. Select the Notification box if the new approver is to receive email alerts. 4. Select the name of your new step in the Workflow Step pane, then click the Add a Workflow Step Approver icon in the Workflow Step Approver pane. 5. From the Approver pull down select the user who will be responsible for approving pages and click the Save button. The approver selected for this new step will receive a notification (if that option was selected in step 3) once the approver from the previous step has accepted the page. This process will continue up the line for each additional step added in the workflow. The last approver in the chain sends the file out to the live site. As with the first step, additional users can be assigned to each step to act as backups should the primary approver be unavailable.
152 T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
5.3
Editing Workflows
Each pane in the Workflow Manager has a toolbar which allows users to edit the components of the workflow relevant to that specific pane. For the most part these toolbars are identical, with the exception of the edit icon and the preview tool. These tools are: Add
The add tool adds an item to a specific pane.
Edit
The edit tool allows changes to be made to the selected item. You can use this tool to change the name or description of workflow elements.
Remove
The Remove tool will delete the selected item. You will be asked to confirm your choice prior to deletion.
Preview
The Preview tool appears only in the page pane, and will open a preview of the selected page.
Refresh
The Refresh tool will update any changes to the workflow that may not have appeared on the screen. Browsers are notorious for not properly refreshing during complex operations, so if something in your workflow appears incorrect refresh prior to attempting to correct the issue.
153 T H E I : C R E AT E E D I T O R - U S E R S , R O L E S , P E R M I S S I O N S A N D A D V A N C E D W O R K F L O W >> support@help.esolutionsgroup.ca
The i:Create Editor Link Checker
Contents 1 Introduction.................................................................................. 156 2 Limitations.................................................................................... 156 3
Locating the Link Checker........................................................... 156
3.1
Logging in to i:Create........................................................... 156
3.2
Accessing the Link Checker................................................. 157
3.2.1 Accessing the Link Checker through the Administrative Interface............................................ 157
3.2.2 Accessing the Link Checker from the Toolbar.......... 158
4
Creating and Analysing Reports.................................................. 158
4.1
Creating a New Job.............................................................. 158
4.2
Pausing and Restarting a Job............................................... 160
4.3
Viewing a Finished Job......................................................... 160
4.3.1 Filtering the Results.................................................. 161
4.4
Correcting Broken Links....................................................... 162
4.5
Deleting a Job...................................................................... 163
5
Understanding Status Codes...................................................... 163
T H E I : C R E AT E E D I T O R - L I N K C H E C K E R >> support@help.esolutionsgroup.ca
1 Introduction The Link Checker module radically reduces the amount of time and effort required to maintain and manage the links on your web site. It automatically creates a report for a given page or website, detailing any failures in that page’s (or site’s) links. In addition reports can be filtered to specify the type of error, its destination URL, and its originating web page. From within the report links to error generating pages allow you to rapidly navigate to and correct any problems the module detects.
2 Limitations The Link Checker module shares its resources across the entire i:Create server. It is not unusual for a Link Checking job to be delayed while the module waits for additional resources to become available, or for current jobs to complete. All jobs are placed into a queue and your check will be carried out as soon as possible. Larger websites can take as long as an hour to fully check, so don’t worry if it seems like the process is taking a while. For best results, and to avoid excessive waiting, you might want to run your job over night, or while you are working on other projects.
3
Locating the Link Checker
3.1
Logging in to i:Create
Before you can run the Link Checker, you must login to the editor. To enter editing mode: 1. Navigate to any page in your web site. 2. Activate the editor by pushing CTRL twice. You may be prompted to log in. 3. If necessary, enter your Username and Password into the Login Dialogue. see Figure 3-1
Figure 3-1: The Login Dialogue 4. Click the Login button.
156 T H E I : C R E AT E E D I T O R - L I N K C H E C K E R >> support@help.esolutionsgroup.ca
3.2
Accessing the Link Checker
The Link Checker can normally be found in the Administrative Interface, along with all the other module your organization uses in association with i:Create. However, because it is a frequently used tool, a shortcut has been provided on the toolbar as well.
3.2.1 Accessing the Link Checker through the Administrative Interface To access the Link Checker through the Administrative Interface: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Open the Administrative Interface using the Home 3. Click the expand to open it.
button.
icon next to the General department in the Resource Tree
4. Click the expand icon next to the Modules folder in the General department to see a list of modules. 5. Click on the Link Checker module to select it and the Link Checker interface will open in the right content pane. see Figure 3-2
Figure 3-2: The Link Checker Interface
157 T H E I : C R E AT E E D I T O R - L I N K C H E C K E R >> support@help.esolutionsgroup.ca
3.2.2 Accessing the Link Checker from the Toolbar To access Link Checker through the toolbar: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Click the Website Quality Checker button on the toolbar to open a floating Link Checker Interface window. see Figure 3-3
Figure 3-3: The Link Checker Interface Window 3. The New Crawl Job dialogue will open automatically. For more information on how to fill out this dialogue box see Creating a New Job, below.
4
Creating and Analysing Reports
4.1
Creating a New Job
Each time you run the Link Checker, it is considered a new job. Each job you create has a target, either a single web page or an entire website, which will determine the scope of its report. To create a new job: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Access the Link Checker using whichever technique you prefer. The procedures are outlined in Accessing the Link Checker, above. 3. In the Link checker interface locate the Crawling Jobs pane at the top of the screen. see Figure 4-1
158 T H E I : C R E AT E E D I T O R - L I N K C H E C K E R >> support@help.esolutionsgroup.ca
Figure 4-1: The Crawling Jobs Pane 4. Click the New Checking Job button in the upper right of the Crawling Jobs pane and the New Crawl Job dialogue will open. see Figure 4-2
Figure 4-2: The New Crawl Job Dialogue
To find the URL for the page or website you wish to check, navigate to your target destination in another browser window and copy the browser’s address bar into the URL field.
5. In the Check Type drop-down select the scope for your new job. Single web page will check all the links on one page. Whole Website will check all the links on each page of the site. 6. Enter the starting address in the Starting URL field. If you selected Single Web Page in Check Type, enter the URL of the page you would like to check. If you selected Whole Website paste in the homepage address of your target site. 7. Enter a description of the job in the Description field. This field is optional but filling it in will allow you to keep better track of your jobs, especially if you are running several at a time.
159 T H E I : C R E AT E E D I T O R - L I N K C H E C K E R >> support@help.esolutionsgroup.ca
8. Click the Add New Job button and your new check will be added to the Crawling Jobs pane. After this point there is nothing you need to do to start the job. It will begin as soon as resources are available to run the job, and it will continue running until it is completed. 9. If the job is waiting you will see Preparing in the Status column of the Crawling Jobs pane. Once the job begins the status will appear as Running, and when it has completed you will see Finished. In many cases results will appear in the Reports pane before the job is done, and you can start working to repair malfunctioning links as soon as soon as entries begin appearing in the list.
4.2
Pausing and Restarting a Job
It may be necessary to pause and restart Link Checker jobs occasionally. For instance you may discover that another job has a higher priority, so you would have to pause the current job to allow another to run. To pause and / or restart a Link Checker job: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Access the Link Checker using whichever technique you prefer. The procedures are outlined in Accessing the Link Checker, above. 3. In the Crawling Jobs pane at the top of the Link Checker interface click on the status of the job you wish to pause or restart to select it. 4. To pause a job click the Pause button in the upper right corner of the Crawling Jobs pane. Its status should change from Preparing or Running to Paused or Pausing, and may include the additional note “Waiting for threads to finish”. It can take several minutes to pause a large job. To resume a job you have previously paused click the Resume button. The status will switch back to Running and the job will proceed normally.
4.3
Viewing a Finished Job
To view the results for a finished job:
Don’t panic when you see every link on your website show up in a Link Checker report. The Filter is initially set to All Links, and shows everything, whether there is an error or not. Set the filter to Broken Links to see the potential problems.
1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Access the Link Checker using whichever technique you prefer. The procedures are outlined in Accessing the Link Checker, above. 3. In the Crawling Jobs pane at the top of the Link Checker interface click on the Finished status of the job you wish to select. This will load the job results into the Reports frame. Initially this list will contain all the links on the page or website.
160 T H E I : C R E AT E E D I T O R - L I N K C H E C K E R >> support@help.esolutionsgroup.ca
4.3.1 Filtering the Results The initial report shows all the results, not just the broken links and page errors. To filter your results to see only broken links: 1. Open your job as described in Viewing a Finished Job, above. 2. In the Reports pane at the left of the Link Checker Interface you will see a list of filters. see Figure 4-3
Figure 4-3: The Filters List Click the Broken Links entry in the Filters list and your results on the left will narrow to show you only those links that are not operating correctly.
161 T H E I : C R E AT E E D I T O R - L I N K C H E C K E R >> support@help.esolutionsgroup.ca
4.4
Correcting Broken Links
The ultimate goal of the Link Checker report is to assist you in correcting any broken links it may find on your website. To correct a broken link found by the Link Checker: 1. Open your job as described in Viewing a Finished Job, above. 2. In the Reports pane at the left of the Link Checker Interface click the Broken Links entry in the Filters list and your results on the left will narrow to show you only those links that are not operating correctly. 3. Each link in the table to the right of the Filters column will have 4 pieces of information:
Status Code
This tells you the type of error Link Checker encountered when attempting to follow the link. For a full list of Status Codes see Understanding Status Codes, below.
URL
This is the URL which generated the error. To repair the issue you will have to locate this link on your page and correct it. The link text is not provided by the report so locating the correct URL can take quite a bit of searching.
From URL
The From URL is the page the error is located on. Clicking this link will open the page containing the error, a convenient way to find and correct it.
i:Create Page
This check box will inform you if the error occurred on an i:Create page. If this box is not checked the error may have occurred with a site resource (an image could be missing, for instance) or a missing external page. i:Create page errors are generally much easier to fix.
4. Click the link under the From URL column and your browser will open the page containing the error in a new browser window. 5. Activate the editor by pushing CTRL twice. You may be prompted to log in. You may not have access to the files necessary to correct some errors. Files with .js or .css extensions cannot be edited using the i:Create tools. For help with these broken links contact eSolutions support.
6. Locate the link that created the error and correct the problem. It may help to examine the URL column of the Link Checker report, as this will tell you the destination of the malfunctioning link. Most browsers will provide this information in the status bar near the bottom of the screen when you mouse over the link, so opening each link in the Insert/Edit Link dialogue should not be necessary. For detailed information on editing links see the Links chapter of the i:Create manual. 7. Repeat this process until all errors have been corrected. 8. Re-run the Crawling Job if necessary to confirm that the errors have been corrected.
162
T H E I : C R E AT E E D I T O R - L I N K C H E C K E R >> support@help.esolutionsgroup.ca
4.5
Deleting a Job
Once the errors in any given crawling job are corrected you may wish to remove that job to prevent clutter or future confusion with newer jobs. To remove a job: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Access the Link Checker using whichever technique you prefer. The procedures are outlined in Accessing the Link Checker, above. 3. In the Crawling Jobs pane at the top of the Link Checker interface click on the status of the job you wish to remove. This will load the job results into the Reports frame and allow you to confirm this is the job you wish to delete. 4. Click the Remove Job
button in the upper right of the Crawling Jobs pane.
5. A Confirmation box will open asking if you are sure you want to delete the selected job. Click OK to permanently delete the job.
5
Understanding Status Codes
The Status Codes used by link checker may require some explanation. Following is a complete list of Status Codes, broken down by the level of correction necessary to repair the issue. Successful Codes – no changes required 200 OK
The linked URL was found and returned a successful result.
302 Found
The linked URL was successfully redirected to a specific location on the host’s server. For example www.sitename.com was redirected to www.sitename.com/en/main/welcome.html. A website will often do this to temporarily forward visitors to a specific part of their site. You do not need to change your linked URL for this type of redirection.
Successful Codes – but with recommended changes
301 Moved Permanently
The linked URL was successfully redirected to another URL by the host’s server. For example www.sitename.com was redirected to www.new-sitename.com. A website may do this if they own multiple domain names that go to the same site or, if they have recently started using a new domain name and are currently redirecting older links. Although this is not technically a “broken link”, consider changing your linked URL to reflect the new / more correct website as directed by the server.
163 T H E I : C R E AT E E D I T O R - L I N K C H E C K E R >> support@help.esolutionsgroup.ca
Failure Codes – changes required
401 Unauthorized Access
The linked URL is valid but requires authorization credentials to view. This can happen if you are logged into the destination website while working in i:Create. When you logout, or someone else tries to use this link, access to the destination site will be denied. To correct this, you may need to provide credentials inside your linked URL (the site you are linking to should provide these details) or consider changing your linked URL to a login page for that site.
403 Forbidden
The linked URL was found but, the host’s server is refusing your connection. This can happen if you try to link to a website’s directory instead of a specific page. For example www.sitename.com/en/main/ is a directory that cannot be browsed. Correct this by pointing to a specific page within that directory.
404 Page Not Found
The linked URL does not currently exist. This can happen if the web page has been deleted, moved or renamed on the host’s site or if there is a typing or syntax error in the linked URL. To correct this, find the correct URL for your destination website (assuming it still exists) then compare it to what was used as your linked URL. Look for common errors, such as spelling mistakes in the linked URL, incorrect file extensions (such as .htm instead of .html), or different server protocols (HTTP:// versus HTTPS:// or FTP://).
500 Internal Server Error
The server failed to fulfill an apparently valid request. This error indicates that the linked URL’s server encountered something it didn’t expect and was unable to complete the request to access that part of the site. You may not be able to correct this as the error is likely an issue with the host’s server or the web page itself. Check to ensure you are linking to the correct page (similar to a 404) or contact the website administrator for the linked URL to report or investigate the error.
Information & Miscellaneous Codes 1 DNS Check
This is not an error. A Code 1 result will always appear in i:Create’s Link Checker results as validation of the DNS for the website you are running the Job for. No action is required.
503 Service Unavailable
The host’s server is currently unavailable (possibly because it is overloaded or down for maintenance). Generally, this is a temporary state. Try running the job again later.
164 T H E I : C R E AT E E D I T O R - L I N K C H E C K E R >> support@help.esolutionsgroup.ca
The i:Create Editor Search and Reports
Contents 1 Introduction.................................................................................. 167 2 Search........................................................................................... 167
2.1
Logging in to i:Create........................................................... 167
2.2
Locating the Search Tools.................................................... 167
2.3
Performing a Search............................................................. 168
2.4
Performing an Advanced Search.......................................... 170
2.5
Exporting Search Results...................................................... 171
3 Reports......................................................................................... 172
3.1
Locating the Reports Tool..................................................... 172
3.2
Creating Reports.................................................................. 173
3.2.1 The Stale Content Report........................................ 173
3.2.2 The Pages by User Report....................................... 174
3.2.3 The Not Released Report........................................ 176
3.2.4 The Statistics Report............................................... 177
3.2.5 The Meta Data Report............................................. 179
3.2.6 The Resource and Media Report............................. 180
T H E I : C R E AT E E D I T O R - S E A R C H A N D R E P O R T S >> support@help.esolutionsgroup.ca
1 Introduction The amount of information contained in websites can be gigantic, and locating a particular resource or piece of data in all that material can be a daunting exercise. The Search and Reports functions are designed to facilitate and simplify the process of managing these huge volumes of information.
2 Search 2.1
Logging in to i:Create
Before you can use the search tools, you must login to the editor. To enter editing mode: 1. Navigate to any page in your website that will allow you to open the editor (avoid pages generated by modules such as the news manager or calendar). 2. Activate the editor by pushing CTRL twice. You may be prompted to log in. 3. If necessary, enter your Username and Password into the Login dialogue. see Figure 2-1
Figure 2-1: The Login Dialogue 4. Click the Login button.
2.2
Locating the Search Tools
The Search tools are accessible only through the Administrative Interface. To locate the Search tools: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Open the Administrative Interface using the Home
button on the Toolbar.
3. Select the website department you wish to search from the Resource Tree pane. If you wish to search the contents of the entire site select the name of your corporation at the top of the Resource Tree. 4. Click the Search tab at the top of the right content pane. This will open the Search dialogue. see Figure 2-2
167 T H E I : C R E AT E E D I T O R - S E A R C H A N D R E P O R T S >> support@help.esolutionsgroup.ca
Figure 2-2: The Search Tab and Dialogue
2.3
Performing a Search
The function of the search tool is to assist you in locating a file or set of files that meet specific criteria. To set up and perform a search: None of the search fields are actually required, so assure you are setting some parameters or you will receive a report showing the entire contents of the site.
1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Locate the Search Tools using the instructions provided in the Locating the Search Tools section, above. 3. Complete the fields in the Search dialogue to specify the type of search you would like to carry out. The fields are:
Keyword
Enter a keyword from the content of the page or pages you are looking for. Note that this applies to content only. Keywords that appear in the file or short name will not be detected by this search.
Department
This drop-down contains a list of all the departments within your website. You can use it to further narrow your search to the selected department. Note that if you selected a specific department from the Resource Tree, this box will already contain the selected department and any searches will apply to that section of the website only.
Template
This drop-down allows you to specify which department template you will search. Pages created from other templates will be ignored.
168 T H E I : C R E AT E E D I T O R - S E A R C H A N D R E P O R T S >> support@help.esolutionsgroup.ca
Status
You can narrow your search to a specific file status by selecting one of the Status radio buttons. For a further explanation of the various status types see the Editor section of the i:Create manual. The File Type check boxes allow you to specify one or more file types for your search: Page – Limits your search to web pages only.
Make sure that you click the Search button, rather than hitting Enter. Enter activates the default button for the dialogue box, which in this case is Clear, resulting in you having to reselect all your search criteria.
File Type
Media – Includes media files, such as pictures and video in your search. Documents – Adds document files, such as .doc and .pdf to your search.
Username
Allows you to narrow the field of your search to material modified or released by a specific site user. If a person’s user name does not identify them easily you may need to take a look at the site’s user list in order to determine who the user is.
4. Click the Search button and the search results will appear at the bottom of the content pane. see Figure 2-3
Figure 2-3: Search Results
169 T H E I : C R E AT E E D I T O R - S E A R C H A N D R E P O R T S >> support@help.esolutionsgroup.ca
Depending on your search criteria and the type of files you were looking for your search results may vary slightly in appearance. The file name will always be a link, however, allowing you to bring up any of the files or web pages your search locates. If your search results in multiple pages there will be a page navigation tool below the search results allowing you to flip through the full report. see Figure 2-4
Figure 2-4: The Page Navigation Tool Also at the bottom of the results report you will find a summary of the total items found as well as the export functions. For more information on exporting your results see the Exporting Search Results section later in this chapter.
2.4
Performing an Advanced Search
The Advanced Search feature allows you to further refine your search based on specific date information. To perform an advanced search: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Locate the Search Tools using the instructions provided in the Locating the Search Tools section, above. 3. Complete the fields in the Search dialogue as required. See the Performing a Search section, above, for details about these fields. 4. Click the Expand Advanced Search link to add dates to your search criteria. see Figure 2-5
Figure 2-5: The Expand Advanced Search Link Each of the date fields allows you to specify a range of possible dates you would like to search. see Figure 2-6
Figure 2-6: The Advanced Search Fields
170 T H E I : C R E AT E E D I T O R - S E A R C H A N D R E P O R T S >> support@help.esolutionsgroup.ca
Click the Calendar button next to each field to enter a date and time parameter for the search. The possible date ranges you can search for are:
Created Date
For web pages this represents the date the file was created. For media and documents this would be the date the file was uploaded to the web site. This range will be of limited use for many pages on your site. They will have the same created dates as a result of the automated processes used to create initial files from the site’s templates.
Last Modified Date
This represents the last time the file was changed or edited. This can be an excellent tool for locating stale content that may require updating.
Released Date
Allows the user to search based on when the page was released to the public. Note that media and document files do not have release dates, so they will provide no information when performing a release date search.
5.
Click the Search button and the search results will appear at the bottom of the content pane. If your search generated several pages of results you can use the page tool in the bottom right of the screen to navigate through the pages. There are also export tools if you would like to use your search results in other applications. For more information on exporting your results see the Exporting Search Results section later in this chapter.
2.5
Exporting Search Results
The outcome of your search can be exported in a variety of file formats for use with other applications. To export a set of search results: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Locate the Search Tools using the instructions provided in the Locating the Search Tools section, above. 3. Complete the fields in the Search dialogue as required. See the Performing a Search section, above, for details on the fields. 4. Click the Search of the content pane.
button and the search results will appear at the bottom
5. Below the search results select the file type you would like to use from the available Export Options. see Figure 2-7
Figure 2-7: Export Options
171 T H E I : C R E AT E E D I T O R - S E A R C H A N D R E P O R T S >> support@help.esolutionsgroup.ca
CSV
An extremely common and nearly universal format, it is also compatible with Excel and most other major spread sheets. When selecting this option you will be asked where you would like to save the file.
Excel
The search option does not create an actual Excel file, but generates a tab delimited table instead. This is also a fairly widespread format, and like the CSV option you will be asked to select a save location. This file format is also useful if you wish to place your search results in a printed report, as many document layout software packages use this file format for importing tables.
XML
This export option generates the results as a XML file. This file cannot be saved directly from the output window and the search data must be cut and pasted into an appropriate document.
This option creates a PDF of the search results. To save the PDF move your mouse over the lower center of the document. A PDF toolbar will appear with the option to Save a Copy of the file. see Figure 2-8
Figure 2-8: The PDF Toolbar
3 Reports 3.1
Locating the Reports Tool
The Reports tools are accessible through the i:Create Administrative Interface. To locate the Reports tools: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Open the Administrative Interface using the Home
button on the Toolbar.
3. Click the Reports tab at the top of the right content pane. This will open the Reports Main Menu. see Figure 3-1
172 T H E I : C R E AT E E D I T O R - S E A R C H A N D R E P O R T S >> support@help.esolutionsgroup.ca
Figure 3-1: The Reports Tab and Main Menu
3.2
Creating Reports
The Reports tab contains a listing of six possible report types; Stale Content, Pages by User, Not Released, Statistics, Meta Data, and Resources and Media. For a complete breakdown of each report type see their descriptions, below.
3.2.1 The Stale Content Report Stale Content reports are intended to help locate site resources that have not been updated for a selected period of time. This can assist you in pinpointing where updates might best be applied. To create a Stale Content report: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create at the beginning of the Search section, above. 2. Locate the Reports Tools using the instructions provided in the Locating the Reports Tool section, above. 3. Select the Stale Content option under the Reports Main Menu. This will open the Stale Content Report dialogue. see Figure 3-2
Figure 3-2: The Stale Content Report Dialogue
173 T H E I : C R E AT E E D I T O R - S E A R C H A N D R E P O R T S >> support@help.esolutionsgroup.ca
4. Select a target age from the Content Age pull-down menu. The report can check for stale content from 30 to 150 days (or older). These time frames are in reference to how long it has been since the content has been modified. For example, selecting Over 30 Days from the pull-down creates a report containing all files that have not been modified for 30 days or more. 5. Click the Generate
button to create the report.
6. Your results will appear in a new pane directly below the Stale Content Report interface. see Figure 3-3
Figure 3-3: The Stale Content Report If your search generated several pages of results you can use the page tool in the bottom right of the screen to navigate through the pages. There are also export tools if you would like to use your search results in other applications. For more information on exporting your results see Exporting Search Results under the Search section of this document.
3.2.2 The Pages by User Report The Pages by User report allows you to locate and track web pages created, modified, or released by a specific user. To create a Pages by User report: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create at the beginning of the Search section, above. 2. Locate the Reports Tools using the instructions provided in the Locating the Reports Tool section, above. 3. Select the Pages by User option under the Reports Main Menu. This will open the Content by User Report dialogue. see Figure 3-4
174 T H E I : C R E AT E E D I T O R - S E A R C H A N D R E P O R T S >> support@help.esolutionsgroup.ca
Figure 3-4: The Content by User Report Dialogue 4. Select a user from the User pull-down menu. This menu automatically draws the user’s first and last name from the user list, so individuals should be easy to locate. 5. Select an Action Type: Created
Show all pages created by the specified user. The report will also provide the date the file was created.
Modified
Show all pages modified by the specified user and when they were edited. Note that this report will only generate results for pages that were last modified by the selected user, so if another user has modified the file since it will not be included in the results.
Released
Shows all files that were last released by the specified user. As with Modified reports, files that have been since released by another user will not appear in the results.
6. Click the Generate
button to create the report.
7. Your results will appear in a new pane directly below the Page by User interface. see Figure 3-5
Figure 3-5: The Page by User Report
175 T H E I : C R E AT E E D I T O R - S E A R C H A N D R E P O R T S >> support@help.esolutionsgroup.ca
8. If your search generated several pages of results you can use the page tool in the bottom right of the screen to navigate through the pages. There are also export tools if you would like to use your search results in other applications. For more information on exporting your results see Exporting Search Results under the Search section of this document.
3.2.3 The Not Released Report This report has a greater scope than its title indicates. Not only can it locate files that have not yet been released, but also those that have expired, are waiting for approval, or have changes pending. To create a Not Released report: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create at the beginning of the Search section, above. 2. Locate the Reports Tools using the instructions provided in the Locating the Reports Tool section, above. 3. Select the Not Released option under the Reports Main Menu. This will open the Un Released and Expired Content Report dialogue. see Figure 3-6
Figure 3-6: The Un Released and Expired Content Report Dialogue 4. Select one or more of the Status checkboxes. You may wish to limit each report to a single file status to prevent confusion. The various statuses are:
5.
Not Released
This report shows any page which has not been released, including those which have expired, have changes pending, or are waiting for approval.
Expired
This report will show any page that was given an expiry date upon its original release that has since passed.
Waiting for Approval
Creates a report of all files that are currently waiting to be approved for release.
Changes Pending
Generates a list of all files that have been modified but have not yet been released.
Click the Generate
button to create the report.
176 T H E I : C R E AT E E D I T O R - S E A R C H A N D R E P O R T S >> support@help.esolutionsgroup.ca
6.
Your results will appear in a new pane directly below the Un Released and Expired Content Report interface. see Figure 3-7
Figure 3-7: The Not Released Report 7.
If your search generated several pages of results you can use the page tool in the bottom right of the screen to navigate through the pages. There are also export tools if you would like to use your search results in other applications. For more information on exporting your results see Exporting Search Results under the Search section of this document.
3.2.4 The Statistics Report The Statistics report is a static report generated as an overview of your website and the resources it utilises. Unlike the previous reports there are no settings or selectable fields, nor does the report have the ability to export its output. To generate a Statistics report: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create at the beginning of the Search section, above. 2. Locate the Reports Tools using the instructions provided in the Locating the Reports Tool section, above. 3. Select the Statistics option under the Reports Main Menu. This will automatically generate a Statistics Report. see Figure 3-8
177 T H E I : C R E AT E E D I T O R - S E A R C H A N D R E P O R T S >> support@help.esolutionsgroup.ca
Figure 3-8: The Statistics Report The report’s output includes the following information: Page Statistics Total Pages
The Total Number of pages in the website.
Released Pages
The number of pages which have been released to the public.
Unreleased Pages
The number of pages that have not been released to the public. Note that this does not refer primarily to pages that have never been released (although they would be included here if your site has any), but those that have changes pending, or that are waiting for approval.
Expired Pages
A count of any pages that are currently expired.
178 T H E I : C R E AT E E D I T O R - S E A R C H A N D R E P O R T S >> support@help.esolutionsgroup.ca
Resource File Statistics File Count
The number of files in a given category.
File Size
The file size of all the files in that category.
Total Resource Files
The total file count and file size of all resource files used on the website.
Documents
A count of all the documents available in the resource folder and their aggregate file size.
Used Documents
The number of documents currently linked to locations on the website.
Unused Documents
The count and file size of all documents currently in site resources that are not linked to by any page on the website. You may wish to use a Resources and Media report to identify these files. There may be no reason to keep them in your site resources if they are not being used.
Media Files
A count of all the image and media files available in the resource folder and their aggregate file size.
Used Media
The number of images and media files currently linked to locations on the website.
Unused Media
As with Unused Documents, above, you may wish to determine if these files need to remain on you site or can be deleted to reduce clutter.
3.2.5 The Meta Data Report The Meta Data report provides a complete summary of the Metadata Description and Keywords for each page on your website. To generate a Meta Data report: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create at the beginning of the Search section, above. 2. Locate the Reports Tools using the instructions provided in the Locating the Reports Tool section, above. 3. Select the Meta Data option under the Reports Main Menu. This will open the Meta Data Report dialogue. see Figure 3-9
Figure 3-9: The Meta Data Report Dialogue
179 T H E I : C R E AT E E D I T O R - S E A R C H A N D R E P O R T S >> support@help.esolutionsgroup.ca
4. Select a department from the Department pull-down list. Note that there is an All option available to generate a complete list. 5. Click the Generate
button to create the report.
6. Your results will appear in a new pane directly below the Meta Data Report interface. see Figure 3-10
Figure 3-10: The Meta Data Report 7.
If your search generated several pages of results you can use the page tool in the bottom right of the screen to navigate through the pages. There are also export tools if you would like to use your search results in other applications. For more information on exporting your results see Exporting Search Results under the Search section of this document.
3.2.6 The Resource and Media Report The Resource and Media report provides an outline of how images, media files (such as audio or video files) and documents are being utilised on your web site. The report provides a list of file names along with links to locations on your pages where the files are being used. Alternatively the report can also provide information on which resource and media files were uploaded to your site but are not being currently used. To generate a Resource and Media report: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create at the beginning of the Search section, above. 2. Locate the Reports Tools using the instructions provided in the Locating the Reports Tool section, above. 3. Select the Resources and Media option under the Reports Main Menu. This will open the Resources and Media Report dialogue. see Figure 3-11
180 T H E I : C R E AT E E D I T O R - S E A R C H A N D R E P O R T S >> support@help.esolutionsgroup.ca
Figure 3-11: The Resource and Media Report Dialogue 4.
Select the relevant checkboxes and file size outlining the type of report you wish to generate: File Type Media
Media files include images, audio files, and video.
Documents
Documents include .pdf, .doc, .docx, .rtf, and .xls files.
Usage Being Used
Files that are currently linked to any location on the website.
Not Being Used
Files currently not used anywhere on the website.
File Size
Allows the user to select a search for files larger or smaller than 1 MB.
5. Click the Generate
button to create the report.
6. Your results will appear in a new pane directly below the Resource and Media Report interface. see Figure 3-11
181 T H E I : C R E AT E E D I T O R - S E A R C H A N D R E P O R T S >> support@help.esolutionsgroup.ca
Figure 3-11: The Resource and Media Report 7.
If your search generated several pages of results you can use the page tool in the bottom right of the screen to navigate through the pages. There are also export tools if you would like to use your search results in other applications. For more information on exporting your results see Exporting Search Results under the Search section of this document.
182 T H E I : C R E AT E E D I T O R - S E A R C H A N D R E P O R T S >> support@help.esolutionsgroup.ca
The i:Create Editor - iFrames
Contents 1 Introduction.................................................................................. 185 2
iFrames and Security................................................................... 185
3
Adding an iFrame to Your Page................................................... 185
3.1
Logging in to i:Create........................................................... 185
3.2
Locating the URL.................................................................. 186
3.3
Embedding an iFrame.......................................................... 186
3.4
Editing an iFrame.................................................................. 188
3.5
Deleting an iFrame................................................................ 189
T H E I : C R E AT E E D I T O R - I F R A M E S >> support@help.esolutionsgroup.ca
1 Introduction iFrames are floating elements used to embed documents, most often another website, directly on your web page. This creates a window from your page onto the target page, through which your visitors can interact with the other page’s content, without ever leaving your site. There are numerous applications for iFrames, but when working with i:Create they are most often used to embed surveys so that content can be deliver seamlessly and without having to open another browser window.
2
iFrames and Security
Using iFrames can introduce a number of security concerns that should be addressed before you make the decision to include them in your site. While they can be both attractive and effective they will often trigger security warnings because many browsers view an attempt to open an iFrame as mixed content (secure and unsecured). While such warnings do not entail any danger most visitors do not appreciate security popups and warnings while browsing. Many visitors will chose to avoid such sites rather than determine if the security warning constitutes a real threat, or merely incorrect browser settings. As such, use iFrames sparingly. There is also a risk of inappropriate or incorrect content appearing on your site. In many cases you will not have control over the content of websites that may appear on your page through an iFrame. If the content of the site you are linking to changes the iFrame could cause the new and possibly incorrect and / or offensive content to appear as if it belongs to your own site. As such the use of iFrames to display outside content requires regular manual checking to assure that any updates to the target site do not reflect poorly on your own. Finally, for similar reasons, many websites do not want others displaying their content through an iFrame. It is very easy for a visitor to your site to assume the content is yours as opposed to belonging to the original site. To counter this problem many sites include scripts in their code that actively disable the ability of outside sites to display their content through an iFrame. Although the results of this code vary depending on the parent site common outcomes include the iFrame returning a missing page error, or the entire page being redirected to the linked site. To prevent this from becoming an issue always check the Terms or Use policy of any website you plan to embed using an iFrame.
3
Adding an iFrame to Your Page
3.1
Logging in to i:Create
Before you can make modifications to your page’s content, including adding iFrames, you must login to the editor. To enter editing mode: 1. Navigate to the page in your site you wish to modify. 2. Activate the editor by pushing CTRL twice. You may be prompted to log in. 3. If necessary, enter your Username and Password into the Login Dialogue. see Figure 3-1
185 T H E I : C R E AT E E D I T O R - I F R A M E S >> support@help.esolutionsgroup.ca
Figure 3-1: The Login Dialogue 4. Click the Login button.
3.2
Vertical scrolling in iFrames does not pose an issue for accessibility, although you may find it unsightly and inconvenient. Horizontal scrolling, however, is a problem. Assistive technologies have trouble following text that requires left to right scrolling, to the point that it becomes almost impossible. If accessibility is a concern do not use iFrames that require horizontal scrolling.
Locating the URL
Prior to placing your iFrame you will have to decide what you wish it to display. Before beginning the process on your web page you will need to acquire the URL of your target website. The easiest way to do this is to open another browser window and navigate to the target site. Copy the URL from the browser’s address bar onto your clipboard to make it available for the next step in the process.
3.3
Embedding an iFrame
iFrames can be placed anywhere on your page regular content can, but keep in mind that they require a fair amount of space to be successful. Allowing too little space for your iFrame will result in scroll bars that can be annoying and impractical for your visitors, as well as having accessibility implications. 1. Locate and log into the page on your web site where you wish to insert an iFrame. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place your cursor where you would like to insert your iFrame. You may consider hiding the right or left content bars to give your iFrame more space. 3. Click the Insert / Edit iFrame button on the Toolbar to open the Insert / Edit iFrame dialogue box. see Figure 3-2
Figure 3-2: The Insert / Edit iFrame Dialogue Box
186 T H E I : C R E AT E E D I T O R - I F R A M E S >> support@help.esolutionsgroup.ca
4. Paste the URL for your target web page into the URL field. The URL must include the http://, but if you copied the URL from a browser address bar, as mentioned in Locating the URL above, you may find the http:// repeated. Assure that you remove the duplicate before proceeding. 5. Enter the Width of your iFrame. Due to accessibility requirements all iFrame widths must be expressed as a percentage of the total available width of the web page. If you are unsure of the required size of your iFrame start at 100% and work your way down. If your web page still has a left / right scroll bar at 100% you may need to consider another method of delivering the content to your visitors. 6. Enter a Height for your iFrame. Browsers do not recognise percentage values for height, so you must enter an absolute value, a number of pixels, for height. Pixel size can seem somewhat arbitrary based on screen size and resolution settings, so start with 500 and add or subtract height if necessary. 7. Enter a Title for your iFrame. The title is read by assistive technologies to help visitors with visual impairments decide if they wish to examine the content of the iFrame. Make the title descriptive of the frame’s contents and include the name of the web page displayed. 8. Click the Submit button to embed your iFrame into the page. You will be returned to your page and the iFrame will display the content you have selected. see Figure 3-3
Figure 3-3: An Example iFrame Your iFrame may show a beveled border, depending on the browser you are using. 9. Save your page by clicking the Save button on the Toolbar. To have your iFrame appear on the live version of your site you must also release your page. For more information of this process see Releasing Pages under the editor section of the i:Create manual.
187 T H E I : C R E AT E E D I T O R - I F R A M E S >> support@help.esolutionsgroup.ca
3.4
Editing an iFrame
To edit an iFrame after it has been inserted into a page: 1. Locate and log into the page which contains the iFrame you wish to edit. Use the procedure outlined in the Logging in to i:Create section, above. 2. Select the iFrame by clicking anywhere within its border. Once it is selected you will notice eight small boxes surrounding it. see Figure 3-4
Figure 3-4: A Selected iFrame 3. Click the Insert / Edit iFrame button on the Toolbar to open the Insert / Edit iFrame dialogue box. see Figure 3-5
Figure 3-5: The Insert / Edit iFrame Dialogue Box 4. Make any modifications required to the parameters listed in the Insert / Edit iFrame dialogue box and click the Submit button. 5. Save your page by clicking the Save button on the Toolbar. To have your iFrame appear on the live version of your site you must also release your page. For more information of this process see Releasing Pages under the editor section of the i:Create manual.
188 T H E I : C R E AT E E D I T O R - I F R A M E S >> support@help.esolutionsgroup.ca
3.5
Deleting an iFrame
To remove an iFrame from your web page: 1. Locate and log into the page which contains the iFrame you wish to delete. Use the procedure outlined in the Logging in to i:Create section, above. 2. Select the iFrame by clicking anywhere within its border. Once it is selected you will notice eight small boxes surrounding it. see Figure 3-6
Figure 3-6: A Selected iFrame 3. To remove the iFrame hit the Delete key on your keyboard. 4. Save your page by clicking the Save button on the Toolbar. To have your iFrame removed from the live version of your site you must also release your page. For more information of this process see Releasing Pages under the editor section of the i:Create manual.
189 T H E I : C R E AT E E D I T O R - I F R A M E S >> support@help.esolutionsgroup.ca
The i:Create Editor Secure Email and the Email Manager
Contents 1 Introduction.................................................................................. 192 2
About Secure Email...................................................................... 192
3
Adding and Editing Secure Email Links...................................... 192
3.1
Logging in to i:Create........................................................... 192
3.2
Adding a Secure Email Link.................................................. 193
3.3
Previewing a Secure Email Link............................................ 195
3.4
Editing a Secure Email Link................................................... 197
3.5
Deleting a Secure Email Link................................................. 197
4
The Email Manager...................................................................... 197
4.1
Accessing the Email Manager............................................... 197
4.2
Adding Email Addresses to the Database............................. 198
4.3
Editing Email Addresses....................................................... 198
4.4
Deleting an Email Address.................................................... 199
T H E I : C R E AT E E D I T O R - S E C U R E E M A I L A N D T H E E M A I L M A N A G E R >> support@help.esolutionsgroup.ca
1 Introduction The secure Email tool was developed to fulfil two goals. First, many visitors to a website may not have access to personal email, such as those using public terminals like libraries and employment centers. Secure email allows anyone to send email from any location as long as they can access your website. The second goal was to increase the security of email information exposed to the public. Traditional email links allow automated tools scanning the internet to record a person’s email address and return it to automated mailing list software. This can result in a substantial increase in junk mail and online solicitation for any email address posted on a public site. Secure Email links prevent this by hiding the recipient’s email address behind specialised code.
2
About Secure Email
The Secure email tool actually consists of two separate components working together. The first component is the link on the page, which activates the code associated with the Secure Email tool. To prevent any possibility of this code being used to access or damage your web site it is disabled in i:Create’s preview mode, so do not be surprised if you receive an error message when attempting to test your Secure Email link. For detailed information on how to effectively preview your link see the Previewing a Secure Email Link section, below. The second component of Secure Email is the database attached to the module. This database stores the contact information for each email address which can be assigned a Secure Email link. One of the challenges of using this module is the necessity to closely monitor the contents of this database. It is very easy to add additional names to this list. So much so that the list will often become crowded with names that are unnecessary or obsolete. Establishing a policy for who is responsible for adding names and maintaining the list early on in a project can save on housekeeping time down the road.
3
Adding and Editing Secure Email Links
3.1
Logging in to i:Create
Before you can add a Secure Email link to your web page, you must login to the editor. To enter editing mode: 1. Navigate to the page in your web site you wish to modify. 2. Activate the editor by pushing CTRL twice. You may be prompted to log in. 3. If necessary, enter your Username and Password into the Login Dialogue. see Figure 3-1
192 T H E I : C R E AT E E D I T O R - S E C U R E E M A I L A N D T H E E M A I L M A N A G E R >> support@help.esolutionsgroup.ca
Figure 3-1: The Login Dialogue 4. Click the Login button.
3.2 Many i:Create users like the idea of using the recipients email address as the link that activates the code. Avoid doing this if possible. By placing the email address directly on the page you once again expose it to theft, removing the protection the Secure Email link tool was designed to provide.
Adding a Secure Email Link
To add a Secure Email link to your web page: 1. Locate and log into the page on your web site where you wish to insert a Secure Email link. Use the procedure outlined in the Logging in to i:Create section, above. 2. Determine where you would like to place your Secure Email link. Place your cursor at the selected location and enter the text that will become the link. Popular choices include statements like Send Us Mail, or Contact Us Via Email. Choose an option which reflect the tone of you website. 3.
Carefully select the text that will become the email link. Avoid selecting the spaces before or after your link or the punctuation within or at the end of sentences, like commas and periods.
4.
Click the Email Link button on the Toolbar to open the Email Link dialogue box. Not that in the example the names and email address have been removed. see Figure 3-2
193 T H E I : C R E AT E E D I T O R - S E C U R E E M A I L A N D T H E E M A I L M A N A G E R >> support@help.esolutionsgroup.ca
Figure 3-2: The Email Link Dialogue Box 5. Note that you do not need to use personal emails for this purpose. Many organizations create information or contact emails that are not directed to specific individuals.
If the contact information for the link you wish to create is already present in the data base click the Add button at the end of its row to select it. If the required information is not currently in the database fill out the First Name, Last Name, and eMail fields at the top of the dialogue and click the Save button to add it. When the new entry appears click the Add button at the end of its row to select it. If you have a large number of entries in your data base you may need to locate the target address in several pages of data. A paging tool will appear at the top of the list to allow you to flip through the content. By default addresses are stored alphabetically based on the First Name entry, although clicking on any of the column headings will allow you to sort based on that column.
6. Once you click the add button the Email Link dialogue will close and you will be returned to you web page. The text that you selected should now appear as a link. 7. Save you page by clicking the Save button on the Toolbar. To have your Secure Email link appear on the live version of your site you must also release your page. For more information of this process see Releasing Pages under the editor section of the i:Create manual.
194 T H E I : C R E AT E E D I T O R - S E C U R E E M A I L A N D T H E E M A I L M A N A G E R >> support@help.esolutionsgroup.ca
3.3
Previewing a Secure Email Link
The scripts that operate your Secure Email links are disabled in the editing and preview mode of i:Create. If you click on a Secure Email link in these modes you will receive an error message informing you that they are unavailable. see Figure 3-3
Figure 3-3: Error Message To address this issue and preview your link successfully you must release your page and then navigate to it on the live side of your website. To preview a Secure Email link: 1. Locate and log into the page on your web site where you wish to insert a Secure Email link. Use the procedure outlined in the Logging in to i:Create section, above. 2. Create your Secure Email link using the steps outlined above in the Adding a Secure Email Link section. 3. Release your web page to your live site. For details on this procedure see Releasing Pages in the editor section of the i:Create manual. Note that it can take some time to complete the release of a page, so allow a couple of minutes before proceeding to the next step. 4. You will now need to preview the live version of your page. There are two ways of doing this. You can navigate to your live web page and click the Secure Email link to test it. If you get the error message again make sure the URL in your browser’s address bar indicates you are on your live site and are not still looking at the preview page. You can also preview your page using the live view icon in the Administrative Interface. To do this click the Home button on the Toolbar. This should open the Administrative Interface with the Content Page List of you current department displayed in the right content pane. Locate the page containing the Secure Email link you wish to test. Click the Live View button associated with your file. This should open your page in a new browser window or tab. Locate and click on your Secure Email link. 5. Either of these two options should open the Secure Email form in a pop-up window. see Figure 3-4
195
T H E I : C R E AT E E D I T O R - S E C U R E E M A I L A N D T H E E M A I L M A N A G E R >> support@help.esolutionsgroup.ca
Figure 3-4: The Secure Email Form 6. If you have access to the destination email address you can complete the relevant fields and hit the Send Email button: Your e-mail Address
Enter the email address to which you would like the recipient of your Secure Email to reply to.
Subject
The subject line that will be attached to the sent email.
Your Message
The body of your email. There is a 2000 character limit to prevent mischief, such as pasting the text of an entire novel into the space.
Attachment
Allows the sender to attach a file of up to 5 MB. Note that while Secure Email will send files up to 5 MB, your mail system may not be able to receive them. Check with your IT department to confirm the maximum mail size you can receive. Depending on when your Secure Email was set up you may have one of two possible security tools. Both are intended to prevent automated systems from sending email.
Security Feature
The first possibility is that you may see a skill testing question. You will not be allowed to send the email until this question has been answered correctly. The second possible option is a Captcha security box, which requires visitors to retype two words correctly in order to proceed. see Figure 3-5
196 T H E I : C R E AT E E D I T O R - S E C U R E E M A I L A N D T H E E M A I L M A N A G E R >> support@help.esolutionsgroup.ca
Figure 3-5: The Captcha Security Box
3.4
Editing a Secure Email Link
Due to the way that the scripts apply their effect to the web page code Secure Email links cannot be edited in the traditional sense. They can however be re-applied. To change the recipient of a Secure Email select the link and click the Email Link button. Select a new recipient from the data base to redirect the Secure Email link. Note that there is no way to send Secure Email to more than one person at a time, although you could use a shared email account to achieve a similar effect.
3.5
Deleting a Secure Email Link
To remove a Secure Email link from a block of text: 1. Locate and log into the page on your web site from which you wish to remove the Secure Email link. Use the procedure outlined in the Logging in to i:Create section, above. 2. Place your cursor anywhere within the secure email link. You do not need to select the text to remove the link. 3. Click the Remove Link button in the Toolbar. This will strip the Secure Email link but leave the link text. If you wish to remove both the text and the link select the link and delete it normally.
4
The Email Manager
The Email Manager module provides users with the ability to modify and maintain the email addresses associated with the Secure Email tool.
4.1
Accessing the Email Manager
To locate the Email Manager module: 1. Locate and log into any page on your web site. Use the procedure outlined in the Logging in to i:Create section, above. 2. Open the Administrative Interface using the Home 3. Click the expand open it.
button.
icon next to the General department in the Resource Tree to
4. Click the expand icon next to the Modules folder in the General department to see a list of modules.
197
T H E I : C R E AT E E D I T O R - S E C U R E E M A I L A N D T H E E M A I L M A N A G E R >> support@help.esolutionsgroup.ca
5. Click on the Email Manger module to select it and the Email Manager interface will open in the right content pane. see Figure 4-1
Figure 4-1: The Email Manager Interface
4.2
Adding Email Addresses to the Database
To add an additional email address to the Email Manager database: 1. Access the Email Manager using the procedure outlined in the Accessing the Email Manager section, above. 2. At the top of the Email Manager are three fields, First Name, Last Name and eMail. Enter the details of the new email contact into these fields. 3. Click the Save button. You will receive a message at the top of the interface indicating that the new email address has been added successfully. see Figure 4-2
Figure 4-2: Email Added Message The new email address should appear in the email list. By default contacts are organized alphabetically, by first name. However, clicking on the heading of the First Name, Last Name, or Email column will reorder the entries based on the alphabetical order of the selected column.
4.3
Editing Email Addresses
To edit an email address already contained in the database: 1. Access the Email Manager using the procedure outlined in the Accessing the Email Manager section, above. 2. Select the email address you would like to edit by clicking on the radio button left of its entry in the email list. This will load the details for the selected address into the fields at the top of the interface.
198
T H E I : C R E AT E E D I T O R - S E C U R E E M A I L A N D T H E E M A I L M A N A G E R >> support@help.esolutionsgroup.ca
3. Make any changes that are required to the First Name, Last Name, and eMail fields. 4. Click the Save button to confirm the changes. You will receive a message identical to that in Figure 4-2, stating that your update has been successful.
4.4
Deleting an Email Address
To delete an email address contained in the database: 1. Access the Email Manager using the procedure outlined in the Accessing the Email Manager section, above. 2. Select the email address you would like to delete by clicking on the radio button left of its entry in the email list. This will load the details for the selected address into the fields at the top of the interface. 3. Click the Delete button remove the selected address. You will be asked to confirm the deletion. Click OK to remove the email address. You will receive a message verifying that the email address has been removed successfully. see Figure 4-3
Figure 4-3: Email Deleted Message
199 T H E I : C R E AT E E D I T O R - S E C U R E E M A I L A N D T H E E M A I L M A N A G E R >> support@help.esolutionsgroup.ca