Guide for Setting up Faculty's WordPress-based Websites

NOVA is providing a WordPress-based template for faculty to build their own professional websites, which does not require any web building tool and skill. And, it can be done by using a PC or a MAC. In this guide, we use John Smith's website as the example, step by step, explain how to use this template to build a website. The guide includes the following contents:
  • Requesting an account and Starting Your New WordPress-based Website
  • Change your password and add your contact information
  • Changing the Tagline (the description of your website or your title & campus)
  • Creating a Basic Post
  • Formatting Text
  • Creating Links
  • Adding Images to a Post
  • Adding course syllabi and other files to a Post
  • Updating the website
  • Keeping an important Post on Top

Step 1. Requesting an account and Starting Your New WordPress-based Website

1. Please request an account by sending an email to wsdm@nvcc.edu including:
a. Your preferred email address (NVCC or VCCS)
b. Your full name

2. You will receive an email from "NOVA Blog" soon. By default, your website address should be:
http://blogs.nvcc.edu/userID
Your "userID" should be the same as your email and LAN account ID.

After your new account has been created, you will see it with the college's template like the following.

wp01

Please read the email carefully, use the provided username, password and link to login to your new WordPress-based website.



Step 2. Change your password and add your contact information

The password provided by the college is temporary. Please follow the steps below to change it.

a. After login, find your username (not your full name!) in the gray bar at the top on the right (see below).

wp02

b. Click your username, a new page comes up.
c. Scroll to the bottom of the page and look for "New Password"
d. Enter your new password twice, then click on Update Profile
e. Add your contact information, "Office Phone," "Office Location," "Office Hours," etc., click on the Update Profile. You may ignore "Website" and "Biographical Info." (see below)

wp3

View your website

You may view your website now to see what you have done. Please move the cursor to your full name, not your username, on the top left of the screen, a small drop-down menu will appear. In the drop-down, click on the "Visit Site," and now you will be able to view how your site looks.

wp3a

Your website should look like this:

wp04

To return to the Dashboard and continue working on your website, move the cursor to your full name to the left of the screen, a small drop-down menu will appear. The drop-down menu includes several items, click on the first item called Dashboard. This will take you back to the Dashboard interface where you can continue working on your website.

wp04

You have the ability to switch between the Dashboard and view mode using these aforementioned method.



Step 3. Changing the Tagline (the description of your website or your title & campus)
By default it says "Just another Nova Blog site" (See the figure above).

To switch from view mode as the above to edit mode, please move the cursor to the name "John Smith" on the left at the top, a small drop-down menu appears, then click on the "Dashboard".

wp04a

To change the tagline
1. from the dashboard, click on the Settings tab (on the left-hand side)
2. Click on the General (see below)

wp05

3. Replace the text "Just another Nova Blog Site" in the Tagline field
4. Click on the Save Changes (blue button at the bottom on the left)

wp06


Step 4. Creating a Basic Post

The NOVA WordPress-based website template is built on the code with blogging features, including "post", the basic unit of information published on the web.

1. Move cursor to "+ New" in the gray bar at the top, click on the "Post"

wp07

2. Enter a title
3. Type your entry
4. Click on either the Save Draft or Publish button on the right

wp08


Step 5. Formatting Text

Editing your posts and pages is similar to using Microsoft Word. Click the Show/Hide Kitchen Sink button to reveal more formatting options, including "Paste as Plain Text" and "Paste From Word."

wp09

The first post has been completed as below.

wp10


Step 6. Creating Links

So far, the first post has been created with title "Welcome to my website!"

Suppose we want to create links for both "Northern Virginia Community College" and "University of Washington". Their links are:
http://www.nvcc.edu, and
http://www.washington.edu/

1. please move the cursor to the name "John Smith" on the left at the top, a small drop-down menu appears, then click on the "Dashboard".
2. Click on the "Posts", then the "All Posts"

wp11

3. The links we want to create will be in the post with the title "Welcome to my website!". Please move the cursor to the check box besides the title, four menu items appear.

wp11a

Please click on the "Edit", the editable texts of this post appear as below.

wp12

4. Highlight "Northern Virginia Community College", click on the "Insert/edit link" button (see the figure below).

wp13

5. After a "Insert/edit link" window appears, put the URL of NOVA's website in the box for URL. You do not need to put in anything in the box for "Title". Then click on the "Add Link" button. (see the figure below).

