Escenic Web Studio Log in, continued

Transcription

1 Escenic Web Studio Log in, continued Figure 6--Home page Content Menu Bar and panels The creating of new compositions, as well as images, multimedia, links, persons, and topics. This panel allows you to make a search on those items in any one of the archives, article, image, multimedia, link, person, user group or topic. At a glance this region displays how many items are in which section. The titles of the articles you have been working with will display here. Editing more than one object at a time is a possibility and you can keep track of what is open by looking in this area. Figure 7--Panel definitions 12

2 Escenic Web Studio Log in, continued What You Will See Menu bar Figure 4 --Home page Content Menu Bar and panels Menu bar and Home The menu bar displays links with the possibility of gleaning more information right at your fingertips. Articles x Open Objects x Open Sections x Open This link takes the user into the Articles features in Escenic s Web Studio. Click on the number of open articles to see what's open. Click on any article to open it. This link takes the user into the Objects features in Escenic s Web Studio. Click on the number of open objects to see what's open. Click on any object to open it. This link takes the user into the Sections features in Escenic s Web Studio. Click on the number of open sections to see what's open. Click on any section to open it. Administration This link takes the user into the Administration features in Escenic s Web Studio. Figure 5--Menu bar information General Information and Technology 11

3 General Information and Terminology Workflow An article is created with text, pictures, external links and links to other articles. The article is then published on one or more different locations within the Front page or other areas. The steps to create an article. 1. journalist creates article 2. article is filled with text and attachments 3. article is assigned one or more sections 4. article is sent to editor's inbox 5. editor approves article and puts on section front page 6. editor publishes updates The article has different article states at different times during the workflow; draft, submitted, approved, deleted and published but only published articles are shown on the internet. Article state definition There are five article states, Draft Submitted Approved Published Deleted The author has just saved the article. The author has delivered the article, perhaps to a section page for an editor to edit. The article has been accepted by the editor and is waiting to be published. Article is published and accessible on the web. Articles are removed from the web and marked as deleted in the system. Figure 8--Article states and definitions General Information and Technology 13

4 What Escenic Web Studio Looks Like Articles Objects The articles area or articles link, in the Menu bar, of Escenic Web Studio allows you to work or perform actions with articles in archives and/or create entirely new compositions or articles. To the right of Articles, the current number of articles open (x), if any, displays. In addition to text an article can consists of images, external links, links to other articles, pictures, etc. and these are referred to as objects. Examples of additional objects are Sections Administration media files such as word documents, spreadsheets, PDFs, film clips and more persons topics The sections area of Escenic Web Studio allows you to work or perform actions with different articles/compositions by placing them in their unique position of choice. The administration area of Escenic Web Studio allows certain users to create all additional areas required for use by editors/authors when creating composition. In Administration, users are added, different publications can be addressed and much more. For information on User roles, please refer to Chapter 6 Extras. 20

5 What Escenic Web Studio Looks Like, continued Home page Figure 16--View of Escenic Web Studio Home page. The Home page is an index to the functions, such as creating, searching and so on. General Information and Technology 21

6 What Escenic Web Studio Looks Like, continued Home page panels General Information Create new Search There are five panels on the home page. Create new Search Favourite sections Your latest articles Currently open The creating of new articles, images, multimedia files, links, persons and/or authors and topics is conveniently located at the top of the home page in this panel. For more information refer to the chapter on Articles, topic, Create new. All items that you can perform searches on are handled here. Searching can be based on a specific ID. Searching can be performed by a specific date or a range of dates, or by keyword. If searching by keywords, you can search for specific keywords appearing in the story, or the images, links, etc. More detailed searches are handled by clicking on the articles list in the Menu bar and going into the Article archive. For more information refer to the chapter on Search. 22

7 Home page panels, continued Favourite sections The list of items displayed in this panel has links to sections a user has responsibility for. The number in parentheses displays how many new articles are in each section s in box. For example, Hobbies (2 items) Sports (5 items) A new feature here is that sections are editable. This means for the more commonly used sections; the user can choose to have them always on view in the Home page. Clicking on EDIT LIST in the Favorite sections panel brings the user to a new screen. The pre-defined sections that exist in the client s site are displayed. The user can choose the sections he uses most often. Placing a check mark in the box means this section will display as favorite section on the Home page. Your latest articles Currently open The five most recent articles opened and their current article state are handled here. Clicking on the title takes you to the editor and clicking on View takes you to a preview of the article. The five most recent items open are on display in this panel. You can click on it to display it on your screen. General Information and Technology 23

8 Chapter 2 Articles What is an Article Definition Article types The article is the main composition created in Escenic Web Studio. This helps the user write and publish articles on the internet. Each client-specified solution of Escenic Web Studio contains one or more article types to choose from. Possible articles types are: document report letter handbook brochure movie guide picture series Each article type has its own set of text fields or layouts. Text fields can assist the writer in the type of information each article requires. Changing the article type can change the text fields that are presented to the writer. The article functions as a holder of all the items that are to be shown with the article, pictures, links, related articles, or other type of media. The author of an article will attach pictures links or other types of media to an article. Upon completion the author then sends the article to one or more sections where it is offered to the editor. The new article is instantly assigned a unique ID. 24

