BlackbaudNetCommunity. Blackbaud NetCommunity User Guide

Transcription

1 BlackbaudNetCommunity Blackbaud NetCommunity User Guide

2 Blackbaud, Inc. This publication, or any part thereof, may not be reproduced or transmitted in any form or by any means, electronic, or mechanical, including photocopying, recording, storage in an information retrieval system, or otherwise, without the prior written permission of Blackbaud, Inc. The information in this manual has been carefully checked and is believed to be accurate. Blackbaud, Inc., assumes no responsibility for any inaccuracies, errors, or omissions in this manual. In no event will Blackbaud, Inc., be liable for direct, indirect, special, incidental, or consequential damages resulting from any defect or omission in this manual, even if advised of the possibility of damages. In the interest of continuing product development, Blackbaud, Inc., reserves the right to make improvements in this manual and the products it describes at any time, without notice or obligation. All Blackbaud product names appearing herein are trademarks or registered trademarks of Blackbaud, Inc. All other products and company names mentioned herein are trademarks of their respective holder. BBNC

3 Blackbaud NetCommunity User Guide BLACKBAUD NETCOMMUNITY Blackbaud NetCommunity Users Blackbaud NetCommunity User Tasks Integration Tasks The Raiser s Edge Data Entry User Navigate in Blackbaud NetCommunity Navigation Bar Blackbaud NetCommunity Toolbar Action Bar Filter List By Toggle Between Blackbaud NetCommunity and Your Live Website Internet Explorer Buttons Program Basics HTML Editor HTML Editor Table and Line Properties Search Screen Insert Image Create Page Link Constituent Codes WEBSITE Website Overview Site Explorer Pages Templates Image Library Parts Part Types Create and Edit Part Properties Anonymous Newsletter Subscription Change User ID/Password Directory Discussion Group Documents Donation Form Reports

4 Event Calendar Event Calendar Group Event Calendar Highlights Event Registration Form Formatted Text and Images Job Board Membership Form Menu Navigation Buttons News Reader Page Element Types Personal Notes Profile Display Quick Search Search Slideshow Survey Targeted Content User Education Profile Form User Preferences Form User Login User Profile Form Volunteer Opportunity Weblog Web Traffic Reports Layouts Stylesheets Part Type Element Details for Stylesheets Templates Lists Messages Bounced Management Delivery Status Newsletters Acknowledgements Invalid Accounts Campaigns Create Campaigns Create Appeals Notifications ADMINISTRATION Security Users Roles Merchant Accounts Field Options System Options Configuration

5 Code Tables User Imports User Import Status User Import Exception Reasons CHAPTER MANAGEMENT Design and Management Process Chapter Management: Process Overview Chapter Management Roles Pre-Design Work for Chapter Management Manage Chapter Pages Design Chapter Manager Changes in The Raiser s Edge TEAM FUNDRAISING Design and Management Process Team Fundraising: Process Overview Team Fundraising Roles Pre-Design Work for Team Fundraising Fundraiser Page Elements Parts Manage Fundraiser Pages Design the Fundraiser Part Add Help Content for Team Fundraisers Offline Donations for a Team Fundraiser Fundraiser Dashboard Part Fundraiser Reports Changes in The Raiser s Edge PERSONAL PAGES Design and Management Process Personal Pages: Process Overview Create Personal Page Elements Create Web Pages Manage Personal Pages Design the Personal Page Manager Part Add Help Content for Personal Pages THE RAISER S EDGE NETCOMMUNITY PAGE NetCommunity Options in The Raiser s Edge Service URL Currency Configuration Class Note Processing New Constituents Matching Gifts Linked User Constituent Matching Transaction Assignments Advocacy NetCommunity Transactions Overview

6 Required Fields in The Raiser s Edge Process Order for Transaction Types NetCommunity Transactions in The Raiser s Edge Sign-Up Requests User Profile Updates Fundraisers Personal Pages Donations Volunteer Requests Event Registrations Polls Class Notes Advocacy Actions Memberships Surveys INDEX

