Using this tutorial, you will create a Web page for a fictional foundation. The tutorial is divided into the following parts:

Transcription

1

2

3 Extend Tutorial

4 Copyright Copyright 2005 ACS Technologies Group, Inc. All rights reserved. Reproduction of any part of this publication by mechanical or electronic means, including facsimile transmission and , without the express permission of ACS Technologies Group, Inc. is strictly prohibited.

5 Welcome! This tutorial is designed to teach you how to use the Extend Platform to create rich articles that include images, forms, and hyperlinks and how to publish those articles on your Web site. Since Extend is a Web content management system, some of the concepts and procedures are different from traditional Web site design and development. Using this tutorial, you will create a Web page for a fictional foundation. The tutorial is divided into the following parts: Creating Content Adding Images to Articles Adding Forms to Articles Adding Hyperlinks to Articles Creating Channels Adding Content Items to Channels Customizing Display Options Once you complete this tutorial, you will have worked with the main components of Extend to create the following Web page: 1

6 Extend Tutorial Before You Begin Three of the articles that you create in this tutorial contain images. Before you begin the tutorial, you must download these images to your hard drive. While completing the tutorial, you will upload the images to Extend and add them to the articles. To download the tutorial images to your hard drive 1. Open your Web browser and go to 2. Click Self-Paced Tutorial. 3. Click Download Tutorial Images. 4. Click Save. Save the file to your desktop. 5. Double-click the file to open it. To extract the files, click Run. This creates a folder on your desktop named Extend Tutorial Images. This folder contains the images that you use in the tutorial. 2

7 Software Recommendations ACS Technologies recommends that you use Internet Explorer 5.5 or later. Role Requirements With this tutorial, you can learn the basics of creating and publishing content in Extend. If you are a site administrator, you can complete the entire tutorial. If you use the Workflow feature, you must be assigned the following user roles to complete the entire tutorial: Content Creator Content Editor Content Approver Channel Administrator If you are not assigned all of the roles, you can complete portions of the tutorial. ACS Technologies recommends the following strategy: A content creator completes all exercises in Parts 1 4 and approves content at the content creator level. A content editor approves all the content created in Parts 1 4. A content approver approves all the content created in Parts 1 4. A channel administrator completes all exercises in Parts

8 Extend Tutorial 4

9 Part 1: Creating Content Creating content in Extend is different from creating Web pages using traditional HTML-authoring tools. When you use an HTML editor, you create complete Web pages. When you create content in Extend, however, you create articles that you can add to Web pages. In Part 1 of this tutorial, you will: Sign in to Extend Create an article Preview an article Save a draft of an article Exercise 1.1: Signing In to Extend Before you can work in Extend, you must sign in on the Extend Administration page. You can access the sign in page from a link on the bottom of your Web site home page or from your site administrator. In this exercise, you will learn how to sign in to Extend. To sign in to Extend 1. At the bottom of your organization Web site, click the Admin link. 5

10 Extend Tutorial If the Admin link does not display on your home page, check another page on your Web site. If you cannot find the link, check with your site administrator. Note Your Web site can display differently from the images in this tutorial. 2. In the Username and Password fields, enter your sign in information. You can get your username and password from your site administrator. 3. Click Login. 4. Once Extend verifies your sign in information, the Dashboard displays. On this page, you can access shortcuts to frequently used areas in Extend. When the Dashboard displays, you have successfully signed in to Extend. In the next exercise, you will learn how to create an article. Exercise 1.2: Creating an Article In Extend, articles are the primary form of content. They can contain the following components: Title Heading Mini abstract Full abstract Body Images 6

11 Creating Content Hyperlinks Forms When you publish articles on your Web site, you can customize the display options for each article. You can publish an article in multiple areas and set up unique display options for each content area. You will learn how to customize display options later in this tutorial. In this exercise, you will create an article using the built-in HTML editor. Later in this tutorial, you will learn how to add components to the articles that you create in this chapter. In this exercise, you will learn how to: Create an article Use the HTML editor To create an article 1. On the Site menu, click Content Manager. The Content Manager page displays. On this page, you can manage the content items in your Extend system. This page displays all pieces of content that were created by members of your organization. If anyone at your organization has worked in Extend, content can display in the Content Manager. 2. Under Actions, click Create New Article. The Create Article page displays. At the top of the page, six tabs display. For this exercise, you will work on the Attributes tab. You will learn how to use other tabs later during this tutorial. On the Attributes tab, you can enter general information about the article as well as the body text for the article. If you do not know HTML, you can enter the body text in the HTML editor. You will learn how to use the HTML editor later in this exercise. 3. When you create an article, you can enter a heading for it. The heading identifies the topic of the article. For example, you create an article about a movie. In the Heading field, you can type Movie Review. In the Heading field, type the following: Message 7