9 What is an Article, continued Article types, cont. Use of Article types An article type can be used in different ways. It is an area that shows the writer where text can be written. This includes things like text areas, drop-down boxes and check boxes of items that are to be included in the article. From the Home page in the Create new panel, the user will choose their article type. Article types are editable. This means for the more commonly used article types the user can choose to have them always on view. Clicking on EDIT LIST in the Create new panel brings the user to a new screen. The pre-defined article types that exist in the client s site are displayed. The user can choose the article types he uses most often. Placing a check mark in the box means this article type will display as an offered article type on the Home page. There is no limit to the number of article types displayed on the Home page. It is only to access article types in quicker, fewer steps. You don t need to wade through many article types if you mainly concentrate on a few select ones. More article types You can also click on More article types under the Create new panel. The click takes you to the Articles archive. On the right-hand side of the screen the Create new panel has been expanded for ease of reference. Put your cursor on the article type and you will notice that it becomes momentarily underlined. Keep the cursor there a second or two and the information or text balloon displays. Click on the article type once and the new article screen will display, ready for you to enter your composition in the correct areas, for example, start with Title. If your site has taken advantage of the article type branding, those article types with an icon attached will display. Articles 25

10 What is an Article, continued Article types, cont. More article types, cont. Figure 17--Article type icon, example 26

11 Create new Definition From Home page There are many avenues available in the Escenic Web Studio system where you can begin creating new articles. From the Home page click on the Articles link on the Menu bar. Figure 18--Home page Article link From the Home page in the Create new panel choose an article type. A new feature here is that the article types are editable. This means the user can choose to display the commonly used article types first. Clicking on EDIT LIST in the Create new panel brings the user to a new screen. The pre-defined article types that exist in the client s site are displayed. Articles 27

12 Create new, continued Article layout at a glance, cont. Article Details New after Add sections Figure 26--How article details looks after choosing new section. 36

13 Create new, continued Article layout at a glance, cont. The next dialogue box is Save as: In the Save as: box Article state is first. When you are ready to submit an article you click on the dropdown box and choose the article state based on the your rights as the user/author. Listed here are the five article states, their corresponding icon and definition. Draft Submitted Approved Published Deleted The author has just saved the article. The author has delivered the article, perhaps to a section page for an editor to edit. The article has been accepted by the editor and is waiting to be published. Article is published and accessible on the web. Articles are removed from the web and marked as deleted in the system. Figure 24 Article states and definitions Below the state of the article is the button. The Save button is the acknowledgement that all changes are accepted into the system. The Preview button allows you to view the article in the preview window. Copy allows you to make a duplicate copy of the current article. The Close button closes the existing article making no accepted acknowledgement of any changes you might have made. None of your changes will be saved. Articles 33

14 Create new, continued Article layout at a glance, cont. Article Details Add topics If you know the ID of the topic you want the article to be a part of enter the ID in the ID box underneath the Topic archive title, press the button or, In Search Word Type in a word or part of the name text in the Search for: and press the button. The asterisk may be used as a wildcard character. For example, al* will retrieve instances of topics with the words ALICE, ALYSON, ALBERT OR MARSHALL in the text field. When you go into Topic archive, Escenic Web Studio will display the first page of search results. If you see the name you want place a check mark in the box next to the unique ID or unique identifier of that topic. Press. Otherwise, you can navigate back and forth in the Search result pages. << or >> - Double arrows move workflow to the beginning and end of search result list, respectively < or > - Single arrows move workflow to next or previous page of topics in the Search result 123 The Search result is organized into pages of topic files in the search result 40

15 Create new, continued Article layout at a glance, cont. Meta-data summary Time control If an article is to be visible on the web within a certain time frame, click on the words more information in the Meta-data summary box. Figure 29--Edit article screen highlighting the metadata summary box, click on more information. Articles 41

16 Create new, continued Article layout at a glance, cont. Meta-data summary Time control, cont. In order to access the Meta-data summary information you must click on more information. The information in the summary box will be filled out by the system when you exit the meta-data dialogue. Figure 30--Date and time control dialogue box 42

17 Create new, continued Article layout at a glance, cont. Meta-data summary Time control, cont. The date and time information line consists of: Enabled From Date Select box- This must be check marked in order for the following date and time to be active. Day Month that has a corresponding dropdown box for you to select the correct month Hour Minute or, if you prefer to use a calendar Calendar To insert the date using the calendar uses the arrows to go backwards and forwards in the months and click on the date. Enter the hours and minutes. Articles 43