7 CHAPTER1 Blackbaud NetCommunity In This Chapter Blackbaud NetCommunity Users on page 1 Navigate in Blackbaud NetCommunity on page 4 Program Basics on page 5 Blackbaud NetCommunity provides your organization with a website program for users of all levels. You can create web pages with multiple layers of layout, template, and page design. You can generate and send an to an individual or a group, set security for each section of the program using roles you define, and track statistics about your website usage. Website users can also make a donation or register for an event with online forms you create. In addition, Blackbaud NetCommunity integrates data between your website and other Blackbaud products, such as The Raiser s Edge. Website users enter information into areas of your website such as profiles and donation forms that you download to another Blackbaud program. This documentation is for the administrative side of Blackbaud NetCommunity. The administrative side consists of the Web Site, , and Administration sections. Together, these sections contain the tools you need to create your organization s website. Blackbaud NetCommunity Users Depending on your role in Blackbaud NetCommunity, you will perform different tasks to fulfill your website needs. For example, if you are the Site Administrator, your job in Blackbaud NetCommunity is most likely to create new web pages from start to finish and assign roles to Blackbaud NetCommunity users. If you are the Director of Special Events, your job may be to update last year s Golf Tournament web page with this year s golf tournament information. If you are the Data Entry Manager for The Raiser s Edge, your job is to download information from the website and integrate the information with The Raiser s Edge. Lastly, your constituents use Blackbaud NetCommunity directly from your website.

8 2. CHAPTER 1 Warning: Your organization should assign full Administrator rights to only a select number of users. These users should be knowledgeable in all areas of website design and Blackbaud NetCommunity. Certain areas, such as Site Explorer, are crucial for your website. A small change can affect multiple web pages. This functionality saves your organization a lot of time and effort. However, if a change is incorrect, you have to spend time and effort to correct the change. We strongly encourage you to establish security that limits general users access to these areas. Constituents perform tasks such as registering for events, joining memberships, and making donations. Once a constituent submits these tasks, you can download the information to The Raiser s Edge. This section outlines possible main user roles in Blackbaud NetCommunity and provides a roadmap for the main tasks each role performs in the program. Blackbaud NetCommunity User Tasks A a wide range of users perform tasks in Blackbaud NetCommunity. Many tasks are captured in the user roles of a Blackbaud NetCommunity administrator, a website designer, a user from The Raiser s Edge who also uses Blackbaud NetCommunity (most likely someone in the Development office), and a constituent. Review the following picture to become familiar with the tasks you can perform, depending on your user role. For details about these tasks, see Security on page 223, Web Traffic Reports on page 120, Website on page 29, and Parts on page 39. Integration Tasks Some individuals (most likely in development) at your organization may have responsibilities that are common to both Blackbaud NetCommunity and The Raiser s Edge. For example, your events data entry person may also be responsible for updating the events page on your website.

9 BLACKBAUD NETCOMMUNITY. 3 If the roles for your job are similar to this, review the following diagram for an example of integration between Blackbaud NetCommunity and The Raiser s Edge. If you have rights to create and edit parts or pages of your website, this diagram helps you get started in the program and understand how the integration process works. For details about the tasks a user of Blackbaud NetCommunity and The Raiser s Edge can perform, see Pages on page 31, Templates on page 35, Parts on page 39, Messages on page 177, and The Raiser s Edge user guides. The Raiser s Edge Data Entry User If you are responsible for The Raiser s Edge data entry, you should periodically download information entered through your website.

10 4. CHAPTER 1 The following diagram explains where data downloads to The Raiser s Edge. The diagram does not include all transaction types. For details about the tasks a Raiser s Edge data entry user performs, see The Raiser s Edge NetCommunity Page on page 329 and your Raiser s Edge user guides. Navigate in Blackbaud NetCommunity Blackbaud NetCommunity contains the commands necessary to complete all website functions. You can customize your website to fit your organization s needs by using Web Site, , and Administration. Learning to navigate in Blackbaud NetCommunity is the first step in using the program to its fullest potential. Navigation Bar The navigation bar is located on the left side of the page. If you need additional space on your computer screen when you make changes to your website, click Hide Navigation Bar on the NetCommunity toolbar. Hiding the navigation bar in Blackbaud NetCommunity is workstation specific. For example, if Jane hides the navigation bar on her workstation and Joe later logs into Blackbaud NetCommunity on the same workstation, the navigation bar remains hidden. Blackbaud NetCommunity Toolbar The Blackbaud NetCommunity toolbar, located at the top left of the screen, contains buttons you can use throughout Blackbaud NetCommunity. The main buttons are Home Page, Preview Site, History, Hide Navigation Bar, and Log Out.