12 Extend Tutorial 4. In the Title field, you can enter the title of the article. This is the only required field on the Attributes tab. By default, untitled displays in the Title field. If you do not enter a new title, this becomes the article title. In the Title field, type the following: From the Director 5. In the Author field, you can enter the name of the person who wrote the article. In the Author field, type the following: James Gordon 6. In the Position field, you can enter the author s position in your organization. In the Position field, type the following: Executive Director 7. In the Mini Abstract text box, you can enter a short description of the article. Mini abstracts act as teaser sentences. They are similar to subheadings in newspaper articles. Extend displays mini abstracts as article descriptions in search results. In the Mini Abstract text box, type the following: A message from James Gordon 8

13 Creating Content 8. In the Full Abstract text box, you can enter a brief summary of the article. The full abstract is usually no longer than one paragraph. Click the Full Abstract tab. The Full Abstract text box displays. 9. In the Full Abstract text box, type the following: Thank you for visiting our Web site and showing interest in the new youth center. We are making progress and plan to break ground soon. Note If you view this tutorial in Adobe Reader, you can copy and paste text using the Select Text tool. For more information, see the Adobe Reader documentation. 9

14 Extend Tutorial 10. In the Body text box, you can enter the main text of the article. You do not need to know HTML. Using the toolbar, you can format the body text. In the Body text box, type the following: Thank you for visiting our Web site and showing interest in the new youth center. We are making progress and plan to break ground soon. As director of the Youth Foundation, I can say that everyone here is very excited about the youth center. We believe it will be a place where disadvantaged and at-risk youth in our community will be exposed to positive role models and a safe atmosphere that will help them reach their full potential. The youth center will be an asset to the community, but we need your help. The center will be paid for entirely by private contributions. I encourage you to make a donation to this important addition to our community, even if it's only a few dollars. These kids need our help! Sincerely, James Gordon Executive Director, Metropolitan Youth Foundation Once you enter the article information and body text, you can save the article. In the next exercise, you will learn how to preview and save a draft of the article. Exercise 1.3: Previewing and Saving a Draft of an Article Once you create an article, you can preview your work before saving it. When you preview an article, all publishable information for the article displays. Because you can customize the display options when you publish the article, the preview does not necessarily reflect the final view of the article. When you save a content item, the save options that display depend on your Extend settings. The following list provides information about the save options: Save as Draft Click to save content that is not ready for approval or publishing. Save as Update Click to save updates to previously approved content items without approving the updates. Save & Approve Click to save and approve the content item in one step. Save Click to save the content item and approve it at the appropriate levels. In this exercise, you will: Preview the article Save a draft of the article 10

15 Creating Content To preview and save the article 1. On the Create New Content page, click the Preview tab. The article preview displays. Note When you navigate between tabs on the Create Article page, do not save your work. 11

16 Extend Tutorial 2. Once you preview the article, you can save a draft of it. At the bottom of the page, click Save as Draft. The Content Manager displays. When you want to edit the draft of the article, you can access it on the Content Manager page. You successfully created an article in Extend. Later in the tutorial, you will learn how to add components to an article and how to publish them on channel pages. This is the end of Part 1 of the Extend tutorial. In Part 2, you will learn how to add images to articles. 12

17 Part 2: Adding Images to Articles With Extend, you can add images to your articles and display them on your Web site. Adding images to your Web site can attract attention to particular articles and enhance the visual quality of your Web site. In Extend, you can upload four types of images small, medium, large, and custom. The following table provides information about the four image classes: Class Small Medium Large Custom Size Less than 100 pixels 101 to 150 pixels 151 to 200 pixels Greater than 200 pixels You can use the small, medium, and large image classes as teaser images in your articles. When you publish an article, you can customize the image display options. You can insert custom images into the body of an article. In Part 2 of this tutorial, you will: Edit an existing article Upload images to Extend Add captions and alternate text to images Create image classes Add teaser images to an article Insert a custom image into the body of an article Preview an article Save and approve an article Exercise 2.1: Opening an Existing Article In this exercise, you will add images to an article that you created in the previous chapter. Before you can add images to it, you must open the article. You can access saved articles on the Content Manager. To open an existing article 1. On the Site menu, click Content Manager. The Content Manager page displays. 2. In the list of content items, select the article titled From the Director. Under Actions, click Edit Content Item. 13

