Linking Images to Other Areas within a Blackboard Course

Darek Sady

Introduction:

Many users would like to have images in content areas liked to other areas of that Blackboard course. The complaint is that when images are posted in HTML coding, links can be made to URLs OUTSIDE of Blackboard, but links cannot be made to other areas within the site. In addition, when dealing with an Item or Folder an image placed as a separate content upload (using section 2: "Content") cannot be placed as a hyperlink to anything at all.

Details:

Most users are accustomed to clicking on an image to navigate on the web. Blackboard provides multiple methods of uploading image content, but most users are of the understanding that images with hyperlinks in Blackboard content areas, can only link to external URLs. This is NOT true. Creating image-based links to areas within a Blackboard course can be done with a few extra steps.

Step 1: Build HTML Code (The following example uses FrontPage)

1. Create your HTML code making sure that your SRC tags do not contain paths – only the image names.

Sample Web Layout Corresponding HTML Code

Step 2: Create Course Areas

1. Setup a main folder that will server as your top level for your link structure.

2. Navigate into that folder and setup a folder for each area that you want to link into – in this example, there will be 4 folders, one for each image.

3. It is good practice to name these according to the area.

Step 3: Obtaining Course Link Coding

1. Navigate to one of your newly added Folders.

2. Right-click on the Folder and choose “Properties.”

3. SELECT AND COPY the URL displayed in the Properties dialog box.

4. Use this link for the AHREF tag of the images in your HTML coding.

Step 4: Placing Coded Links in HTML

1. Copy and Paste the URL of each course link into the AHREF tag for each of the images.

2. Repeat these steps to assign each image with it corresponding course link.

Step 6: Posting HTML Code to Blackboard

1. Navigate to your top level folder, and click “Modify.”

2. Copy and Paste the HTML source code into the HTML area of the item and click “Submit.”

3. Click “Submit” to add the item. Note: there will be red X’s in place of your images.

4. Browse for each corresponding image in the “Missing Images” area.

5. Click “Submit.”6. Click “OK.”

Step 6: Posting HTML Code to Blackboard

1. Test your image links for functionality.

2. Move the image item to the top of the page.

Step 7: Testing