11 BLACKBAUD NETCOMMUNITY. 5 If you hide your navigation bar, the toolbar changes. The buttons then become Home Page, Preview Site, History, Web Site, , Administration, Help, Show Navigation Bar, and Log Out. Action Bar The action bar contains buttons for you to use on a specific screen. Several of these buttons remain on most screens, for example, Delete. However, some buttons on the action bar are specific to a particular screen, for example, Copy Template on an existing Templates screen. Filter List By Near the top of each page, you can select a category or enter search criteria to narrow the list that appears for pages, parts, , templates, layouts, users, or roles. Click Go to display the narrowed-down list. Toggle Between Blackbaud NetCommunity and Your Live Website If you are in Blackbaud NetCommunity, you can click Preview Site on the Blackbaud NetCommunity toolbar to access your live website. This is helpful when you update web pages. You can make changes to the page, save the information, and go directly to the live site to view the changes with the click of one button. If you have Supervisor or edit rights to that page, toolbar buttons appear on your live website that take you directly to Blackbaud NetCommunity. This way, if you notice a mistake on your site, you can immediately access the administrative side of Blackbaud NetCommunity to make the correction. To do this, click Edit this page, History, or Home Page on the Blackbaud NetCommunity toolbar. When you click Edit this page, Blackbaud NetCommunity opens to the Page Designer screen for the web page in Site Explorer. To access your most recently opened parts, click History. When you click Home Page, a menu appears with Web Site, Administration, , and Help so you can access the area of the program you need. You can access only areas to which you have rights. Internet Explorer Buttons To navigate back and forth between screens in Blackbaud NetCommunity, use the Back and Forward arrow buttons on your Internet Explorer toolbar. All other buttons in Internet Explorer control Internet settings. Program Basics Throughout Blackbaud NetCommunity, you can perform similar tasks from different parts. For example, in Blackbaud NetCommunity, you use a powerful HTML editor to format and layout several features, such as , newsletters, and content on web pages. You can use a search screen from different parts to help find and select data to use, such as a constituent query to use to create a Directory part or an appeal for a Donation form.

12 6. CHAPTER 1 HTML Editor Blackbaud NetCommunity provides a powerful HTML editor so you can format and lay out content for your web pages. With the HTML editor, you can update content easily and safely while you maintain control over the website design and content. Before you begin to create content in the HTML editor, you should design custom stylesheets to create unique elements such as colors, font types and sizes, and spacing for your website. For more information about stylesheets, see Stylesheets on page 123. You can use the HTML editor in various modes, depending on your HTML experience and where in the program you access the HTML editor. Normal Normal mode works similar to a standard word processing application. To create content in Normal mode, click Normal. By default, when you enter content in Normal mode, pressing ENTER on your keyboard creates a <p> tag in the HTML content to indicate the start of a new paragraph. Pressing SHIFT + ENTER on your keyboard creates a <br> tag to indicate a single carriage return in the content. Your system administrator can adjust this configuration in Administration. HTML If you have experience with HTML, you can click HTML and create or edit your content s HTML source code. You cannot use HTML mode to embed your own form via HTML in the HTML editor. We recommend you put the form on a page that is not stored in Blackbaud NetCommunity but can be referenced in an iframe. For more information about including customized forms in Blackbaud NetCommunity, contact Blackbaud s Professional Services at solutions@blackbaud.com. Preview In Preview mode, you can view the content as it appears on the web page. To view the HTML editor content in the read-only Preview mode, click Preview. To adjust the content, return the HTML editor to Normal or HTML mode. Preview mode is not available for the HTML editor in . To view a preview of an , click the Preview button on the toolbar. The Preview screen appears. HTML Editor Functions The following tables explain the functions and menus available on the toolbar of the HTML editor in Normal mode and HTML mode. Depending on the mode in which you use the HTML editor, not every function and menu may appear. Note: On your website, the user can use an HTML editor with a limited set of these functions on some parts. With the HTML editor, the user can also insert an image or a link. Buttons on the Toolbar Review the following table to learn about the HTML Editor buttons. Icon Function Description Print To print the current content, click Print. The Print screen appears. Specify the printer and print preferences, and click Print. The program sends the print job to the selected printer and the Print screen closes.