18 Create new, continued Article layout at a glance, cont. Meta-data summary Time control, cont. There are several more lines of meta-data information that you can utilize or not. Publish date Update published date to current date Published from information line will be filled out by the system. Hidden article the article will remain hidden and not appear in article lists. The hidden article select box must be deselected in order for the article to be visible in lists. Comment The Comment area makes it possible for different users to leave an internal note attached to the Article. The text is internal and, therefore, not shown for all to see. Article type It is possible to change the article type here by using the dropdown box to view and select a different article type. In order for the change to take place you must click on the button Set article type. You must remember to click on Save in the Save as box. 44

19 Create new, continued Article layout at a glance, cont. Attach images There are different ways within Article editor where images can be placed; by relating an image to a field or by creating an inline image. Press the button located under the last article panel. The Image archive appears. For more information on Image archive, please refer to the Chapter 3, Upload image. Search through the Image archive until you find the first image you want to attach to your article. Place a check mark in the left-hand corner of the image. The chosen image is highlighted. Figure 31--Image selection. Image details Caption: This is a template-specific feature that pertains to text that appears based on template. Alignment: This is a template-specific feature that pertains to placement of the image. The current options for placement are Left, Center, or Right. Articles 45

20 Create new, continued Article layout at a glance, cont. Image details, cont. Related to field: This is a template-specific feature that pertains to the locations within the article that accept placement of an image. Click on the arrow in the Select field box and choose a location. The panel name is displayed in parenthesis, ex. Body (Default) where default is the name of the panel and Body the name of the text field In addition to relational fields there can be relational types. Instead of relating an image to Body (Default) where default is the name of the panel and Body the name of the text field, you can relate an image to one of the relational types it might have associated to it by definition. An example could be, Frontpage or Attachment and the template then determines the actual placement within the chosen relational type, Frontpage. Move image into this field: (also known as inline image). Clicking on this text places images inside the chosen Related to text field. 46

21 Create new, continued Article layout at a glance, cont. Relate image to field Figure 32--Image as it appears within the Article editor and the Body (Default) field selected Articles 47

22 Create new, continued Article layout at a glance, cont. Preview of selection Figure 33--Sample Preview of image directed to Body (Default) Relating pictures to a text field or a relational type rather than placing them inside the text field offers better image management. Figure 33 displays the image related to the body text field. Since the image is not inline it is possible to access the images other versions created via Generate versions. This type of automatic functionality is not possible with a picture that is embedded inside the text, because placement of images inline relies on a different technology than images related to a text field. Inline images are embedded inside the text, while the related image is a related object to the article. 48

23 Create new, continued Article layout at a glance, cont. Relate more than one image to field Remembering that relating images to a field or relational type are dependent on the template; to relate more than one image to relate to a field, for example, Body, you click on the down arrow in each instance and click on the relation. Figure 34--Relate more than one image to a field or relational type Articles 49

24 Create new, continued Article layout at a glance, cont. Relate more than one image to field, cont. These images will appear in the Body text in the order shown. To change the order, 1. Click on the directional arrow to move down one OR: Click on the placement arrow farther than one place. to move a bit Figure 35--Change order of images related to one field 50

25 Create new, continued Article layout at a glance, cont. Relate more than one image to field, illustration, cont. Figure 36--New view after Image of the dog is moved down one place Articles 51

26 Create new, continued Article layout at a glance, cont. Move image into field (or Place inline) The choice of relating to a field and then clicking on Move image into field produces the image up in the text for user to view.. Figure 37--Image moves up to selected field 52

27 Create new, continued Article layout at a glance, cont. Move image into field, with options Right-clicking on the image produces an inline image edit box. Figure 38--Image in selected field and right-click produces an inline edit box Articles 53

28 Create new, continued Article layout at a glance, cont. Picture properties after right-click on edit box Of special interest might be picture properties where the user can choose to incorporate a border and horizontal alignment. The user can choose an image version of his choice and whether or not to add or modify Alt. text and Caption. Figure 39--Picture properties of an inline image Edit the properties to be changed Border Enter the weight of border Horizontal alignment - Placement of image Version - Choose the version used by the templates Alt. text Text displayed when the mouse is placed over it in a browser Caption is the description used and is normally shown under the image, still template specific Press OK to save the changes. 54

29 Create new, continued Article layout at a glance, cont. Attach articles To attach related articles to your current article click on the button below the final article type text field. Figure 40--Attach articles, multimedia or links button Articles 55

30 Create new, continued Article layout at a glance, cont. Attach articles, cont. Click on Find articles and you are brought into the Article archive. For more information on Article archive, please refer to Chapter 5, Article Search how to. Search the Article archive until you find the first article you want to attach to your article. Place a checkmark in the left-hand box of the article. To add more articles, search through the Article archive; place a checkmark in the left-hand box of the article. Escenic Web Studio will keep track of the chosen articles at the bottom of the screen under the heading Previously selected items. When you are done choosing the articles you want to add to your original article, click on the button. You return to the original article and your choices display. 56