18 Extend Tutorial The Edit Article page displays. You successfully opened an existing article. In the next exercise, you will learn how to upload images to Extend. Exercise 2.2: Uploading and Adding Images to Articles Before you can add images to an article, you must upload the images to Extend. Using the images that you downloaded from the Extend Platform Web site, you will upload images to Extend. When you upload the images, you will automatically create small, medium, and large image classes. When you upload images, you can also enter captions and alternate text for them. Captions display below images on your Web site. Alternate text displays when a user moves the mouse over an image. Alternate text can also be read by screen reader software, which is used by individuals with impaired vision. Alternate text is often referred to as the alt tag. When you add captions and alternate text to images, you can use different text for each. For this tutorial, use the same text for captions and alternate text. To upload images to Extend 1. At the top of the page, click the Images tab. The Images tab displays. Because you have not added any images to this article, no images display on the page. 2. On the Images tab, click Upload New Image. 14

19 Adding Images to Articles 3. On the Upload Media page, click Browse. The Choose file dialog box displays. 4. In the Look in drop-down list, select Desktop and open the Extend Tutorial Images folder. 5. Select tutorial-director.jpg and click Open. On the Upload Media tab, note that the Media File, Name, and Alternate Text fields display information about the image. 6. When you upload an image, you must enter alternate text for it. You can also enter a caption for the image. In the Alternate Text and Caption fields, type the following: James Gordon 7. Extend can automatically create smaller versions of images that you upload. At the bottom of the page, select the Automatically create image classes option. 8. Click Save. 15

20 Extend Tutorial When the image uploads, the Images tab displays the three image classes. The alternate text and captions that you entered when you uploaded the images apply to all of the image classes. You can change the alternate text and captions in the Media Manager. You successfully uploaded and added the images to the article. In the next exercise, you will learn how to preview and save the article. Exercise 2.3: Previewing and Saving the Article Before you save the changes that you made to the article, you can preview them. In this exercise, you will learn how to preview and save the article. The Preview page displays all publishable content except image captions and alternate text. You can customize the display options for the article when you publish it. To preview and save the article 1. At the top of the Edit Article page, click the Preview tab. The Preview page displays. Since you added teaser images to the article, they display at the bottom of the article preview. When you publish articles, you can select the teaser image class that you want to display. 2. Once you preview the article, you can save and approve it. If you are a site or network administrator, click Save & Approve. If you are not an administrator, click Save. 16

21 Adding Images to Articles If you click Save, the Approve tab displays. For each available user role, select Approved and then click Save. You successfully previewed and saved the article. In the next exercise, you will learn how to insert an image in the body of an article. Exercise 2.4: Inserting an Image in the Article Body Using the HTML editor, you can insert images into the body of an article. Although you cannot use images wider than 200 pixels as teaser images, you can insert them into the body of an article. You can also insert other image classes and media types into the body of an article. In this exercise, you will create an article and insert an image in the article body. To create an article 1. On the Site menu, click Content Manager. 2. Under Actions, click Create New Article. 3. In the Heading field, type the following: Fund Raising Dinner 4. In the Title field, type the following: Artist s Rendition of New Building Unveiled 5. In the Mini Abstract text box, type the following: $40,000 Raised for the New Youth Center at Fund Raising Dinner! 6. Click the Full Abstract tab. In the Full Abstract text box, type the following: At a fund raising dinner on March 3, the Metropolitan Youth Foundation raised $40,000 for the new Youth Center. The highlight of the evening was the unveiling of an artist s rendition of the new building. 7. In the Body text box, type the following: An artist s rendition of the new youth center was unveiled at a fund-raising dinner last week. Over 300 people attended the event. In addition to the $30,000 raised at the $100 per plate event, Jack Gibson, president and CEO of Comstock Software, 17

22 Extend Tutorial presented James Gordon with a check for $10,000. James Gordon is the executive director of the Metropolitan Youth Foundation. In addition to showing the new building for the first time, Jonathan Bunyan and Dan Alighieri delighted the audience with tales from their recent journeys. Jonathan described his travels as almost mystical. Dan said that although he saw some shocking images in his travels, he believes they made him a better person. All of the money raised will go toward the new building. The Metropolitan Youth Foundation hopes to break ground soon. The building will be entirely paid for with contributions from individuals and businesses in the community. 8. Before you can insert an image in the article body, you must upload the image. Click the Images tab. 9. On the Images tab, click Upload New Image. 10. Click Browse. 11. In the Look in drop-down list, select Desktop and open the Extend Tutorial Images folder. 12. Select tutorial-building.jpg and click Open. 13. Click Save. To insert an image into the body of an article 1. Click the Attributes tab. 2. To insert an image in the body of an article, you must work in the HTML editor. Click the Launch Full Editor button. 3. To make room for the image, insert a blank paragraph between the first and second paragraphs. To do this, place the insertion point at the end of the first paragraph and press ENTER twice. A blank line is inserted between the first and second paragraphs. 4. Click the Insert Image button. 18