13 BLACKBAUD NETCOMMUNITY. 7 Icon Function Description Preview To preview the current content, click Preview. The Preview screen appears and displays a preview of the current content. When you access the Preview screen from the HTML Editor outside , you can adjust the screen resolution of the previewed content. To view the page at different monitor aspect ratios, click Size: 540x480, 800x600, or 1024x768. The Width and Height fields display the selected the screen resolution for the selected size. To print a hard copy of the preview, click the Print button. The Print screen appears. To close the Preview screen, click Cancel. This function is available only in Normal mode. Find and Replace Clean Up HTML Spell Check Undo Redo Cut To find and replace text in the content, click Find and Replace. The Find and Replace screen appears. In the Find what field, enter the text to search for in the content. To replace found text with other text, in the Replace with field, enter the text to substitute in the place of the found text. Specify whether to search for a whole word or for the same case of text. To search for the Find what text, click Find Next. To replace found text with the text entered in the Replace with field, click Replace. To replace all instances of the Find what text, click Replace All. To close the Find and Replace screen, click Cancel. To clean up the content and remove unnecessary tags from the HTML, such as <font> or <span>, click Clean Up HTML. The Clean Up HTML screen appears. Click the applicable button to clean up the HTML. You can Remove all HTML tags, Remove all word specific markup, Clean up cascading style sheets, Clean up <Font> tags, and Clean up <Span> tags. To close the Clean Up HTML screen, click Cancel. This function is available only in Normal mode. To check the spelling of the content, click Spell Check. The Spell Check screen appears. If the HTML editor finds a misspelled word, the word appears above the Change To field. In the Change To field, enter the correct spelling of the word, or select the correctly spelled word in the Suggestions box. To replace a selected word with the Change To word, click Replace. To replace all instances of a misspelled word, click Replace All. To not replace a word the Spell Check screen displays, click Ignore. To not replace any instances of a word, click Ignore All. To add a selected word to the HTML editor s dictionary, click Add. To close the Spell Check screen, click Cancel. This function is available only in Normal mode. To undo the last operation in the content area, click Undo. The previous operation in the content area is undone. To undo the most recent series of operations, click Undo repeatedly. This function is available only in Normal mode. To redo an undone operation in the content area, click Redo. The most recently undone operation is reinstated. To redo the most recently undone series of operations, click Redo repeatedly. This function is available only in Normal mode. To temporarily remove selected text from the content, such as to paste elsewhere in the content, click Cut. The selected text is removed from the content. Copy Paste To duplicate selected text from the content, such as to paste elsewhere in the content, click Copy. The selected text is copied, and you can paste it repeatedly throughout the content. To insert cut or copied text at a selected position in the content, formatted as when it was cut or copied, click Paste. The formatted text appears at the selected location in the content.

14 8. CHAPTER 1 Icon Function Description Paste plain text To insert cut or copied text at a selected position in the content, without the format of when it was cut or copied, click Paste plain text. The plain text appears at the selected location in the content. This function is available only in Normal mode. Paste From word Delete Insert Hyperlink Remove Link To insert text that was cut or copied from Microsoft Word at a selected position in the content, click Paste From word. The text appears at the selected location in the content, without the proprietary HTML of Word. The text format in the HTML editor may differ from the format in Word. This function is available only in Normal mode. To completely remove selected text from the content, click Delete. The selected text is removed from the content. You cannot paste deleted text. This function is available only in Normal mode. You can link selected text in the content to another web address or page. When you select the text to link, Insert Hyperlink is enabled. If the text is written in a format that Blackbaud NetCommunity recognizes as a web address or page, such as the link formats automatically. To link selected text to another web address or page, click Insert Hyperlink. The Create Page Link screen appears. For information about a page link, see Create Page Link on page 25. This function is available only in Normal mode. To remove an existing hyperlink from selected text in the content, click Remove Link. The hyperlink removes from the selected text. This function is available only in Normal mode. Add image map To add an image map to a selected image in the content area, click Add image map. The Add image map screen appears. From the Add image map screen, you can add hot spots and hyperlinks to the image, increase or decrease the magnification of the image, and adjust the size of the image. For more information about the image map, see Image Map on page 13. This function is available only in Normal mode. Insert Image To insert an image, such as your organization s logo, click Insert Image. The Select Image from the Images Library screen appears so you can select the image to insert. For information about how to insert an image, see Insert Image on page 24. This function is available only in Normal mode. Break To insert a line break at a selected location in the content, click Break. The HTML editor adds a <br> tag at the selected location. This function is available only in Normal mode. Insert Paragraph Insert Print Page Break Insert today s date Insert the current time To insert a paragraph at a selected location in the content, click Insert Paragraph. The HTML editor adds a <p> tag at the selected location. This function is available only in Normal mode. To insert a printed page break at a selected location in the content, click Insert Print Page Break. The HTML editor adds a division with an attribute of PAGE-BREAK-BEFORE: always at the selected location. This function is available only in Normal mode. To insert the current date at a selected location in the content, click Insert today s date. Today s date, in the Day, Month, Date, Year format, appears at the selected location in the content. This function is available only in Normal mode. To insert the current time at a selected location in the content, click Insert the current time. The current time, in the HH:MM:SS AM/PM format, appears at the selected location in the content. This function is available only in Normal mode.