wp14

6. Follow the same procedure to add the link for "University of Washington".
7. click on the "Update" button on the right.

8. If you want to remove a link, say, to remove the link for "University of Washington", please highlight the "University of Washington", move the cursor to the "Unlink" button (with a "broken chain" image), click on it to take off the link.

wp15

9. click on the "Update" button on the right.



Step 7. Adding Images to a Post

If you see a picture on a website without copyright that you would like it to become a part of your website, you may simply copy it by right-clicking the picture on the web, move the cursor to the place where you want the picture to go on your website, right-clicking the mouse, and choose "Paste". Normally, you can get pictures from other websites to your website this way, as long as there is no copyright issue.

If you want to add a photo from your computer to your website, please follow the instructions below. Here we are adding a photo of the University of Washington.

1. Make sure you have your post in edit mode, place your cursor where you would like your image to go
2. Click on the Upload/Insert (see the following figure).

wp16

3. An "Add Media" window appears. Click on "Select Files" button (see the following figure).

wp17

4. A "File Upload" window appears. Select the photo "University of Washington.jpg", click "Open" (see the following figure).

wp18

5. Now the photo has been uploaded to the "Add Media" window, scroll down, and give "University of Washington" to both boxes of Title and Alternate Text. It is optional to give the photo a caption and a description.
Choose an alignment and a size (you may do nothing and let the system pick what they are).
Click on the Insert into Post button (see the following figure).

wp19

6. The photo "University of Washington" has been successfully inserted into the post. Click on the Update button (see the following figure).

wp20



Step 8. Adding course syllabi and other files to a Post

1. Make sure you have your post in edit mode, place your cursor where you would like your image to go
2. Click on the Upload/Insert (see the following figure).

wp16

3. An "Add Media" window appears. Click on "Select Files" button (see the following figure).

wp17

4. A "File Upload" window appears. Select the file "Syllabus_PHY232.pdf", click "Open" (see the following figure).

wp21

5. Click on the Insert into Post button (see the following figure).

wp22

6. The file "Syllabus_PHY232.pdf" has been successfully inserted into the post. Click on the Update button (see the following figure).

wp23

You may add other files, such as Word or PowerPoint files, to a post in a similar way.

Let's switch to view mode by clicking on the "Visit Site" under the name "John Smith", and see how the post looks like (see the following figure).

wp24

The website now has a syllabus, in addition to the new photo "University of Washington". Since we are still in the edit mode, we can see the top menu including "My Sites, name (John Smith), and + New. (see the following figure).

wp25

After clicking on the "Log Out", the interface return to login mode as:

wp26

The website should now look like this (without login):

wp27



Step 9. Updating the website

1. Open the website, click on the "Log in" at the bottom on the left, to open the login page as:

wp26

2. Enter the username and password, click on the Log In button, the edit mode of the website shows up. Then you can edit your posts.

3. After entering the edit mode of the website, you can list all posts by clicking on the "All Posts" after moving the cursor on the "Posts" (see the following figure).

wp28

4. In John Smith's website here, there are two posts. After move the cursor to the title "Hello World!", a menu with 4 items under the title appears. Click on the Edit to update the post, or click on Trash to delete it.

wp29



Step 10. Keeping an important Post on Top

The new post will always stay on top and the old post is pushed down. When you have an important announcement to make on your website, or you want a particular post, you want to make sure that all of the visitors to the website see it. If you continue to publish posts, a normal post will get buried beneath the most recent posts. WordPress allows you to bypass the normal posting options by using a "sticky" post. A sticky post is a post that remains at the top of your website regardless of how many posts you write after it.

1. Go to Dashboard (edit mode), click on "Posts" and "All Posts", open the post that you want to stay on top. Here John Smith wants his "Welcome to my website!" on top.

2. Click on the "Edit" link next to the "Visibility" option in the Publish section on the right side of the page (see the figure below).

wp30

3. Click on the check box next to the "Stick this post to the front page" option to select it.

4. Click on the "Publish" or "Update" button at the bottom of the Publish section. The post will now remain at the top of your website. The other posts will appear in reverse chronological order beneath the post you selected (see the figure below).

wp31



More questions? Need additional help? Please contact IS&D in AA337, or via email at al_is&d@nvcc.edu.