23 Adding Images to Articles 5. In the Image Properties dialog box, click Media Manager. 6. Select tutorial-building and click Submit. 7. Click OK. 8. Select the image. 9. In the toolbar, click the Center Justify button. 19

24 Extend Tutorial 10. Once you preview the article, you can save and approve it. Depending on your settings, different save options display. If you are a site or network administrator, click Save & Approve. If you are not an administrator, click Save. If you click Save, the Approve tab displays. For each available user role, select Approved and then click Save. Once you save and approve the article, the Content Manager displays. You successfully added teaser images and custom images to articles. In Part 3 of this tutorial, you will learn how to add an interactive form to an article. 20

25 Part 3: Adding Forms to Articles Interactive forms let your Web site visitors submit information to your organization online. For example, visitors can provide feedback about your Web site, submit prayer requests, or request additional information. You can add an interactive form to any article without knowing HTML or scripting languages. In Part 3 of this tutorial, you will: Create an article Use the HTML editor Create and customize a form Save and approve the article Exercise 3.1: Creating an Article In this exercise, you will create an article that you will use during this part of the tutorial. For more information on the Attributes tab, see Part 1, Creating Content. Once you create the article, you will learn how to add an interactive form to it. To create an article 1. On the Site menu, click Content Manager. 2. Under Actions, click Create New Article. 3. In the Heading field, type the following: Volunteer Now! 4. In the Title field, type the following: How Can I Help? 5. In the Mini Abstract text box, type the following: Volunteer and make a difference! 6. Click the Full Abstract tab. In the Full Abstract text box, type the following: The Metropolitan Youth Foundation needs your help. If you want to volunteer your time or make a donation, simply fill out the online form, and we will contact you. 21

26 Extend Tutorial 7. In the Body text box, type the following: Thank you for your interest in supporting the Metropolitan Youth Foundation. Through your efforts and the efforts of other volunteers, we can truly make a difference in the lives of our community s youth. Please complete and submit the following form, and we will contact you. 8. Click Save as Draft. You successfully created an article. In the next exercise, you will learn how to add an interactive form to it. Exercise 3.2: Creating an Interactive Form In this exercise, you will add an interactive form to the article that you created in the previous exercise. In this exercise, you will: Create a form Include standard fields on the form Include custom questions on the form Customize options for each field and question To create a form 1. In the Content Manager, select the article titled How Can I Help?. 2. Under Actions, click Edit Content Item. 3. At the top of the page, click the Form tab. 4. In the Form Name field, you can enter an internal name for the form. The form name does not display on your Web site. In the Form Name field, type the following text: Volunteer Form 5. In the Mail To field, enter the address where the interactive form responses are sent. To send responses to multiple addresses, separate each address with a semi-colon. In the Mail To field, enter your address. 6. In the Subject field, you can enter the subject line for the interactive form response s. When you receive an response for the form, the text you enter in this field displays as the subject. In the Subject field, type the following: I Want to Help 22

27 Adding Forms to Articles You successfully created an article with an interactive form. In the next exercise, you will learn how to include standard fields on the form. Exercise 3.3: Including Standard Fields In the Standard Fields section, Extend provides some common fields that you can include on your form. Using the Include and Required options for each field, you can select which fields you want to include in your form. If you select the Required option for a field, users must submit the information on the form. To include standard fields 1. On the Form tab, click Customize. The Add Form page displays. 2. Under Form Colors and Title Colors, you can customize the form colors. For this exercise, use the default settings. 3. On this form, you will ask users to submit their first and last names. Under the First Name Last Name option, select Include. First Name and Last Name fields will display on the form. 4. You can also require fields on the form. Under the First Name Last Name option, select Required. If you select the Required option, users must submit their first and last names on the form. When users submit this form, they must include their first and last names. 5. If you want to view the addresses of users who submit a form, include and require the field. If you include the field, the user s address displays in the From field of the form response . Under the option, select Include and Required. Because you selected Required, users must submit their addresses on the form. 6. You do not have to require fields. On the form, you will create address fields that are optional. Under the Address Line 1 & 2 and City/Town, State, Zip option, select Include. When users complete the form, users can enter their address information. Because you did not select Required, however, they can leave the fields blank. You successfully added standard fields to your form. In the next exercise, you will learn how to create custom text box questions for the form. 23