15 BLACKBAUD NETCOMMUNITY. 9 Icon Function Description Special characters Universal Keyboard To insert a special character at a selected location in the content, click Special characters. The Special characters screen appears. Specify the special character font to use, and, in the Special characters frame, select the character to insert. The special character appears at the selected location in the content. To close the Special characters screen and not insert a special character in the content, click Cancel. This function is available only in Normal mode. To enter international text or characters at a selected location in the content, click Universal Keyboard. The Universal Keyboard screen appears. Click the desired language in which to type, and use the keys on the screen to enter the text or characters. To scroll through the available languages, click kb+ or kb-. To insert the text or characters and close the Universal Keyboard screen, click Insert. To cancel the text or characters and close the Universal Keyboard screen, click Cancel. This function is available only in Normal mode. Insert groupbox To insert a group box at a selected location in the content, click Insert groupbox. The HTML editor adds a <fieldset> tag at the selected location. You can adjust the size of the group box as necessary. Replace the default Title, with an HTML tag of <legend>, with the desired caption and enter the desired paragraph text in the group box. This function is available only in Normal mode. Help To access a description of the HTML editor features, click Help. The Blackbaud NetCommunity help file appears. This function is available only in Normal mode. Insert Table Insert Row Above Insert Row Below Delete Row Insert Column to the Left Insert Column to the Right To insert a table at a selected location in the content, click Insert Table. The Draw Table grid appears. You can design a simple table with up to six columns and four rows. In the Draw Table grid, highlight the desired number of rows and columns and click the grid. The table appears at the selected location in the content. To design a table with specific design or layout, click Table Wizard. The table Properties screen appears. On the Properties screen, you can specify the table layout, design, and font. For more information about table properties, see HTML Editor Table and Line Properties on page 14. To edit the design or layout of an existing table, double-click the table. The Properties screen appears. For more information about table properties, see HTML Editor Table and Line Properties on page 14. This function is available only in Normal mode. To insert a row above a selected row in a table, click Insert Row Above. The added row appears in the table. This function is available only in Normal mode. To insert a row below a selected row in a table, click Insert Row Below. The added row appears in the table. This function is available only in Normal mode. To remove a selected row from a table, click Delete Row. The selected row is removed from the table. This function is available only in Normal mode. To insert a column to the left of a selected column in a table, click Insert Column to the Left. The added column appears in the table. This function is available only in Normal mode. To insert a column to the right of a selected column in a table, click Insert Column to the Right. The added column appears in the table. This function is available only in Normal mode.

16 10. CHAPTER 1 Icon Function Description Delete Columns To remove a selected column from a table, click Delete Columns. The selected column is removed from the table. This function is available only in Normal mode. Insert Cells Delete Cells Row Properties Cell Properties Merge cells right Merge cells down Split cells right Split cells down Insert Horizontal Line Visible Borders Select All To insert a cell in a selected row of a table, click Insert Cells. The added cell appears in the selected row. This function is available only in Normal mode. To remove a cell from a selected row of a table, click Delete Cells. A cell is removed from the selected row. This function is available only in Normal mode. To edit the properties of a selected row, click Row Properties. The Properties screen appears. For more information about row properties, see HTML Editor Table and Line Properties on page 14. To save the row properties and close the Properties screen, click OK. To cancel the row properties and close the Properties screen, click Cancel. This function is available only in Normal mode. To edit the properties of a selected cell, click Row Properties. The cell Properties screen appears. For more information about cell properties, see HTML Editor Table and Line Properties on page 14. To save the cell properties and close the Properties screen, click OK. To cancel the cell properties and close the Properties screen, click Cancel. This function is available only in Normal mode. To merge a selected cell with the cell on its right, click Merge cells right. The selected cell merges with the cell on its right. This function is available only in Normal mode. To merge a selected cell with the cell below it, click Merge cells down. The selected cell merges with the cell below it. This function is available only in Normal mode. To split a selected cell into columns, click Split cells right. The selected cell splits into columns. This function is available only in Normal mode. To split a selected cell into rows, click Split cells down. The selected cell splits into rows. This function is available only in Normal mode. To insert a horizontal line at a selected location in the content, such as to divide areas on your webpage, click Insert Horizontal Line. The horizontal line appears at the selected location, and the Properties screen appears. For information about the tabs on the Properties screen, see HTML Editor Table and Line Properties on page 14. To save the line properties and close the Properties screen, click OK. To cancel the line properties and close the Properties screen, click Cancel. This function is available only in Normal mode. To turn the visibility of a selected table s borders on or off, click Visible Borders. This function is available only in Normal mode. To select all the content, click Select All. Select None To deselect all selected content, click Select None.

