• Template Documentation

Template Configuration

  • The Template Configuration Window is where you can preview the template and configure many of the settings and features.

     

    Accessing the Template Configuration Window (TCW)

    Click Configure › Sites › the site you want to edit › Advanced › Change › click on the template thumbnail in the upper left corner › choose the appropriate template

     

    Using the TCW

    • Within the TCW, you will see multiple accordion bars in the left column
    • Within each bar are areas where you can make changes, insert URLs, apply logos, etc
    • Enter the appropriate information and then click Save & Preview to view your changes
    • To publish updates you have made, click Publish & Exit
    • If you are an existing Blackboard client and are not yet ready to go public with your new template, do NOT click Publish & Exit, as that will apply the new template to your website
    • If you want to make changes after the new template is live, you can still click Save & Preview to preview your changes, but then you can also click Publish & Exit to make your changes live 

     

    Unexpected Character Error

    Some characters are not accepted in the TCW. We suggest you add one URL at a time and click save and preview during setup to ensure URLs are accepted. If you receive an error message, use tinyurl.com to create a simplified url for your link destination.

Streaming Video Best Practices & Recommendations

    • Videos need to be hosted on YouTube or Vimeo
    • A 16:9 aspect ratio is recommended
      • 720p has dimensions of 1280 x 720 (16:9)
      • 1080p has dimensions of 1920 x 1080 (16:9)
    • There is no limit or minimum for video length
    • If text is included in the video, keep it centrally located and avoid placing it close to the edge of the video
      • On some monitors a small portion of the video may be cropped at the top or bottom due to the responsive nature of the site
      • On some templates, content may overlay the video. Keep your template layout in mind if including text as part of your video
    • If your video includes sound, turning on the volume control button is recommended
      • The user can still control volume via their computer, but the video volume control button turns sound on/off for the video only, rather than all computer sound

Template Resources | Files & Folders

  • Uploading imagery/graphics to a folder will make them available for application in the Template Configuration Window.

     

    Accessing Files & Folders

    Click Configure › Templates › Files & Folders › Site Files

    • Here you will see the folders that pertain to your template assets
    • Find resources for custom icons, stock photography, photo editing and color schemes here
       

    Custom Icons

    Icon Dimensions: 30PX width  x 30PX height

    • Icons need to be PNG’s with a transparent background, and sized to the correct dimensions prior to upload
    • The color of the icon should be the desired color you would like on the site since custom icons are not color changing
    • Upload your icons into the Icons folder (This folder is built by the system and will already be in place for you)
       

    Logos

    Logo (Only) Dimensions: Max width of 520PX x flexible height

    Logo (+ Site Name/Tagline) Dimensions: Max width of 220PX x flexible height

    • Logos need to be PNG’s with a transparent background, and sized to the correct dimensions prior to upload
    • Upload your logos into the Logos folder (Create a Logos folder under Site Files > Images if this folder does not already exist) 

     

    Watermark Images (behind content in Region A)

    Watermark Image Dimensions: 500PX width x 500PX height

    • Watermark images need to be PNG’s with a transparent background, and sized to the correct dimensions prior to upload
    • It is recommended to knock down the opacity of your watermark image to around 20 or 30%, which is what gives it the "watermark" appearance. You should do this prior to upload. You may leave the watermark image at 100% opacity, but keep in mind that it will sit behind content placed in Region A
    • Upload your watermark images into the watermark images folder (Create a Watermark-Images folder under Site Files > Images if this folder does not already exist)
    • The watermak image is optional and is turned off by default. It can be turned on within the Template Configuration Window under Template Options

     

    Background Images (behind content in Regions D & E)

    Background Image Dimensions: 1500PX width x 915PX height

    • Background images need to be JPG’s and sized to the correct dimensions prior to upload
    • Upload your background images into the background images folder (Create a Background-Images folder under Site Files > Images if this folder does not already exist)
    • If you do not want to feature a background image, simply set the background overlay opacity at 100% and feature a solid color background instead