28 Extend Tutorial Exercise 3.4: Creating Text Field Questions In addition to using the standard fields, you can add custom questions to your form. You can create the following types of questions: Text field Checkbox Drop-down list Radio button In this exercise, you will: Create a text field question Include the custom question on the form To create a text field question 1. Under Custom Fields, click Add Custom Field. The custom question fields display. 2. In this exercise, you will learn how to create Text questions. Text fields let users enter up to 255 characters and are commonly used for questions that require short answers. In the Type drop-down list, select Text. 3. In the Prompt field, enter the question that you want users to answer. Type the following: When is the best time to contact you? 4. The Choices field is used with checkbox questions, drop-down lists, and radio button questions only. For this exercise, leave the Choices field blank. 5. Beside the custom question that you created, select both Include and Required. 24

29 Adding Forms to Articles You successfully added a Text field question to the form. In the next exercise, you will learn how to create a custom memo question. Exercise 3.5: Creating Custom Memo Questions With memo questions, users can enter an unlimited amount of text. They are commonly used for questions that require long answers. In this exercise, you will: Create a custom memo question Include the custom question on the form To create a custom memo question 1. On the Add Form page, click Add Custom Field. 2. In the Type drop-down list, select Memo. 3. In the Prompt field, type the following: Please list your areas of interest. 4. Beside the custom question, select Include. 25

30 Extend Tutorial You successfully added a custom memo question to your form. In the next exercise, you will learn how to create a custom radio button question. Exercise 3.6: Creating Radio Button Questions Radio button questions provide a list of answer choices. From the list, users must select only one item. Radio button questions are commonly used when you want to limit answer choices. For example, if a question requires a yes or no answer, use a radio button question. In this exercise, you will: Create a radio button question Include the custom question on the form To create a radio button question 1. On the Add Form page, click Add Custom Field. 2. In the Type drop-down list, select Radio button. 3. In the Prompt field, type the following question: Do you have experience working with youth? 4. When you create custom radio button, checkbox, and drop-down list fields, you must provide answer choices. You must separate each answer choice with a semi-colon. In the Choices field, type the following: Yes;No Note Do not include a space after the semi-colon. If you do, the answer choices do not align correctly. 5. Beside the radio button question that you created, select Include and Required. 26

31 Adding Forms to Articles You successfully added a custom radio button question to the form. In the next exercise, you will learn how to create a custom checkbox question. Exercise 3.7: Creating Custom Checkbox Questions Checkbox questions provide a list of answer choices. From the list of answer choices, users can select multiple items. In this exercise, you will: Create a checkbox question Include the custom question on the form To create a checkbox question 1. On the Add Form page, click Add Custom Field. 2. In the Type drop-down list, make sure Checkbox is selected. 3. In the Prompt field, type the following: How do you want to help? 4. In the Choices field, type following answer choices: Mentor;Coach a Team;Help with Fund Raising;Make a Donation 5. Beside the custom checkbox question that you created, select Include. You successfully added a custom checkbox question to your form. In the next exercise, you will preview the form and save the article. Exercise 3.8: Saving the Form and Article Once you add your questions, you must save the form to add it to the article. You must also save the article. 27

32 Extend Tutorial In this exercise, you will: Save the form Save the article To save the form and article 1. At the bottom of the Add Form page, click Save. The following information displays on the Form tab: Form name Form type Subject address 2. Once you preview the article, you can save and approve it. If you are a site or network administrator, click Save & Approve. If you are not an administrator, click Save. If you click Save, the Approve tab displays. For each available user role, select Approved and then click Save. You successfully created an interactive form and added it to an article. In Part 4, you will learn how to add a hyperlinks list to an article. 28

33 Part 4: Adding Hyperlinks to Articles With Extend, you can add lists of hyperlinks to articles. Hyperlinks lists display at the end of articles. To create a hyperlinks list, you do not need to know HTML. In Part 4 of this tutorial, you will: Create an article Use the HTML editor Add a list of hyperlinks to an article Save and approve the article Exercise 4.1: Creating an Article In this exercise, you will create an article that you will use during this part of the tutorial. Once you create the article, you will add a hyperlinks list to it. In this exercise, you will: Create a new article Use the HTML editor Save a draft of the article To create an article 1. Under Actions, click Create New Article. 2. In the Heading field, type the following: Progress 3. In the Title field, type the following: Track Our Progress 4. In the Mini Abstract text box, type the following: We re getting closer! 5. Click the Full Abstract tab. In the Full Abstract text box, type the following: We are well on our way to reaching our goal of $1,500,000 to fund the new youth center. To date, we have raised slightly more than $1,000,