17 BLACKBAUD NETCOMMUNITY. 11 Icon Function Description Bold To make selected text bold, click Bold. The HTML editor adds a <strong> tag around the selected text. This function is available only in Normal mode. Italic To italicize selected text, click Italic. The HTML editor adds an <em> tag around the selected text. This function is available only in Normal mode. Underline To underline selected text, click Underline. The HTML editor adds an <u> tag around the selected text. This function is available only in Normal mode. Left Justify To align selected text to the left, click Left Justify. The HTML editor adds an attribute of align=left to the selected division. This function is available only in Normal mode. Center To align selected text to the center, click Center. The HTML editor adds an attribute of align=center to the selected division. This function is available only in Normal mode. Right Justify To align selected text to the right, click Right Justify. The HTML editor adds an attribute of align=right to the selected division. This function is available only in Normal mode. Justify Full To fully justify selected text, click Justify Full. The HTML editor adds an attribute of align=justify to the selected division. This function is available only in Normal mode. Justify None To not justify content text, click Justify None. The HTML editor removes any align attribute from the selected division. This function is available only in Normal mode. Remove Format To remove the format from selected text, click Remove Format. The selected text appears as plain text. The HTML editor removes any special format attributes from the selected text. This function is available only in Normal mode. Font Color To change the color of selected text, click Font Color and select the color from the palette that appears. The HTML editor adds a <span> tag with the selected color around the text. This function is available only in Normal mode. Highlight To highlight selected text, click Highlight and select the color of the highlight from the drop-down palette.the HTML editor adds a <span> tag with the selected background color around the text. This function is available only in Normal mode. Insert Numbered List Insert Unordered List Indent Text To insert a numbered list at a selected location in the content, click Insert Numbered List. The HTML editor adds an <ol> tag at the selected location. The first list item begins with 1. and appears at the selected location. When you press ENTER on the keyboard, the subsequent list item is numbered sequentially. To end a numbered list, click Insert Numbered List again. This function is available only in Normal mode. To insert a bulleted list at a selected location in the content, click Insert Unordered List. The HTML editor adds an <ul> tag at the selected location. The first list item appears with a bullet at the selected location. When you press ENTER on the keyboard, the subsequent list item automatically begins with a bullet.to end an unordered list, click Insert Unordered List again. This function is available only in Normal mode. To increase the indent of a selected line of text, click Indent Text. The HTML editor adds a <blockquote> tag around the selected paragraph. If you increase the indent of a bulleted item on an unordered list, the bullet changes to indicate a secondary relationship with the bulleted item above it. This function is available only in Normal mode.

18 12. CHAPTER 1 Icon Function Description Outdent Text To decrease the indent of a selected line of text, click Outdent Text. The indent is decreased. If you decrease the indent of a bulleted item on an unordered list, the text becomes plain text, or the bullet changes to indicate a closer relationship with the bulleted item above it. This function is available only in Normal mode. Superscript Text Subscript Text Strikethrough Text Upper case To superscript selected text, click Superscript Text. The HTML editor adds a <sup> tag around the selected text. This function is available only in Normal mode. To subscript selected text, click Subscript Text. The HTML editor adds a <sub> tag around the selected text. This function is available only in Normal mode. To strike a line through selected text, click Strikethrough Text. The HTML editor adds a <strike> tag around the selected text. This function is available only in Normal mode. To change selected text from lower case to upper case, click Upper case. This function is available only in Normal mode. Lower case To change selected text from upper case to lower case, click Lower case. This function is available only in Normal mode. Menus on the Toolbar Review the following table to learn more about the HTML Editor menus. Menu Function Description Font menu The Font menu lists common fonts that appear correctly on most web browsers. To change the font applied to selected text, select a font from the Font menu. The font of the selected text changes to the selected font. This function is available only in Normal mode. Size menu To change the size applied to selected text, select the size from the Size menu. The size of the selected text changes to the selected size. This function is available only in Normal mode.