Homepage Content & Apps

  • This is the recommended app placement based on the homepage region map

     

    Region A | Any App

    Recommended Headline Accent Image Dimensions: 130PX width x 100PX height

    • Content in this region displays vertically
    • This is a fixed height region, so content will scroll if it exceeds the given amount of space
    • NOTE: If a Multimedia Gallery App is not being used in Region B, Region A will not show. Both need to be used simultaneously since Region A is next to Region B.

     

    Region B | Multimedia Gallery App (only)

    Multimedia Gallery Photo Dimensions: 1000PX width x 500PX height

     

    Region C | Any App

    Headline Accent Image Dimensions: 781PX width x 547PX height (height is flexible, but all accent images should have a consistent height)

    MMG Collage Vertical Image Dimensions: 320PX width x 402PX height (images MUST be sized to exact dimensions)

    MMG Collage Horizontal Image Dimensions: 430PX width x 250PX height (images MUST be sized to exact dimensions)

    • Content in this region displays horizontally
    • Headlines and Upcoming Events go into a Content Slider
    • Headlines, Upcoming Events, and Site Shortcuts go into a three column format
    • Want to have more control over the Headlines accent image size on the interior Headlines and Features page? Click here for our pro tip on how to set up the headlines records.
    • If a MMG app is placed in this region it will go into a collage format. Photos need to be sized to specific dimensions and placed in a certain order for the collage to display properly. The collage builds from left to right on the top row of photos and then goes left to right on the bottom row of photos:
      • Photo 1: This is the text that shows in the middle of the collage. Add your title, caption text, and a URL if desired. You have to upload a photo, but the photo will not show on the front end. Only the text will show in the middle of the collage.
      • Photo 2: Vertical photo
      • Photo 3: Horizontal photo
      • Photo 4: Horizontal photo
      • Photo 5: Vertical photo
      • Photo 6: Vertical photo
      • Photo 7: Horizontal photo
      • Photo 8: Horizontal photo
      • Photo 9: Vertical photo

     

    Region D | Any App

    Recommended Headline Accent Image Dimensions: 175PX width x 130PX height

    • Content in this region displays vertically

     

    Region E | Any App

    Recommended Headline Accent Image Dimensions: 130PX width x 100PX height

    • Content in this region displays vertically

     

    Region F | Any App

    Headline Accent Image Dimensions: 781PX width x 547PX height (height is flexible, but all accent images should have a consistent height)

    MMG Collage Vertical Image Dimensions: 320PX width x 402PX height (images MUST be sized to exact dimensions)

    MMG Collage Horizontal Image Dimensions: 430PX width x 250PX height (images MUST be sized to exact dimensions)

    • Content in this region displays horizontally
    • Headlines and Upcoming Events go into a Content Slider
    • Headlines, Upcoming Events, and Site Shortcuts go into a three column format
    • Want to have more control over the Headlines accent image size on the interior Headlines and Features page? Click here for our pro tip on how to set up the headlines records.
    • If a MMG app is placed in this region it will go into a collage format. Photos need to be sized to specific dimensions and placed in a certain order for the collage to display properly. The collage builds from left to right on the top row of photos and then goes left to right on the bottom row of photos:
      • Photo 1: This is the text that shows in the middle of the collage. Add your title, caption text, and a URL if desired. You have to upload a photo, but the photo will not show on the front end. Only the text will show in the middle of the collage.
      • Photo 2: Vertical photo
      • Photo 3: Horizontal photo
      • Photo 4: Horizontal photo
      • Photo 5: Vertical photo
      • Photo 6: Vertical photo
      • Photo 7: Horizontal photo
      • Photo 8: Horizontal photo
      • Photo 9: Vertical photo

  • Notable Features



    Matrix is designed with these Interactive Elements built in:

    • Multimedia Gallery App
    • Color Configurability
    • Streaming Video
    • Content Slider
    • Photo Collage
    • High Contrast Toggle


    Maximum number of global icons:

    6


    Font Information:

    • Body copy is size 16 
    • Fonts used are Noto Serif, Halant, and Open Sans


    Color Information: 

    • The light grey used throughout does not color change and is #F2F2F2

  • App Names

    To turn on an app name:

    • Click on the app

    • Click the Options banner and check the box that says “Show the app name on my page”

  • Contact Info

    To add or edit the address, phone, fax or email in the footer:

    • Click Configure › Sites › the site you want to edit › Contact

    • Add/edit the information and then hit Save

  • Publishing a New Template

    New Blackboard Clients:

    • To publish your new template on your incubation site, go into each site’s Template Configuration Window and click the Publish and Exit button

    • When you are ready to go public with your new website, follow the instructions listed here


    Existing Blackboard Clients:


    • To publish your new template on your live site, go into each site’s Template Configuration Window and click the Publish and Exit button

    • Once your new template has been published, you may need to visit the content on each site’s homepage to reorganize apps as necessary. You can accomplish this by clicking and dragging apps from one region to another.

  • WCM Support

    The normal operating hours for Web Community Manager support are 8:00 AM - 8:00 PM EST Monday – Friday:

    • wcmsupport@blackboard.com 
    • 855.742.5952

  • Help Materials

    The Blackboard Help Center contains a wealth of information and help materials. You can find resources for Web Community Manager here.