Adding & Formatting Images in the
Blackboard Learn Content Editor
The purpose of this tutorial is to show how to fix alignment, spacing, and border issues of images in both the blackboard content editor as well as HTML.
NOTE: Copy/Paste of images no longer supported
As of Spring 2021, the new content editor no longer supports copying and pasting images from programs such as Microsoft Word. You must manually add the images using the (+) tool.
Adding an image
1. Select the circular + Icon from the content editor toolbar.
2. Select between either Inserting a Local File from your Computer, or Inserting from your Content Collection within Blackboard.
NOTE: Also available are Additional Tools; third party integrations including Kaltura, Poll Everywhere, Zoom, and YouTube.
Resizing an image
1. Click on the image so that it is selected. Click and Drag one of the blue boxes on the corners to resize.
2. Alternatively, Right Click on the image and select "Image...". From this menu you are able to edit the image source, add Alt Text, and manually adjust the Width and Height values.
Aligning the Image
1. Click on the image so that it is selected.
2. With the image selected, choose either Align left, Align center, Align right, or Justified to change the alignment of your image.
Adding Horizontal / Vertical Padding / Image Border
1. Select the HTML Source Code button from the Content Editor Toolbar.
2. Locate the code for the image(s) you would like to add padding to.
- Use Ctrl+F or Cmd+F and search for <img to make finding your image files easier.
3. Locate the style attribute. If the image does not have one you may add one by typing style="" after img.
4. Within the quotation marks, add padding: 10px;. Seperate multiple style attributes with semicolons. For example; style="padding:10px; float: left;"
5. The border width can be changed by altering the number in the border: 0px string.
- style="border: 2px solid #000000" will add a black, 2 pixel wide border.
6. Once edited, save and ensure the proper changes were made. Below is HTML text of an image with 10 pixel wide padding and no border.