19 BLACKBAUD NETCOMMUNITY. 13 Menu Function Description CSS Class menu To apply a custom CSS class to selected text, you can select the desired class from the CSS Class menu. From this menu, you can select any custom class that starts with a dot (. ) from the applied stylesheet. This function is available only in Normal mode. Merge Fields menu To add merge fields for personalized information from The Raiser s Edge to the HTML content, you can select the field from the Merge Fields menu. To expand the list, click the + next to a field category. Image Map In Normal mode, you can add an image map to a selected image in the content area. With an image map, you can add hot spots and hyperlinks to the image, increase or decrease the magnification of the image, and adjust the size of the image. Add an image map 1. In the content area, select the image to map and click Add image map on the toolbar. The Add Image Map screen appears and displays the selected image. 2. Adjust the image as necessary. The table below explains the functions available on the Add image map screen. Icon Function Description Add hot spots Insert Hyperlink You can insert a hyperlink to another web address or page in an image. Before you insert the hyperlink in an image, you must define the area of the image, or hot spot, the website user must click on to access the linked web address or page. To add a hot spot to the image, click Add hot spots. A square appears to indicate the hot spot. Move the hot spot to the location on the image. You can adjust the height and width of the hot spot. To link a selected hot spot to another web address or page, click Insert Hyperlink. The Create Page Link screen appears. For information about a page link, see Create Page Link on page 25. Zoom In To increase the image size as it appears on the Add image map screen, such as to magnify a specific section of the image, click Zoom In.

20 14. CHAPTER 1 Icon Function Description Zoom Out To decrease the image size as it appears on the Add image map screen, click Zoom Out. Best Fit To display the image so it maximizes the space available on the Add image map screen, click Best Fit. Actual Size To display the image at its actual size on the Add image map screen, click Actual Size. 3. To save the image map and return to the content area, click Update. HTML Editor Table and Line Properties When you use the HTML editor in Normal mode, you can easily design complete tables, single rows and cells of tables, and horizontal lines such as to divide a web page. You can also adjust the properties of these items as you design them. When you adjust the properties of a table, row, cell, or line, you can specify many of its characteristics, including the size, styles, and color. For information about the HTML editor, see HTML Editor on page 6. You can quickly create a standard table, or you can easily adjust the attributes of a table to create a complex table. To insert a table at a selected location in the content area, click Insert Table on the toolbar. You can use the Draw Table grid or the Table Wizard to design the table. With the Draw Table grid, you can specify a table with up to six columns and four rows. With the Table Wizard, you can specify the table layout, design, and font. To use the Table Wizard to design the table to add, click Table Wizard. The table Properties screen appears. Use the tabs of the Properties screen to design the table and its rows and cells. We recommend only users familiar HTML and CSS style elements adjust the properties on tabs other than the Table Wizard tab. Table Wizard Tab on page 15 Table Tab on page 16 General Tab on page 21 Style Builder Tab on page 22 To adjust the properties of a row in a table while in Normal mode, you can also select the row in the table and click Row Properties on the toolbar. The row Properties screen appears. Use the tabs of the Properties screen to design the row. We recommend only users familiar HTML and CSS style elements adjust the properties on these tabs. TR Tab on page 18 General Tab on page 21 Style Builder Tab on page 22 To adjust the properties of a cell in a table while in Normal mode, you can also select the cell in the table and click Cell Properties on the toolbar. The cell Properties screen appears. Use the tabs of the Properties screen to design the cell. We recommend only users familiar HTML and CSS style elements adjust the properties on these tabs. TD Tab on page 19 General Tab on page 21 Style Builder Tab on page 22