34 Extend Tutorial 6. Click the Launch HTML Editor button. In the HTML editor, type the following: We are well on our way to reaching our goal of $1,500,000 to fund the new youth center. To date, we have raised slightly more than $1,000,000. Although we have raised a significant portion of the funding needed to break ground, we still need your help. To learn more, click the following links. 7. In the HTML editor, click Save. 8. Click the Images tab. 9. On the Images tab, click Upload New Image. 10. On the Upload Media page, click Browse. The Choose file dialog box displays. 11. In the Look in drop-down list, select Desktop and open the Extend Tutorial Images folder. 12. Select tutorial-thermometor.gif and click Open. 13. On the Upload Media page, click Save. The image uploads and is added to the article. 14. At the bottom of the Create Article page, click Save as Draft. You successfully created an article. In the next exercise, you will learn how to add a list of hyperlinks to an article. Exercise 4.2: Adding a Hyperlinks List to an Article In Extend, you can add a list of hyperlinks to related articles. The list displays at the end of the content item. You can create hyperlinks to the following items: Articles Clipboard Channels Media External Web sites addresses In this exercise, you will create hyperlinks to other articles. 30

35 Adding Hyperlinks to Articles To add a list of hyperlinks 1. On the Content Manager, open the article titled Track Our Progress. 2. At the top of the Edit Article page, click the Links tab. 3. Click the Add button. The Add Link page displays. 4. On the Content tab, select the article titled From the Director. 5. In the Display Text field, you must enter the hyperlink text. Type the following: From the Director 6. In the Description field, you can enter a description of the link. Type the following: A message from James Gordon 31

36 Extend Tutorial 7. Click Submit. The hyperlink displays in the Links list. 8. You can add multiple hyperlinks to the list. To add another link, click the Add button. 9. On the Content tab, select the article titled Artist s Rendition of New Building Unveiled. 32

37 Adding Hyperlinks to Articles 10. In the Display Text field, type the following: Artist s Rendition of New Building Unveiled 11. In the Description field, type the following: View the new building and read about our highly successful fund-raising dinner. 12. Click Submit. The hyperlink displays in the list on the Links tab. 13. Once you preview the article, you can save and approve it. If you are a site or network administrator, click Save & Approve. If you are not an administrator, click Save. If you click Save, the Approve tab displays. For each available user role, select Approved and then click Save. You successfully added a list of hyperlinks to an article. In Part 5, you will begin publishing the content that you created. 33

38 Extend Tutorial 34

39 Part 5: Creating Channels Once you create content items in Extend, you can publish them on channel pages. Channel pages are similar to sections of a newspaper. Newspapers are often divided into sections such as the Local News section, Business section, and Classifieds section. Channels in Extend function in a similar manner. For example, you create three channels Youth Ministry, Adult Ministry, and Fellowship. On each channel page, you publish information that is related to the channel topic. Channels are also important because they make up the navigation structure of your Web site. They are typically listed as hyperlinks on the navigation bar. In the following image, the channels on are circled. Each channel displays as a link in the navigation bar. When users visit a channel, a channel page displays with multiple related content items. In Part 5 of this tutorial, you will: Create a channel group Create a channel 35

40 Extend Tutorial Exercise 5.1: Creating a Channel Group Channel groups help you organize the sections of your Web site. To create channels and sub-channels, you must have at lease one channel group. If you do not want to display a channel group, you can hide the channel group name. In this exercise, you will create a channel group. In the following excercise, you will learn how to add channel pages to channel groups. To create a channel group 1. On the Site menu, click Channel Manager. The Channel Manager displays. On this page, you can view the channel groups and channel pages on your Web site. 2. Under Actions, click Create New Group. The Channel Group Properties page displays. 3. In the Name field, you can enter the name of the channel group. Type the following: Extend Tutorial Channel Group 4. If you do not want to display the channel group name, you can hide it. To hide the channel group name, in the Display Options drop-down menu, select Hide Group Header and Channels. 5. Click Save. 36

41 Creating Channels The Channel Manager page displays. The channel group that you created displays in the list. You successfully created a channel group. In the next exercise, you will learn how to create a channel as part of this channel group. Exercise 5.2: Adding a Channel to the Channel Group Once you create a channel group, you can add channels to it. On each channel page, you can lay out and publish content. In this exercise, you will add a channel to the Extend Tutorial Channel Group that you created in the previous exercise. To create a channel 1. Before you create a new channel, you must select the channel group to which the new channel belongs. On the Channel Manager page, select Extend Tutorial Channel Group. 2. Under Actions, click Create New Channel. The Create Channel page displays. On this page, you can enter information about the channel that you want to create. 3. In the Name field, you can enter the name of the channel. Type the following: Extend Tutorial 4. When you create a new channel, you must set up an alias for the channel. An alias acts as the file name of the channel when visitors view a channel in a Web browser. For example, if you create a Sermons channel, you can type sermons in the Alias field. The URL for the Sermons channel becomes In the Alias field, type the following: tutorial 5. Because each channel that you create must belong to a channel group, you must select a channel group from the Group drop-down list. For this exercise, select Extend Tutorial Channel Group. 6. Click Save. 37

