Website Editor User Guide



Similar documents
Website Editor User Guide

User Guide. Chapter 6. Teacher Pages

Ingeniux 8 CMS Web Management System ICIT Technology Training and Advancement (training@uww.edu)

Google Docs Basics Website:

CONTENTM WEBSITE MANAGEMENT SYSTEM. Getting Started Guide

Introduction to Drupal

HOW TO USE THIS GUIDE

Adobe Dreamweaver CC 14 Tutorial

USER GUIDE. Unit 4: Schoolwires Editor. Chapter 1: Editor

Microsoft Word 2013 Tutorial

Using Adobe Dreamweaver CS4 (10.0)

How to create pop-up menus

Quick Reference Guide

collab.virginia.edu UVACOLLAB ECLPS: BUILDING COURSE PORTALS UVaCollab User Guide Series

WYSIWYG Editor in Detail

How to Use the Text Editor in Blackboard

ADOBE DREAMWEAVER CS3 TUTORIAL

-SoftChalk LessonBuilder-

Developing Website Using Tools

The OnCourse Lesson Planner: User Manual

GOOGLE DOCS APPLICATION WORK WITH GOOGLE DOCUMENTS

SoftChalk. Level 1. University Information Technology Services. Training, SoftChalk Level Outreach, 1 Learning Technologies and Video Production

Starting User Guide 11/29/2011

Terminal Four (T4) Site Manager

To change title of module, click on settings

NDSU Technology Learning & Media Center. Introduction to Google Sites

6. If you want to enter specific formats, click the Format Tab to auto format the information that is entered into the field.

In this session, we will explain some of the basics of word processing. 1. Start Microsoft Word 11. Edit the Document cut & move

Microsoft Word Quick Reference Guide. Union Institute & University

Advanced Presentation Features and Animation

UNPAN Portal Content Management System (CMS) User Guide

Access Edit Menu Edit Existing Page Auto URL Aliases Page Content Editor Create a New Page Page Content List...

Cascade Server. End User Training Guide. OIT Training and Documentation Services OIT TRAINING AND DOCUMENTATION.

Working with the new enudge responsive styles

Excel 2007 Basic knowledge

Content Management System

How to Use Swiftpage for Microsoft Outlook

Umbraco Content Management System (CMS) User Guide

User Guide. Chapter 6. Teacher Pages

Teacher Training Session 1. Adding a Sub-Site (New Page) Editing a page and page security. Adding content cells. Uploading files and creating folders

How to Use Swiftpage for ACT! by Sage

Create a Google Site in DonsApp

WYSIWYG Tips and FAQ

Joomla! 2.5.x Training Manual

Using Microsoft Word. Working With Objects

How to Use Swiftpage for SageCRM

Sample Table. Columns. Column 1 Column 2 Column 3 Row 1 Cell 1 Cell 2 Cell 3 Row 2 Cell 4 Cell 5 Cell 6 Row 3 Cell 7 Cell 8 Cell 9.

Google Docs A Tutorial

MS Word 2007 practical notes

Joomla Article Advanced Topics: Table Layouts

Training Manual Version 1.0

Mura CMS. (Content Management System) Content Manager Guide

Google Sites From the Ground Up

DRUPAL WEB EDITING TRAINING

Decision Support AITS University Administration. Web Intelligence Rich Client 4.1 User Guide

Help on Icons and Drop-down Options in Document Editor

How to Edit an . Here are some of the things you can do to customize your

Contents. Launching FrontPage Working with the FrontPage Interface... 3 View Options... 4 The Folders List... 5 The Page View Frame...

Mass . General Use

How to Use Swiftpage for Microsoft Excel

The Home link will bring you back to the Dashboard after. Workflows alert you to outstanding assets waiting for approval or review.

WEBSITE CONTENT MANAGEMENT SYSTEM USER MANUAL CMS Version 2.0 CMS Manual Version

How to Edit Your Website

Microsoft Office PowerPoint 2013

Umbraco v4 Editors Manual

Login: Quick Guide for dotcms & Accessibility November 2014 Training:

BLACKBOARD 9.1: Text Editor

Where do I start? DIGICATION E-PORTFOLIO HELP GUIDE. Log in to Digication

Basic Microsoft Excel 2007

Using JCPS Online for Websites

PowerPoint 2007 Basics Website:

JOOMLA 2.5 MANUAL WEBSITEDESIGN.CO.ZA

Creating Personal Web Sites Using SharePoint Designer 2007

Intro to Web Development

Google Sites: Creating, editing, and sharing a site

Web Ambassador Training on the CMS