31 Create new, continued Article layout at a glance, cont. Relate more than one article to field In addition to relational fields there can be relational types. Instead of relating an article to Body (Default) where default is the name of the panel and Body the name of the text field, you can relate an article to one of the relational types it might have associated to it by definition. A relational type example could be, Frontpage or Attachment. The template then determines the actual placement within the chosen relational type, Frontpage. Remembering that relating articles to a field or type are dependent on the template; if you have three articles that you want to relate to a field or a relational type, click on the down arrow in each instance and click on the relation. Figure 41--Linking of one or more articles to an article Articles 57

32 Create new, continued Article layout at a glance, cont. Change the order of related articles to field These articles will appear in the Lead text in the order shown. If you want to change the order, 1. Click on the directional arrow to move down one Figure 42--Change order of articles related to one field If you want to move the first article to the bottom Figure 43--Move a related article to bottom of list to change the way the internet reader views the attached articles 58

33 Create new, continued Article layout at a glance, cont. Attach multimedia To attach related multimedia objects to your current article, Click on the button below the final article type text field, as shown in Figure 40. Click on Find multimedia and you are brought into the Multimedia archive. For more information on Multimedia archive, please refer to Chapter 5, Multimedia Search how to. Search the Multimedia archive until you find the first object you want to attach to your article. Place a checkmark in the left-hand box of the object. To add more objects, continue searching through the Multimedia archive; continue to place checkmarks in the left-hand box of the object. Escenic Web Studio will keep track of the chosen objects at the bottom of the screen under the heading Previously selected items. When you are done choosing the objects you want to add to your original article, click on the button. You return to the original article and your choices display. In addition to relational fields there can be relational types. Instead of relating a multimedia object to Body (Default) where default is the name of the panel and Body the name of the text field, you can relate it to one of the relational types it might have associated to it by definition. A relational type example is Frontpage or Attachment. The template then determines the actual placement within the chosen relational type, Frontpage. Articles 59

34 Create new, continued Article layout at a glance, cont. Attach multimedia, cont. Figure 44--Multimedia object attached to an article 60

35 Create new, continued Article layout at a glance, cont. Attach links To attach related links to your current article. Click on the button below the final article type text field as shown in Figure 40. Click on Find links and you are brought into the Link archive. For more information on Link archive, please refer to Chapter 5, Link Search how to. Search the Link archive until you find the first link you want to attach to your article. Place a checkmark in the left-hand box of the link. To add more links, continue searching through the Link archive; continue to place checkmarks in the left-hand box of the link. Escenic Web Studio will keep track of the chosen links at the bottom of the screen under the heading Previously selected items. When you are done choosing the objects you want to add to your original article, click on the button. You return to the original article and your choices display. In addition to relational fields there can be relational types. Instead of relating a link to Body (Default) where default is the name of the panel and Body the name of the text field, you can relate it to one of the relational types it might have associated to it by definition. An example could be, Frontpage or Attachment. The template then determines the actual placement within the chosen relational type, Frontpage. Articles 61

36 Create new, continued Article layout at a glance, cont. Attach link, cont. Figure 45 Attaching link objects to an article 62

37 How to Edit Text Definition The text-fields are organized into groups of areainformation fields. Each group of information-fields is placed on a panel. Each has a label identifying it. For example, Lead text, Body. Choosing the Article type will determine which information-fields are included in the article. Note that article types are customer-specific. XHTML Editor Active and Inactive The XHTML-editor is an MS Word-like editor. This editor has been created to simplify text editing in Escenic Web Studio. Some advantages of using the XHTML editor: There is no longer any need for coding in HTML or XML. If required, the source code is available by right-clinking the mouse inside of the text field. It offers graphical shortcuts that perform common text editing functions. Makes text-editing in Escenic Web Studio look and feel more like common editors such as MS Word. Many of the editing functions are intuitive and will work just like MS Word and others. When you open an article in Escenic Web Studio, you are often presented with a list of text fields. The XHTML editor can be applied to one or more fields in the article. Place the cursor inside a text field. If the field has the ability to use the XHTML editor it displays the menu in an active mode. Note that the text editing toolbar is both customer and template-specific. Therefore, the example shown may not be entirely relevant to your site. If the menu is not dimmed it is active. The current field is capable of being edited. If the menu is dimmed it is inactive. Figure 46--The display difference is slight between active and inactive Articles 63

38 How to Edit Text, continued Using XHTML Editor Insert text: 1. Place the cursor at insertion point. 2. Enter or paste CTRL +V text into the editor. Align text diagram Delete text: 1. Place the cursor at deletion point. 2. Press delete for deleting the following letter or backspace for deleting the preceding letter, or 3. Select the text you want to delete and press delete or backspace. Select text: 1. Using the mouse, press left mouse button at selection start, drag the mouse to the selection end and release left mouse button. 2. Use short key which is a combination of CTRL +SHIFT and arrow keys. Align text: 1. Select the text to align. 2. Click one of the following buttons to align left, center or right short key which is a combination of CTRL +SHIFT and arrow keys. Figure 47--Align text diagram 64

