Using WYSIWYG • Creating a Link • Adding a Photo
Adding a PDF • Creating and Using Anchors
Using WYSIWYG (What You See Is What You Get)
Your Menu
1. Once logged in you will see a list of areas on the website that are “yours.” These
are the areas in which you (and in a few cases other staff) can change and
personalize the website to meet your department’s goals and needs.
2. Navigate to the page you want to change by clicking on a link.
Making Changes, Additions or Deletions to Your Pages
1. Navigate to the page you want to change by clicking the links from your menu
page.
2. Click on one of the opaque buttons
3. Clicking edit will bring up, not surprisingly, the CMS or “editing window.”
4. The CMS or editing window shows the standard editing template
• The editing window functions much the same as your word processing program.
• You can use BOLD, ITALICS or UNDERLINE to lend emphasis to key points.
• Fonts on the website are standardized. As you start typing the appropriate font
will be used.
5. Currently, the CMS edit box is not completely “What You See Is What You Get.”
You may have to play around with picture placement and spacing.
6. Click on the “Save” icon at the top of the screen when you are completed.
If you’ve made a mistake you can also click the cancel button.
7. All changes, additions and deletions must be reviewed by a member of the Web
Site Admin Team. After review your changes will appear on the website.
Creating a link
1. Highlight the text that you want to link to another page.
2. Click on the chain icon
3. Copy and paste the URL of the page you want to link to, in the box to the right of
Image URL.
4. Click on the drop down box called, “Target” , and select the second option from
the top of the list (open in a new window (blank).
5. Click on insert.
Adding a Photo
While you are in the CMS text-edit box, you can add or delete photos.
To delete a photo: move the cursor just past the photo and then use the backspace key to remove the photo.
To add a photo:
1. Choose the space where you want to place the photo with the cursor.
2. Click on the ‘Insert/Edit Image’ button (looks like a green tree in a small square
box)
3. There are two tabs that you’ll use in this feature. If you are adding a new photo,
click on the ‘tablet’ like box to the right of the ‘Image URL’. This will bring you to
the photo storage place, where you can use an existing photo or upload a new
photo to insert.
4. If you are replacing or updating a photo check the ‘Appearance’ tab, before
replacing the old photo. This tab will show you the size parameters of the original
photo (Dimensions ___ x ___px)
5. If you are inserting a new photo, the size parameters will vary by page. Knowing
the dimensions will help you.
6. When you have clicked on the photo you want to insert in the ‘general’ tab. Then
click ‘Insert’ and then OK (don’t need to name the photo at this time).
Adding a PDF
Inserting pdf’s is a cross between inserting a photo and inserting a link to another page. There are two places where pdf’s are located on a web page, in the body of the text and at the top of the page in the upper right corner.
In the Body of the Text:
1. Highlight the text that you want to link to another page.
2. Click on the chain icon
3. Click on the ‘tablet’ like box to the right of the ‘Image URL’. This will bring you to
the document storage place on our website.
4. If you uploading a new file, click the ‘Browse’ button
5. Find the file on your computer and click on the file name. If you need to, click on
‘Open’.
6. This will bring you back to the image uploading box. Click on ‘Upload’
7. Click on the document you want to link to. This will bring you back to the first box
you started with.
8. Click on the drop down box called, “Target” , and select the second option from
the top of the list (open in a new window (blank).
9. Click on insert.
In the upper right corner:
1. Follow steps 1 – 7.
2. Highlight the text information in the “Image URL” box and copy it.
3. Click on ‘Cancel’
4. Scroll down to the bottom of the screen and paste the information you just copied
in the ‘Associate with PDF URL?” box.
5. Click on Save.
Creating and using anchors
Anchors give viewers the option of clicking to a spot further down the page. (For an example go to: http://www.wts.edu/resources/creeds/belgicconfession.html )
1. Place the cursor where you would like the first anchor to appear.
2. Click on the ‘anchor’ symbol.
3. Type in the name of the anchor (each one needs a name)
4. At the top of the page, highlight the text that you want the viewer to click on to
go to the anchor (see
http://www.wts.edu/resources/creeds/belgicconfession.html for an
example).
5. Click on the ‘Chain Icon”
6. Go to the ‘Anchor’ drop down box and choose the anchor name that you want.
7. Click insert.
8. Click Save.
Linking to an anchor on another page:
1. Create a link to the page with the anchor (see creating a link)
2. In the screen where you input the 'link URL', add to the end of this link:
'#anchorname'. Type in the anchor name in the URL exactly as it is written on the
anchored page (include any spaces, characters and capital letters)