42 Extend Tutorial The Channel Manager displays. The channel that you created displays under the Extend Tutorial Channel Group. 7. If the Channel Off icon displays beside the channel, you must turn on the channel. To turn on the channel, select the channel. 8. Under Actions, click Toggle Status. When the Channel On icon displays beside the channel, it is turned on. 38

43 Creating Channels You successfully added a channel to a channel group. In Part 6, you will learn how to add content items to a channel page. 39

44 Extend Tutorial 40

45 Part 6: Adding Content Items to Channels Once you create a channel page, you can add content rows to it. On each content row, you can insert a specified number of content items. In Part 6 of this tutorial, you will: Add content rows to a channel page Add content items to content rows Exercise 6.1: Adding Content Rows You can add rows of content to the main content area. Content rows are smaller sections with one, two, or three columns. You can add one content item in each column. In this exercise, you will: Create a content row with one column Add a content item to the content row Preview the content item To add content rows 1. On the Site menu, click Channel Manager. 2. On the Channel Manager page, select the Extend Tutorial channel. Under Actions, click Layout in Site Manager. 41

46 Extend Tutorial The Extend Tutorial channel page displays in the Site Manager. In the Site Manager, you can add content rows and content items to channel pages. 3. First, you will add a content row that can hold one content item. Under Add a Content Row, click One Column. Extend adds a content row with one column to the channel page. You will learn how to insert content items later in this tutorial. 4. You can add multiple content rows to a channel page. Now you will add a content row that holds three content items. In the Add a Content Row section below the content row that you just created, click Three Columns. Extend adds a content row with three columns below the one-column content row. In this content row, you can add three content items. Content row with one column Content row with three columns 42

47 Adding Content Items to Channels You successfully added content rows to a channel page. In the following exercise, you will learn how to add content items to the content rows that you created. Exercise 6.2: Adding Content Items to Content Rows Each column in a content row is called a content area. Each content area can hold one content item. In this exercise, you will add content items to the one-column and three-column content rows that you created in the previous exercise. To add a content item to a one-column content row 1. For each available content row, an Add Content section displays. In the one-column content row on the Site Manager page, click Content Manager. The Add Content page displays existing content items in the Content Manager. On this page, you can select the content item that you want to add. Note In addition to adding content items from the Content Manager, you can create and add new articles, create and add new publications, and add content items from the Clipboard. 2. Select the article titled From the Director and click Submit. On the Site Manager, the article displays in the one-column content row. 43

48 Extend Tutorial To add content items to a three-column content row 1. In this procedure, you will add existing content items to the three-column content row. In the content area on the left side of the three-column content row, click Content Manager. 2. On the Add Content page, select the article titled Artist s Rendition of New Building Unveiled and click Submit. The article diplays in the three-column content row. 44

49 Adding Content Items to Channels 3. In the middle content area, click Content Manager. 4. On the Add Content page, select the article titled Track Our Progress and click Submit. The article displays in the three-column content row. 5. In the last content area, click Content Manager. 6. On the Add Content page, select the article titled How Can I Help? and click Submit. The article displays in the three-column content row. You successfully added content items to content areas. In Part 7, you will learn how to customize the channel page and content page display options for each content area. 45

50 Extend Tutorial 46

51 Part 7: Customizing Display Options When you add content items to content areas, the following information displays if it is available: Heading Title Mini abstract Source Date Full abstract Once you add a content item to a content area, you can customize the display options for that content area. For example, you customize the channel page display options for the From the Director article on the Extend Tutorial channel to display body text only. If you also add the From the Director article to another content area, you can select different display options for the article in that content area. In Part 7 of this tutorial, you will: Customize channel page display options Customize content page display options Exercise 7.1: Customizing Channel Page Display Options You can customize the display options for each content area in a content row. When you customize display options, you can customize both the channel page display options and the content page display options. Channel page display options affect how the content displays on the channel page. Content page display options affect how the content item displays when visitors view the entire article on its own page. Above each content area, the Display Options button displays. If you mouse-over this button, you can display the body text only, the title and body text, or you can create a custom display. In this exercise, you will: Customize the channel page display options Customize the teaser image layout for a content area To change the channel page display options 1. In the From the Director content area on the Site Manager, click the Display Options button. The Custom Display page displays. On this page, you can select the information that you want to display on the channel page and the content page. For this content area, you will display the following information on the channel page: Title 47

52 Extend Tutorial Mini abstract Image Full abstract 2. Under Channel Page Display Options, clear the following options: Heading Source Date 3. On the channel page, you can display a teaser image. Under Channel Page Display Options, select Image. 4. If you choose to display the image on the channel page, you can also customize the image layout options. To customize the image layout, click the Image Layout tab. 48