39 How to Edit Text, continued Working with Tables, continued Table Properties Table properties can be edited at any time by placing the mouse anywhere in the table and right-clicking. Select how many rows and columns you want by moving the mouse over the table that appears and click the leftmouse button in the cell that marks the last cell. Figure 53--Table properties box Edit Table Properties Text within tables can be formatted as you would format text in a document. For example, you can change the type and alignment. The steps to editing table properties. 1. Right-click the cell to edit 2. Select the table, column or cell tab and edit the properties that you want to change 3. Press Ok to save the changes Figure 54--Three tabs in table properties. Articles 69

40 How to Edit Text, continued Working with Tables, continued Edit Table Properties, cont. Figure 55--Table properties tab COLUMN highlighted Note that the width can be altered either by percentage or altered by pixels when clicking the downward arrow. Figure 56--Table properties tab CELL highlighted Insert row before Insert row after Delete row Delete table In Horizontal alignment the options none, left, center and right are presented. In Vertical alignment options none, top, center and bottom are presented. In Width, you can chose altering by percentage or altering by pixels. This will add an additional row before the row where the cursor is. This will add an additional row after the row where the cursor is. This will delete the row where the cursor is. This will delete the table in its entirety. 70

41 How to Edit Text, con Pre-formatted text ntinued Pre-formatted text will honor multiple character spaces and line breaks. The code editor will not verify HTML code. This means if you have a link with & in it or other non-expected code it is possible to force it through. 1. Place the cursor at the point to insert pre-formatted text. 2. Click the preform button on the menu tabs and an editor-window pops up. Enter or paste pre-formatted text and click Save. Edit Pre-formatted Text To insert a header follow these steps: 1. Right-click just to the right of select edit preformatted text. 2. Edit the text and click the save button. and Articles 71

42 How to Edit Text, con ntinued Edit XHTML Source To edit XHTML source follow these steps: 1. Right-click in the editor and select Edit Source. 2. Edit the source code and click the save button. Undo Editing Note. This feature should only be used by experienced users who know the basic rules of HTML/ /XHTML/XML editing. Some edits are performed in several operations. For example, if you delete a part of the document in one operation, in might be that you have to perform the undo- of the operation more than once to restore the content editor. Click the button on the menu tabs Use short-key CTRL +Z Redo Editing Search and Replacee within Text To redo previous editing. Click the button Use short key CTRL +Y To search and replace follow these steps: 1. Click the Search and Replace button. 2. In the Search box select Find or the Replace tab. 3. Enter the text you want to search for and what you want to replace it with, if applicable. Select any other options you want. Click Find next or Replace. 4. Click Close when you finish searching. Figure 57--Search and replace box 72

43 How to Edit Text, continued Insert symbols To insert symbols such as ½, symbols that are not on your keyboard, click on the insert symbol link. Choose the symbol to insert, click on insert and then close. Figure 58--Insert symbol dialog box Formatted: Font: 10 pt, Bold, English (U.S.) Formatted: Font: Bold, English (U.S.) Field Code Changed Formatted: Font: 10 pt, Bold, English (U.S.) Formatted: English (U.S.) Articles 73

44 Links Insert External Image Place your cursor in the information or text area where you want to insert an external image. 1. Click on the Insert external image icon. 2. The dialog box appears. 3. Enter the URL of the image and click. Figure 59--Insert external image dialog box Insert Header To insert a header follow these steps: 1. Select the paragraph(s) you want to convert to a header. 2. Place the cursor in the paragraph where you want to convert to a header. 3. Click and a dropdown list appears. Choose header from the dropdown list. 4. Select type of header (H1-H6) to create the header, or select p or blank if you want to convert to an ordinary paragraph. 74

45 Links, continued Insert Links There are two ways to identify links in your articles. A link can be created during the entry of your article. A link can also be retrieved from the Link archive. To insert a link or a jump to other WWW documents during the creating or editing of an article follow these steps: 1. Place the cursor in the text where you want to insert a link. 2. Now, place the cursor over the link insert icon on the text editing toolbar located with the region of text you re in. For example, if you are entering text in Lead text, choose the link insert icon associated with that region. Click on the icon. Figure 60--Insert link dialog box 3. Enter in the link information. Note that the Link text is the identifying text that will appear in the article. Click. 4. You can click on Preview at any time during the creation of your article to get an advance view of what it will look like. Articles 75

46 Links, continued Insert Links, cont. A link can also be retrieved from the Link archive. For a quick summary on how to retrieve a link from the Link archive follow these steps. Figure 61--Step 1. Click on the attach links button in the lower region of your edit article screen. 76

