How can I "display" an image in Bb instead of just having a link to the image?

Occasionally, you might want to DISPLAY an image in Bb (have it show on the screen without you having to click a link to see it). There are several ways to do this, but you can also use Bb and a tiny bit of HTML code to accomplish this.

We do this by loading the image into Bb the traditional way (which just creates a link to the image) - but Bb stores that image in a particular location ... once we know the location, we use the <IMG> tag in HTML to have Bb SHOW the image instead of show the link to the image. Yeah, us!

Step 1) First, load up your image the traditional way (creating the link we want to avoid). You might do this in some sub-folder on the Bb site called IMAGES (just to keep the links out of the way of the normal traffic).

Step 2) Either in that "control panel view", or in the regular view ... find that link, and if you hover your mouse over it, you'll see the actual path where the file is stored (by Bb) {blue oval below}. You should RIGHT-CLICK on the link (ken_bridge.jpg), and from the popup dialog, select COPY SHORTCUT.

Step 3) Go add an "item" in the content area where you want the image to be stored, and click in the text box with the mouse (to put the cursor there) and press CTRL-V to paste in the link (or use the Edit menu and choose paste) [ shown in line 1 ]. Then add the following code around it [shown in line 2]. The final version should look like line 3. The text box should look like the lower image. [Obviously, you could add a "Name" in the box above the text box - maybe the name of the image?]

Step 4) Now if you go back and look at the "item" you added - you'll see the image showing, instead of the link. [Note, I chose to put the "image" right after the "link" - so you can see the "old way" and the NEW way!]

Some comments:

1. It would be very "kind" to Blackboard to not load up HUGE files - something in the range of 640x480 is a great size to display easily!
2. This trick only works "within" a particular Bb course/organization - if you try to reach outside to some other content .. you "might" get it to work, but only if everyone seeing it has access to that other site. Stay within your own site if possible.
3. It would be a great idea to create a folder somewhere, and put the original "links" in that out of the way folder - then you can put the "image tags" {.. the <img> stuff} wherever you want.
4. Having said comment #2 - if you happen to have images stored on some external website (not Bb) - then this "image tag" trick will work fine - instead of the internal Bb shortcut (web address) - just put the outside webpage address inside the <IMG> tag - and you are off and running! [Obviously, this also means that the distant image needs to be accessable by anyone. But, it avoids the issue of having to load the image in Bb and then search for the weird link address.]

Return to the Laptop help page

Last Updated = Thursday, 14-Dec-2006 09:23:26 EST         Of the 4 people that have visited this site, you are the most recent.