Creating Web Pages with Microsoft FrontPage

Creating Interactive PDF Forms

DESIGN A WEB SITE USING PUBLISHER Before you begin, plan your Web site

Florence School District #1

Creating a Website with Publisher 2013

Basic Excel Handbook

Coming Soon! echalk Enhancements & New Features

Chapter 14: Links. Types of Links. 1 Chapter 14: Links

[D YOUVILLE COLLEGE OUCAMPUS WEB CONTENT MANAGEMENT SYSTEM TRAINING] June 11, 2014

Using MindManager 14

Appspace 5.X Reference Guide (Digital Signage) Updated on February 9, 2015

Making a Web Page with Microsoft Publisher 2003

Inserting Graphics into Grant Applications & Other Word Documents

Mastering the JangoMail EditLive HTML Editor

PowerPoint 2007: Basics Learning Guide

Table of Contents. Creating a Newsletter. Loading a Video or Slideshow. Distributing a Newsletter through Exact Target

Making Your Computer Work for You Tips for Windows 7, Laptops, Internet Explorer, MS Office and Adobe Acrobat

Creating and Using Links and Bookmarks in PDF Documents

Content Management System User Guide

Spreadsheet - Introduction

Transcription:

CONTENTS Minimum System Requirements... 3 Design Your Website... 3 Choosing your Theme... 4 Choosing your Header Style... 4-5 Website Content Editor... 6 Text Editor Toolbar features... 6 Main Menu Items... 7 Add new page to the Main Menu List... 8 Add a webpage link to the Main Menu List... 8 Reorder Items in the Main Menu List... 8 Delete Items in Main Menu List... 9-10 Publish Page... 10 Other Exciting Ideas for Teacher Websites... 11 Upload an image... 11-13 Upload and Link documents... 14 16 Create Website Link or Email Link... 17 Embed Videos... 17-18 Page 2 of 18

MINIMUM SYSTEM REQUIREMENTS PC In order to maximize your online experience, OnCourse suggests that you check your computer for the following minimum requirements. Internet Explorer 8.0 or Mozilla Firefox 3.0 (Or Higher) Screen Resolution 1024x768 Adobe Acrobat Reader 8.0 (Or Higher) Microsoft Office Word/Excel Pop-up blockers OnCourse requires that a variety of dialog boxes open. Pop-up blockers should be turned off because they can prevent these dialog boxes from opening properly. System Fonts Set the system fonts to medium in order to achieve a maximum display for the OnCourse screens. DESIGN YOUR WEBSITE Your Teacher website can easily be created using the features that follow. Your website can communicate homework, classroom procedures, contact information and times, calendar events, classroom resources such as helpful links to lesson websites, documents (field trip permission forms, science fair instructions, fund-raiser information, study guides, etc.) and current classroom projects. This is a method to extend your classroom and lessons outside your classroom s four walls. YOUR TEACHER WEBSITE MAIN SECTIONS Header Section Home Page or other web pages you add Main Menu Page 3 of 18

USEFUL TIPS Pencil button allows you to edit specific sections. A link to your website is located at the top of the page. You can copy and paste this link to send to students or colleagues. Changed or deleted pages are archived for your convenience and can be recovered by using the Version dropdown box in the top right of your webpage. There is a website hit counter built into the bottom of each webpage. To organize your website into logical sections, use the table tool from the editor toolbar. This will give you more control of how your content is displayed. DESIGN ASSISTANT The first steps are to choose a Theme and a Header. The Design Assistant allows you to change themes and headers, while you preview the options. THEMES Themes set the color, background, and layout for the webpage. HOW TO CHANGE YOUR THEME 1. From the tool bar and to the left, click Design Assistant. 2. A new screen will load. From this toolbar, select Change Theme. Page 4 of 18

3. Use the arrows to scroll through the available themes or click View All, below the arrow, to view all themes. 4. Click on a theme to preview. The preview will display in the lower half of the window. 5. At the top right, click Save or Save & Close to keep the chosen theme, or click Cancel to return to Edit Website. HEADERS The header allows you to change the graphic at the top of your webpage. HOW TO CHANGE YOUR HEADER PICTURE 1. If you aren t already in the Design Assistant,, click Design Assistant on the tool bar. 2. A new window will open and from this toolbar, select Change Header. 4. Scroll to see choices in this category or choose a different category. Then select a header that is appropriate for your classes. 3. From the Select A Category dropdown on the right hand side, choose a category. 5. Click Save or Save and Close to keep the header or click Cancel to return to Edit Website. Page 5 of 18