47 Links, continued Insert Links, cont. Figure 62 Find options present to you. There are several options available, Enter the unique ID of a link and press the button In Search Word Type in a word or part of the link text in the Search for: and press the button. The asterisk may be used as a wildcard character. For example, al*, instances of links with the words REAL ESTATE, FOOTBALL, ROYALTY OR REALITY in the link text field or Set date-specific date interval From: Date-specified searches links that have been created from this date. To: Date-specified searches links that have been created up to and including this date. You have quick access to dates using the calendar view. The date first shown is read using the PC's local date. Empty calendar clears the date fields 1 = today 2 = past two days 7 = past week 30 = past month Figure 63--Calendar definition and press the button Articles 77

48 Chapter 3 Objects Definition Image Upload In addition to text, an article consists of images, external links, links to other articles, pictures, etc. These are referred to as objects. Examples of additional objects are media files such as word documents, spreadsheets, PDFs, film clips and more persons, as in authors added to an article topics When you create an image upload you are introducing an existing image to your database. Figure 65--From Home page, click on the OBJECTS link in the Menu bar. Objects 80

49 Image Upload, continued From Create New panel Figure 66--On the right-hand Create new panel click on Image and the following image displays, or, Figure 67--Upload a new image editor Objects 81

50 Image Upload, continued From Search archive From Home page click on the OBJECTS link in the Menu bar, See Figure 65. Figure 68--Click on the downward arrow in the Search panel, select Image and click on Search. Figure 69-- Upload image from within Image archive. Click on Image archive. 82

51 Image Upload, continued Either of these instances for uploading an image will produce the dialog box in the next figure. Figure 70--Upload a new image dialogue box Objects 83

52 Image Upload, continued Choose file Click on the browse button. The choose file dialog box will display. Locate the image in your database. Highlight the object and click on Open. Figure 71--Choose file dialog box 1. Click on the downward arrow in catalogs and choose the catalog the image is to be placed in. 2. Press to store the picture to the Escenic Web Studio. The image will be assigned an ID and is ready for use in the system. 84

53 Image Upload, continued Image Details Figure 72--System generated details box and definitions Image Icon Catalog Name Description Alt. Text Copyright State Original Image name and size in pixels. This name is used during search. Images listed in order with descriptive details. Image name and size in pixels. This name is used during search. A statement that gives more information. Text that displays when the mouse is held over the image and used to read aloud for blind and partially sighted. Copyright text. An image is either published or in create mode. The original version of the image. Generate Version Image versions were generated and display these along with a name and a dropdown box indicating their size and placement. New versions will have an incrementing prefix for easy access. Red X's mean that the version can be deleted by pressing the X. Objects 85

54 Image Upload, continued Image Details, cont. Figure 73--System data box and definitions ID Publish date Last modified Unique ID of the image Date of last publication Date of last modification Save Close The SAVE button will save any new input and/or modifications to the image. The screen remains open for additional work, if required. The CLOSE button only closes the opened image. Modifications made are not saved with the CLOSE option. The CLOSE button only closes the opened image. Modifications made are not saved with the CLOSE option. 86

55 Image Upload, continued Image Details, cont. IPTC tags Figure 74-IPTC IPTC is a standard of information contained in images and Escenic is developed with this standard. Any or all of these items can be added to and are stored in the database. When the author is satisfied with the information concerning the image it is ready to be saved or Published. Photographer Author Category Supplemental Category City Province/State Country code Country Location Credit Local Caption Objects 87

56 Image Upload, continued Image Details, cont. Usage Tab The Usage Tab indicates where the image is visible. In this example our image is visible in two articles and has the article state icon meaning published. The ID of the article the image is visible in and the name of the publication are also displayed. Click the article title to view the article in the preview window. Figure 75-Image Usage tab The Usage tab shows in which article(s) the image is used. 88

57 Multimedia Upload When you create a multimedia upload you are introducing an existing piece of multimedia to your database. Figure 76--From Home page, click on the objects link in the Menu bar. Objects 89

58 Multimedia Upload, continued From Create New panel Figure 77--On the right-hand Create new panel click on Multimedia to produce the following image. Figure 78--Upload a new multimedia file 90

59 Multimedia Upload, continued From Search archive From Home page, click on the OBJECTS link in the Menu bar. Figure 79--Click on the downward arrow in the Search panel, select Multimedia and click on Search. Figure 80--Resulting Upload a new multimedia file dialog box In practice almost all file types can be uploaded in the Escenic Web Studio s Multimedia archive. A small sample of these files are:.doc,.dot.xls.gif,.jpeg,.jpg.pdf,.txt.zip,.wav,.avi Objects 91

60 Multimedia Upload, continued Figure 81--Choose file dialogue box 1. Click on the Browse button. The Choose file dialogue box displays. 2. Navigate until you find the multimedia file you are searching for. Click on Open. 3. Note that the address for this multimedia file is now placed in the File: locator. Our example is AVI. 4. Click on the downward arrow in catalog and choose in which catalog the multimedia file is to be placed. 5. Press the UPLOAD button and the multimedia file is saved on the Escenic system displaying the Edit multimedia box for characteristics descriptions. Figure 82--Example of an upload of an AVI multimedia file 92

