Customise a card#
Figure 1 is an example of a single default card. An individual card can be customised in different ways as explained below. But first, some explanation of the two types of cards, and the different components that can appear on a card.
Types of cards: information and navigation#
The Card Interface understands two types of card: information, and navigation. The following table summarises the major differences between the two types of cards. The type of card is determined by the type of its matching Blackboard item.
Display small bit of information
Provide a link to and display a small bit of information about another resource
Can have numeric card labels
Content Folder, Web link, Discussion board, Assessment item or any other Blackboard item that produces a link to another resource
Figure 2 shows three cards. The first card is an Information card. The other two cards are Navigation cards.
The Information card does not have an engage button as there is nothing to engage with by clicking. It just provides a bit of descriptive text, which in this case talks about the purpose of this page.
The two Navigation cards have an engage button if the mouse is placed over these cards, then (as shown by the second card Figure 2) in the entire card will be surrounded by a blue border. Clicking on a Navigation card will take the visitor to the link pointed to by the card.
The components of a card#
Each card can be made up of many different components. Each component serves a different purpose and can be used to customise the card. Figure 3 shows a single card with labels identifying each of the major components. The following table provides more detail on each component.
A visual intended to help students connect/associate conceptually and emotionally with the item the card represents.
Rather than an image this can be a single background colour.
Provides an indication to students as to when they should work on the item.
Dates can be explicit (Oct 5) or they can be generic and based on the Griffith University calendar (e.g. Week 5)
The date also has a Date Label that can be changed. In Figure 3 the date label is Commencing.
Identifies the type of object the card represents. For Figure 3 the card represents the fifth tutorial.
The Card Interface automatically calculates the number.
The default label is Module but change be changed.
Matches the Name of the Blackboard item.
The Text of the Blackboard item.
Provides an additional visual affordance to the viewer that the card is something to be clicked on.
The text for this button or whether there is a button can be customised for all cards on the current page.
Adding an image#
There are two ways to add (or change) an image, by:
- Image URL (link).
- Image upload.
Image URL (link)
Pre-requisite: To use this approach you must know the URL (link) for the image. For example, the URL - https://djon.es/images/GrandCanyon.jpg is for a photo of the Grand Canyon.
Think twice about using an image URL from the Blackboard content collection
This can cause problems when you copy the course for a new offering.
How to do it
- Edit the content item for the card you with to customise by adding an image.
- Paste the URL for your image after (and on the same line) as Card Image: (e.g. Figure 4)
- Save your changes.
When you view the page, the card should now be displaying the image from the URL you provided (e.g. Figure 5).
Troubleshooting: My card image doesn’t appear
To double check that you have the correct URL for the image open a new browser window and paste the image URL into browser location. Your browser should open and display the image.
If it doesn’t then your image URL is incorrect.
If you have a digital copy of the image, but don’t have or would prefer not to use a URL then you can upload the image into the Blackboard item.
How to do it
- Make sure you have a copy of the image on your computer.
- Edit the content item for your card.
- Use these instructions to embed an image in the content item and ensure that the Image Description is Card Image.
It is suggested you embed the image at the bottom of the content item to make it easy to edit the other content.
Figure 6 shows the same content item as Figure 4, but in this case the image is being uploaded into Blackboard. This content item will produce a card that looks the same as Figure 5.