21 BLACKBAUD NETCOMMUNITY. 15 To insert a horizontal line at a selected location in the content area, click Insert Horizontal line on the toolbar. The line Properties screen appears. Use the tabs of the Properties screen to design the horizontal line. We recommend only users familiar HTML and CSS style elements adjust the properties on these tabs. HR Tab on page 20 General Tab on page 21 Style Builder Tab on page 22 Table Wizard Tab On the Table Wizard tab, you can specify the layout of the table and adjust the layout and properties of the cells. In the Table layout field, you can select the basic layout of the table. You can select to create a table with one, two, or three columns; a table with a header, right or left row, top right or top left column, and body; or a three-column table with a header and footer. The Table Designer frame displays the table with the selected layout. Under Cell Properties, you can adjust the properties of a selected row or cell in the table. To adjust the properties of a row in the table, select a cell in the row to adjust and click Row Properties. The row Properties screen appears. For information about the tabs on the row Properties screen, see HTML Editor Table and Line Properties on page 14. To adjust the properties of a cell in the table, select the cell to adjust and click Cell Properties. The cell Properties screen appears. For information about the tabs on the cell Properties screen, see HTML Editor Table and Line Properties on page 14. To adjust the size of a cell in the table, select the cell to adjust and, in the Width and Height fields, enter the pixel dimensions to use for the cell.

22 16. CHAPTER 1 To decrease or increase the number of columns in the table, click the - and + buttons next to Columns. To increase or decrease the number of columns spanned by a cell in the table, select the cell to adjust and click the - and + buttons next to ColSpan. To decrease or increase the number of columns, use the - and + buttons next to Rows. To increase or decrease the number of rows spanned by a cell in the table, select the cell to adjust and use the - and + buttons next to Span. Table Tab On the Table tab, you can adjust the characteristics of the table and its cells. We recommend only users familiar HTML and CSS style elements adjust the properties on the Table tab. In the Table frame, you can specify the attributes of the table. In the Cell spacing field, enter the amount of space to appear between cells of the table. In the Cell padding field, enter the amount of space to appear between the ruled line and the content of a cell in the table. In the ID field, you can assign a unique identifier to the table. In the Border field, enter the width, in pixels, of a border around the table. To display the table with no border, enter 0. In the Background color and Border color fields, enter the colors of the background and border of the table. You can enter the standard color name or hexadecimal value, or you can select the color from the drop-down palette. In the Rules field, select which ruled lines appear between cells of the table. You can select to display all lines, no lines, or only those between rows or columns.

23 BLACKBAUD NETCOMMUNITY. 17 To collapse the table borders into a single border, mark Collapse table border. If you do not mark this checkbox, the table borders are detached, as in standard HTML. In the Summary field, you can enter a summary of the table, such as for speech-synthesizing or non-visual browsers. To display a caption at the top of the table, next to Caption, click Insert. To remove the table caption, click Delete or delete its code in HTML mode. To define a group of rows at the top of the table as a header, next to Thead, click Insert. To remove the table header, click Delete. To define a group of rows at the bottom of the table as a footer, next to Tfoot, click Insert. To remove the table footer, click Delete. In the General frame, you can specify additional attributes for the table, such as size, alignment, and whether to apply a class from the cascading style sheet (CSS). To apply a CSS class to the table, in the Css Class field, enter the class to apply. In the Width and Height fields, enter the dimensions of the table. You can enter the dimensions in pixels (px) or as a percentage (%). In the Alignment field, select the alignment of the table. You can select Left, Center, Right, or Not Set. In the Text-align field, select the alignment of text in the table. You can select Left, Center, Right, Justify, or Not Set. To float the table within another element, in the Float field, select whether the table appears to the left or right of the element. In the Title field, you can enter a title to appear for the table.

24 18. CHAPTER 1 TR Tab On the TR tab, in the Row Properties frame, you can define the attributes of a row in the table. We recommend only users familiar HTML and CSS style elements adjust the properties on the TR tab. In the Width and Height fields, enter the dimensions, in pixels, of the row. In the Alignment field, select the horizontal alignment of the content in the row. You can select Left, Center, Right, or Not Set. In the Vertical Alignment field, select the vertical alignment of the content in the row. You can select Top, Middle, Baseline, Bottom or Not Set. In the Background color and Border color fields, enter the colors of the background and border of the row. You can also specify a different color for the top and left borders than the bottom and right borders of the row. In the Border color light field, enter the color for the top and left borders. In the Border color dark field, enter the color for the bottom and right borders. You can enter the standard color name or hexadecimal value, or you can select the color from the drop-down palette. To apply a CSS class to the row, in the Css Class field, enter the class to apply. In the ID field, you can assign a unique identifier to the row. In the Title field, you can enter a title to appear for the row.