61 Multimedia Upload, continued 6. Notice on the right-hand side of your multimedia book, the file has been assigned a unique ID and is now available to use. Figure 83--System generated details box and definitions Multimedia icon Catalog Name Description Location Copyright Alt. Text Author State Original Multimedia name. This name is used during search. Multimedia listed in order with descriptive details. Multimedia name. This name is used during search. A statement that gives more information. Placement location Copyright text. Text that displays when the mouse is held over the image. Author of merit. Multimedia is either published or in create mode. The original version of the multimedia file. Objects 93

62 Multimedia Upload, continued Usage Tab The Usage Tab indicates where the multimedia object is visible. In this example our image is visible in one article and has the article state icon published. The ID of the article the image is visible in and the name of the publication are also displayed. Click the article title to view the article in the preview window. Figure 84--Usage information 94

63 Link Upload When you create a link upload you are introducing a link to your database. Figure 85--From Home page, click on the Objects links in the Menu bar Objects 95

64 How to Edit Text, con ntinued Working with Tables Why a table Create a table You can create tables to display information or enhance narratives within an article. 1. Click the location in your text where you want a table to appear. 2. Press the table icon on the toolbar. 3. Select how many rows and columns you want by holding down the left mouse button as you move the mouse to highlight the number of rows and columns you want the table to contain. Click and the table appears in your text. Edit table size Delete a Table The steps to inserting a new row in a table. 1. Right-click a cell in the row where you want to insert a row. 2. Select insert before or insert after to nserting a row before or after the row where you have placed the cursor. To delete a table. select the rows to delete and press delete or backspace or right-click on a cell in the table and select delete table or delete row 68

65 Chapter 4 Sections What is a Section Definition Section pages are front and sub-pages of the front page. Examples of sections might be sport, local news or culture and these section pages may also have sub-pages. The web desk and the inbox lay inside the Section-page. Articles can be placed in one or more sections. The purpose of Section-pages is to desk articles that will be presented on a section-page or an internet page. Sample Structure of a Section page The section structure than becomes the navigational menu structure of the site. Figure 104--Section page sample structure Note: The Escenic system includes access control, allowing the editor to assign roles, such as restricting users from editing certain sections. The Editor, as a user, can have access to one or more Section pages. The Editor s role comprises of receiving, finding and approving articles to publish on a Section page. Section editor implies Journalist. Sections 107

66 Section page Layout Definition Section page layouts in Escenic Web Studio are presented in the same style, that is, you will always be presented with an Inbox and a Web desk. What they consist of and their individual naming structures are client-specific. Please note that when an editor opens a Section page, it is locked and unavailable for other editors to use. When an editor is done with the Section page it is important that the Section page is closed. The examples given here are based on a sample column template entitled SIMPLE DEMO 1. Figure 105--Sample Section page layout 108

67 Section page Layout, continued Layout Details Section detail using Figure 96 Front page and the section icon informed where you are keep you Section ID The Section ID is the number assigned that uniquely identifies the section Section Name The name of the section in our example is SPORT and this is the name that is used externally on the web site Source The source is the name of supplier of any imported information or data Source ID The source ID is the unique ID of the article from the supplier s program Sample Inbox The Inbox is a holding cell for articles awaiting the editor s decisions about when and where these will go on the internet. Arrowhead The arrowhead is used as an identifier to move articles from the Inbox to any one of the layouts on the Web desk below Select box Mark the select box and press the arrowhead in the article group where you want the article to be moved Article state The article has different article states at different times during the workflow; draft, submitted, approved, deleted and published, but only published article are shown on the internet, represented by this icon Title Click on the article title and you are taken to the Article editor for possible further revisions. Click and you are returned to the Section editor View article Click on and you will see the article and it looks in the Preview window Sections 109

68 Section page Layout, continued Layout Details, cont. Sample Inbox, cont. Remove Find articles Figure 106--Top half of Sample Front page with Column template highlighted To remove one or more articles from the Inbox mark the select box and press the word Remove. Click on Find articles and you are transported to Article archives where you can, for example, create an article search. When you find the article(s) you want to add to the Inbox, mark the select box marked as to the Section page where you started. and click on the button. You are returned 110

69 Section page Layout, continued Layout Details, cont. Column template The Column Template is responsible for the content layout, for example, whether the page uses a 2- or 3-column layout. The column template defines a grid with slots where stories can be placed. Remember that templates are client-specific. Our sample shows SIMPLE DEMO 1 which presents three areas where articles are placed. TOPSTORY LEFT RIGHT Figure 107--Sample column template For example, changing the column template plays a part in the look of how articles are presented. Sections 111

70 Section page Layout, continued Layout Details, cont. Column template, cont. Figure 108--Column template pull down and highlight of another template Figure 109--A column template change could alter content layout to look like this. 112

