Web Editing Tutorial

TABLE OF CONTENTS

  1. Logging in
  2. Editing existing pages
  3. Creating new pages
  4. Uploading images
  5. Uploading PDFs and other documents
  6. Interactive forms

Logging in

Clicking the Log in link in the upper-right corner of any page will bring up the standard UCLA Logon form. Upon successful login, you will be returned to the page you were visiting before you clicked the Log in link. This login process will allow you to edit existing content and publish new content to the website.

Log in link


Editing existing pages

To edit existing pages, news items, or events you will need to log in. Once logged in, browse the page you want to edit. Click the Edit button near the top of the page.

Edit button

Clicking Edit brings up the standard WYSIWYG editor for all content types: pages, news items, events, etc. At the top of the editor is a toolbar that provides editing functions such as bold, italic, alignment, bullets, and numbering. The toolbar also allows you to create links and insert images.

To use the toolbar, select (highlight) the text you want to format, and click the appropriate formatting icon. For example, to make text bold, select the text in question and click the Bold icon.

Toolbar - Bold icon

To add structural formatting to your document (headings, subheadings, and so on) select the text in question, click the Styles menu, and select the appropriate style.

Toolbar - Styles menu

When pasting text copied from Microsoft Word or Outlook, use the Paste from Word icon. This will strip out any formatting that would otherwise be copied over from the source document or e-mail.

Toolbar - Paste from Word icon

To remove any unwanted formatting, select the text in question and click the Remove Format icon.

Toolbar - Remove Format icon


Create links

To create a link, select the text you want to be the link and click the link icon.

Toolbar link button

To create an internal link: Select Link to a page on this site as the Link Type. In the Link textbox, begin typing the title of the page you want the link to point to (e.g. Areas of Study). The Link dialog box will suggest pages with matching titles. Select the correct page title and click the OK button.

Internal Link dialog

To create an external link: Select URL as the Link Type and paste the address of the destination link into the URL textbox. This should be an absolute address to an external website (such as http://www.ucla.edu).

Link dialog

Click the OK button and then click the Save button to save your changes.


Or, to link to a document (e.g., PDF or Word), click link icon and then click the Browse Server button.

  1. Click the documents folder on the left side of the File Browser.
  2. Search for a previously uploaded file in the documents folder.
  3. Click the Insert file button.

    File browser

    Note: Browse Server does not allow you to search for webpages.

  4. Click the OK button and then click the Save button to save your changes.

Insert images

To insert an image, you must first upload the image. Once the image is uploaded, return to the page where you want to insert the image. Click the Edit button to edit the page. Place the cursor where you want to insert the image and and then click the image icon in the toolbar.

Insert image 1

Click the Browse Server button.

Insert image 2

  1. Click the Images folder on the left side of the File Browser.
  2. Search for your image.
  3. Click the Insert image button.

    Insert image 3

Type a meaningful description for your image in the Alternative Text textbox and click the OK button.

Insert image 4

Click the Save button to save your changes.


Creating new pages

To create a new page, you will need to log in. Once logged in, click the Add Basic page button in the grey Shortcut Bar.

Add Basic page

  1. Give the new page a short, but meaningful title.
  2. Add text to the new page. Note: when pasting text copied from Microsoft Word or Outlook, use the Paste from Word button. This will strip out any formatting that would otherwise be copied over from the source document or e-mail.
    Paste from Word
  3. Place a check in the Provide a menu link checkbox.

    Edit Basic page

  4. The page Title generally determines the Menu link title, but you can change the Menu link title here.
  5. Select the appropriate Parent item (i.e. place your new page under the existing page or section to which your new content belongs). This determines where on the site your new page appears and where visitors to the site will find your page when browsing via the site Menu. Note: do not place the your new page in the <Main Menu>. This will cause your page to be hidden from the site navigation.
  6. Click the Save button to save your changes.

    Edit Menu


Uploading images

To upload an image, you will need to log in. Once logged in, click the Add Image button in the grey Shortcut Bar.

Add image

Give the new image a title and browse for the image file on your computer:

  1. Add a reasonable title for the image and then click on the Choose File button.
  2. Select the image file you want to upload and click Open (or, depending on your browser, click Choose).
  3. Click the Save button to upload your image.

Add image

Note: we recommend entering a meaningful, appropriate title for the picture being uploaded. The more unique the name is, the easier it will be to find that image later.


Uploading PDFs and other documents

To upload a file (e.g. PDF or Word), you will need to log in. Once logged in, click the Add File button in the grey Shortcut Bar.

Add file

Give the new file a title and browse for the document on your computer:

  1. Add a reasonable title for the file and then click on the Choose File button.
  2. Select the document you want to upload and click Open (or, depending on your browser, click Choose). PDF, Word, Excel, and PowerPoint files are allowed. Note: for optimal viewing, consider converting your Microsoft Office files to PDF. For help converting files to PDF, please submit a Help Desk request.
  3. Click the Save button to upload your file.

Upload file

Note: we recommend entering a meaningful, appropriate title for the file being uploaded. The more unique the name is, the easier it will be to find that file later.


Interactive forms

Psych IT can create interactive forms for the department website. See the Contact Us form as an example. If you would like to add an interactive form to your section of the site, please submit a helpdesk request.