HOW TO CHANGE HEADER TEXT The Edit Header Pencil opens the Header Editor to allow you to change your text or add pictures. 6. In the header, click on the Pencil icon. 7. Type in the title of your website; format the text; then click Save and Close. NOTE: Use any of the formatting tools on the text editor toolbar to make your title distinct. The tools are explained on the following page. HOW TO REPOSITION HEADER TEXT The Move Section tool allows you to adjust the text s vertical and horizontal position within the header space. 8. In the header, click on the Move Section icon. 9. Use the slider bars to reposition your text or images within the header. 10. Click OK when you are satisfied. WEBSITE CONTENT EDITOR The website editor is used to edit text on your pages and in your header. To edit any section of your website, click on the Pencil icon page.. This will open the website editor window. The tools to use are shown on the next Page 6 of 18

TEXT EDITOR TOOLBAR A. Find and Replace - Allows you to find text with your webpage. You can also find a word and replace it with another word. B. Print - Prints screen C. Cut Cuts selection from webpage D. Copy Copies selection. E. Paste - Pastes a selection from clipboard. F. Paste from Word Pastes selection from Word complete with Word formatting G. Paste Plain Text Pastes selection with no formatting. H. Undo Undo last change I. Redo Brings back last change. J. Strikethrough text K. Subscript L. Exponent M. Insert Link Link documents and web pages N. Remove Link Breaks link to webpage O. Insert Horizontal Line P. Insert Custom Character Insert characters like mathematical symbols. Q. Erase Erases selection R. Insert table S. Table row properties T. Table cell properties U. Insert row before V. Insert row after W. Delete row X. Insert column before Y. Insert column after Z. Delete column AA. Split merged table cells BB. Merge table cells CC. Image manager Insert images DD. Insert movie clip insert video clips EE. Spell check spell check website FF. HTML view html code MAIN MENU ITEMS EDIT MAIN MENU ITEMS To add, reorder, publish, or delete menu items, click on the Pencil icon, above the menu. A new window appears where you can: 1. Add new page; 2. Reorder how the pages will appear on your main menu; 3. Publish your webpages; 4. Delete any you wish except the Homepage and the Homework & Events web pages. Page 7 of 18