71 Section page Layout, continued Layout Details, cont. Sample web desk Figure 110--Web desk illustration Article group Name The Article group names are a collection of articles that present in the same area or same fashion. Our sample collective Article groups are: TOPSTORY LEFT RIGHT Remember that templates are client-specific. Our sample shows SIMPLE DEMO 1 which presents three areas where articles are placed. Sections 113

72 Section page Layou ut, continued Layout Details, cont. Sample web desk, cont. Arrowhead The arrowhead is used as an identifier to move articles from the Inbox to any one of the layouts on the Web desk below and for returning an article on the Web desk back to the Inbox Select box Mark the select box and press the arrowhead in another article group where you want the article to be moved Article state The article has different article states at different times during the workflow; draft, submitted, approved, deleted and published, but only published article are shown on the internet Title Click on the article title and you are taken to the Article editor for possible further revisions. Click and you are returned to the Section editor Time control-- The dates and times shown control when the article is visible on the web site for this Section page only. This time control does not affect the same article on another Section page No icon indicates that the time control does not exist on this article and the article is active Green arrow indicates that time control exists on this article and date(s) and/or time(s) have not yet expired One red arrow indicates that time control exists and the article is waiting for the date(s) to become active Two red-arrows indicate that time control exists and based on the date(s) and/or time(s) the article is waiting to be shown Red X indicates that the article has expired Note: It is possible to Time control the article itself by editing the article s time control in the Article editor. Please refer to page 41 Time control of the article. 114

73 Section page Layout, continued Layout Details, cont. Sample web desk, cont. To place time control, cont. From date/time, click on From and a calendar displays. 1. Using the arrows at the top, click on arrow until the month displays. 2. Click on a date. 3. Enter a time in the time boxes. 4. Click OK to confirm. The confirmation will display in the form of date and time and corresponding time control indicator arrows. To date/time, click on To and a calendar displays. 5. Using the arrows at the top, click on arrow until the month displays. 6. Click on a date. 7. Enter a time in the time boxes. 8. Click OK to confirm. The confirmation will display in the form of date and time and corresponding time control indicator arrows. Sections 115

74 Section page Layou ut, continued Layout Details, cont. To place time control, c cont. Figure 111--Example of Time control indicator arrows on a section page. Figure 112--Example of Time control indicator arrows after time passes. No icon indicates that the time control does not exist on this article and the article is active. Green arrow indicates that time control exists on this article and date(s) and/or time(s) have not yet expired. One red arrow indicates that time control exists and the article is waiting for the date(s) to become active. Two red-arrows indicate that time control exists and based on the date(s) and/or time(s) the article is waiting to be shown. Red X indicates that the article has expired. 116

75 Section page Layout, continued Layout Details, cont. Sample web desk, cont. Element template - A Section page is comprised of sets of articles. The presentation of the article on the Section page is only a portion of the article usually with a title and lead text. Changing the Element template and previewing the article show different ways of presenting a portion of the article on the Section page. Preview Click on View article and you will get a view of what the article will look like on the Section page. Figure 113--Sample element template location on Section page Sections 117

76 Section page Layout, continued Layout Details, cont. Sample web desk, cont. Changing the Element template alters the layout of the article on the Section page. The Element templates available may vary between Article groups and article slots. The Element template displays a single story in the slots from the column template. There can be several different element templates on a single front page, at most one for each slot in the grid. The element template can be used on several stories on the page. These templates can change the font size of the title, change what the picture is linked to or which text fields are to be shown, for example, teaser text. Remember that templates are client-specific. Figure 114--Element template user places article Figure 115 Figure shows a different element template that now permits pictures or links. 118

77 Section page Layout, continued Layout Details, cont. Sample Inbox, cont. Publish Preview The Publish button along side of the Inbox publishes any changes that you make to the section. For example, realign an article from one area of the section page to another or move an article from TOPSTORY to RIGHT, you must click the button to acknowledge and save changes. The Preview button allows you to look at changes made to the section, for example, changes made by selecting a different column template or the changes made in the order of articles. Published selected articles Figure 116--Sample Web desk with intent to publish an article by selecting article The button at the bottom of the Section page in conjunction with a selected article(s) will amend the article state to that of Published. Sections 119

78 Section page Layout, continued Layout Details, cont. Section lock Please note that when an editor opens a Section page, it is locked and unavailable for other editors to use. When an editor is done with the Section page it is important that the Section page is closed. Figure 117--How others see that a section is locked 120

79 Steps to place articles on the Internet Definition The steps that follow are to assist an editor in placing articles on the internet. It is assumed that user roles are in place and correct for the editor to accomplish this. Articles that have not been assigned the state published will not be shown on the web. To change the state of the article without having to open it, select the article via the checkbox and use the button. All selected articles will be change to published. Step 1 From Home page From the Home page click on the Sections link on the Menu bar. Figure 118--From Home page click on the Sections link Sections 121