53 Customizing Display Options On the Image Layout tab, you can select your image layout options for both the channel page and the content page. In this exercise, you will customize the channel page options. 5. Under Channel Page Image Layout, you can select the image class size that you want to display as the teaser image. In the Image Size drop-down menu, select Medium. 6. If you use a teaser image on the channel page, you can set the text to wrap around the image. Under Channel Page Image Layout, select the Wrap Text option. 7. Click Save. The Site Manager displays the customized display options. Note that the medium image class displays to the left of the article. 8. Now you will customize the channel page display options for the content items on the three-column content row. In the Artist s Rendition of New Building Unveiled content area, click the Display Options button. 49

54 Extend Tutorial For this article, you will display the following information on the channel page: Heading Title Mini abstract Full abstract 9. Under Channel Page Display Options, clear the Source and Date options. 10. Click Save. The Site Manager displays the customized display options. You successfully customized the channel page display options of a content area. In the next exercise, you will learn how to customize content page display options. Exercise 7.2: Customizing Content Page Display Options In addition to customizing the channel page display options for a content area, you can customize the display options for the content page. To customize content page display options 1. In the Track Our Progress content area, click the Display Options button. The Custom Display page displays. 2. On this page, you can select the display options for the content page. For this content area, you will display the following information on the content page: Title Image Links Body 3. Under Content Page Display Options, clear the following display options: Heading Mini abstract Author 50

55 Customizing Display Options Source 4. You can also customize the image layout for content pages. Click the Image Layout tab. 5. Under Content Page Image Layout, select Large in the Image Size drop-down menu. 6. Click Save. You successfully customized the content page display options. When you view the article from this content area, only the information that you selected displays. In the next exercise, you will learn how to add borders between content areas. Exercise 7.3: Adding Borders Between Content Areas When you publish content items, you can add borders between content areas. Borders can improve the visual appearance of your site by creating visible boundaries between content items. 51

56 Extend Tutorial To add borders between content areas 1. On the Site Manager page, click Edit Row on the one-column content row. The Edit Row page displays. On this page, you can customize the formatting for the entire content row. 2. Because this content row holds only one content area, you can place borders above and below the row. In the Horizontal Border drop-down menu, select Solid (Light). 3. Click Save. 4. On the Site Manager page, click Edit Row on the three-column content row. The Edit Row page displays. Because this content row holds multiple content areas, you can add both horizontal and vertical borders. Horizontal borders display above and below the content row. Vertical borders display between the content areas in the content row. 52

57 Customizing Display Options 5. In the Horizontal Border drop-down menu, select Solid (Light). 6. In the Vertical Border drop-down menu, select Solid (Light). 7. Click Save. The borders display on the Site Manager page. Once you customize your channel page and content page display options, you can publish your changes to your organization s live Web site. Because the content items and channel page that you just created are fictional, however, you do not want to publish this channel to your live Web site. To publish changes, you can click Publish at the top of the Site Manager page. 53

58 Extend Tutorial You successfully customized the display options for channel pages and content pages. In the next section of this tutorial, you will remove the tutorial content from your Extend system. 54

59 Removing the Tutorial Once you complete the tutorial, you must remove the tutorial content and channel group to make sure that they are not published on your Web site. To delete the channel and channel group 1. On the Site menu, click Channel Manager. 2. On the Channel Manager, select the Extend Tutorial Channel Group. Under Actions, click Delete Channel/Group. A confirmation dialog box displays telling you that all channels and subchannels within the group will also be deleted. 3. Click OK. Extend deletes the channel group and channel. To delete the content items 1. On the Site menu, click Content Manager. The Content Manager displays. 55

60 Extend Tutorial 2. Select the article titled Track Our Progress. 3. With Extend, you can delete multiple content items. On your keyboard, press and hold the CTRL key. While holding the CTRL key, select the following articles: Artist s Rendition of New Building Unveiled How Can I Help? From the Director 4. Under Actions, click Delete Content Item(s). A confirmation dialog box displays. 5. Click OK. The content items are permanently deleted. To delete the images 1. On the Site menu, click Media Manager. The Media Manager displays. 2. Select tutorial_thermometer. 56

61 3. With Extend, you can delete multiple media items. On your keyboard, press and hold the CTRL key. While holding the CTRL key, select the following media items: tutorial_building tutorial_director tutorial_director_sm tutorial_director_md tutorial_director_lg 4. Under Actions, click Delete Media Item(s). A confirmation dialog box displays. 5. Click OK. The media items are permanently deleted. 57

62 Extend Tutorial 58