HOW TO ADD A NEW PAGE OR WEB LINK To add a new page 1. Click Add New Page. 2. Create a name for the new page. 3. Checking the Published checkbox will make your new page immediately available on your public website. Leave this unchecked if you do not want this page accessible. To add a link 1. Name your menu item. 2. Enter the web address in the website link box. (Ex: http://www.google.com) 3. Check the Published checkbox to make this link available on your public website. 4. At the bottom right, click the SAVE PAGE button. NOTE: If the Published box is unchecked, you will only be able to see this menu item while you are editing. It will not be visible on the public website. This is a great way to design a webpage for future projects and only publish it at the appropriate time. REORDER ITEMS IN MENU LIST 1. Click and drag the menu item to a new position in the list. Page 8 of 18

DELETE ITEMS IN MENU LIST 1. From the Edit Website Links window, click the Delete button to the right of the menu list item you would like to remove. 2. Click Yes to the Confirm Delete message. HOW TO RESTORE DELETED MENU ITEMS 1. Click on the Deleted Pages sub tab within the Edit Website Links window. Page 9 of 18

2. Use the Deleted On column to determine the version of the menu item you would like to restore. 3. Click the Restore icon next to the version of the page you would like to restore. 4. Click Yes to the Confirm Restore message. NOTE: Notice that the My Hompage and Homework & Events webpages do NOT have a DELETE button. These are default webpages and cannot be deleted. They will always appear on your published Teacher Website. PUBLISH PAGE 1. Click directly on the page name. This will open the Edit Page window. 2. Check the Published checkbox in the Edit Page window. 3. Click Save Page. Page 10 of 18

OTHER EXCITING IDEAS FOR TEACHER WEBSITES Adding more than text to your webpages makes them come alive; such as adding pictures, videos and /or documents for your parents to help their students extend learning at home. IMAGE MANAGER The Image Manager allows you to import clipart, pictures, and digital photos into your website. You can use the Image Manager to change the size and positioning of the image in your site. NOTE: Before you use the Image Manager, you must have image(s) saved on your computer in a location you can readily access. TO UPLOAD A NEW IMAGE 1. From the Website Editor Toolbar, click on the Insert/edit image icon. 2. To browse your computer for an image, click on the Browse icon. 3. The Choose An Image window will appear; click on UPLOAD IMAGE. Page 11 of 18

4. The Upload Your Images window appears, click on Add File(s) 5. Navigate through the file locations on your computer until you find the image you wish to add. Click on the image you would like to insert into your webpage. Then click on OPEN. 6. Your file name will appear in the Upload your images window. Click Upload File(s) icon. 7. You will see the Progress bar growing as the file(s) are being uploaded into OnCourse for your use. 8. Click on the specific file you wish to add to this webpage and then click OK. Page 12 of 18

9. You can click Insert button to place the image into your website OR you can adjust settings in this screen to change the image properties. o Image description a description of the image that will appear when the mouse hovers over the image o Alignment sets the position of the image on your web page (the image can be moved after insertion also.) o Dimensions sets the image size (the size can be adjusted after insertion also.) o Border surrounds the image with a black border. Enter a small number (1-5). The higher the number the thicker the border. NOTE: You can always right-click on the image in the Edit Webpage window and choose Insert/edit image to go back and change any properties you entered originally. o Vertical space o Horizontal space 10. Click Insert if you are ready to place the image into you website. Page 13 of 18

UPLOAD AND LINK DOCUMENTS The Link Documents icon allows you to reference documents in the OnCourse documents folder. NOTE: Documents must be loaded into the OnCourse documents folder through the Documents tab, before they can be linked to your website. 1. First, let s upload a document into your Documents portal in OnCourse. Click on the Documents tab. 2. Click on Add, and then Add Document. 3. Click on Add File(s). 4. Browse through your computer files and locate the file you wish to upload into your OnCourse Document library. Click on the file. (If you wish to upload more than one file, hold the CTRL key while you select all files.) Click OPEN. 5. Once the file(s) are in the Upload window, click Upload File(s). Now your documents are ready to be linked on your Teacher Website for parents and students. 6. Click on My Website tab to return to your Teacher website. Page 14 of 18

7. Click on the Web page where you wish the document s link to be located. 8. Click on the Edit Page icon 9. Type the name or a description of the document that you would like to add to your website. (Ex: Field Trip Permission form) 10. Highlight the name that you just typed. 11. This will activated the Insert/edit Link icon 12. Click on the Browse icon. 13. This will open your OnCourse documents manager folder. Page 15 of 18

14. Click on the document you would like to link and click OK. If you have created folders, then navigate thru the folders and then, click on the document you would like to link. This will bring you back to the Insert/edit link window. 15. The link to the document you selected will be in the Link URL field. 16. You can customize your document link with the Target and Title Tools o Target choose to open your document in the same window or have the document open in a new browser window. o Title Use this field to give your document a title that will appear when you mouse over the document name. o Class Choose a link class for your document. Typically, this is left as --Not set. 17. Click Insert to place your document into your web page. 18. Click Save and Close. Page 16 of 18

HOW TO CREATE LINKS TO WEBSITES AND EMAIL LINKS 1. In the website editor, simply type the name of the website or email address you would like to add and put a space at the end. (Ex: www.google.com or jdoe@anywhere.org ) 2. Once you put a space at end of the link, the link will underline, indicating that it is now an active link to a web site. 3. Click on Save and Close. HOW TO EMBED A VIDEO FROM WINDOWS MEDIA INTO YOUR WEBSITE To embed media, you first need to find the html source code for the video you would like to embed and then you can paste it into the source code editor of your OnCourse webpage. The example below is an embedded Windows Media file. Embedded means that the player itself is embedded or within in the web page. For this to work the person viewing your site must have a media player installed. Embedding a video file is achieved by inserting a block of code called HTML in the web page. There are many variations on the code you can use, depending on whether you want to show video controls, status displays, etc. HOW TO EMBED MEDIA FROM THE INTERNET 1. Locate a video you'd like to add to your page. 2. Locate the Embed or Copy embed code. Click your mouse within that field. All the text in that field is highlighted. HTML code looks similar to the text below: <object width="425" height="344"> <param name="movie" value="http://www.youtube.com/v/gwqmnpusj8i&hl=en& fs=1"> </param><param name="allowfullscreen" value="true"> </param><param name="allowscriptaccess" value="always"> </param><embed Page 17 of 18

3. Right mouse click in that field, and select Copy from your browser's drop down. 4. The embedded code will look similar to the text to the right: src=http://www.youtube.com/v/gwqmnpusj8i&hl=en&fs= 1 type="application /x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"> </embed></object> 5. From the toolbar, click the html icon. 6. Right click in the empty box and select Paste. 7. Click the Update button 8. You will see your embedded file as a box. The video will show when you actually view the saved website. 9. Click Save and Close. Page 18 of 18