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/app to create a simplified url for your link destination.

Setting Colors

Each template comes with varying levels of configuration. As a rule of thumb, if a particular area has a color, then that color can be changed. There are some circumstances, however, where white or light gray areas are not configurable. This has been done intentionally as part of the overall design aesthetic. We suggest that you preview the template before licensing to ensure it will be a perfect fit for your organization. 

• Videos need to be hosted on YouTube, Vimeo or MyVRSpot
• A 16:9 aspect ratio is recommended
  • 720p has dimensions of 1280 x 720 (16:9)
  • 1080p (recommended) 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
• Android and iOS devices restrict video autoplay and require the user to tap the video to play (see setup for mobile options)
• If your video includes sound, turning on the audio control button is recommended
  • The user can still control volume via their computer, but the video audio control button turns sound on/off for the video only, rather than all computer sound
• If your video includes closed captioning, turning on the watch video button is required for accessibility
  • Closed captioning does not display in the streaming window, so the watch video button will open a new window that includes closed captioning

Setting up Streaming Video in the TCW

• Select "Streaming Video" as the Slideshow Feature
• Choose a provider (YouTube, Vimeo or MyVRSpot)
• The streaming video ID is the number/letter combination at the end of the video URL
  • Note: the full video URL will not work in this area
  • The video ID can also be found under the share options where the video is hosted
• The Title, Caption and a Link with a URL are setup within the TCW
• Since Android and iOS devices restrict video auto play, the template has two options to choose from
  • The default displays the video as a paused image with play button and other information that is auto generated through the provider
  • As an alternative, an image can be selected to replace the video on mobile devices. Note: With this option, the video is not available on mobile devices 640px and smaller, but the URL can be added to the link if desired
• The audio button and watch video buttons are toggles that can be activated within the TCW

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

Image Dimensions
• Logo (Only) Dimensions: Max width of 500PX x Max height of 161PX
• Logo (+ Site Name/Tagline) Dimensions: Max width of 150PX x Max height 161PX 
• Overlay Logo Dimensions: Flexible width and height (Recommended: 125PX width x 125PX height)
• Global Icon Dimensions: 25PX width x 25PX height
• Custom Link Spotlight Icon Dimensions: 40PX width x 40PX height
• Spotlight Icon/Link Background Image Dimensions: 850PX width x 566PX height
• Region B | Multimedia Gallery Photo Dimensions: 1500PX width x 885PX height
• Region D | Headline Accent Image Dimensions: Flexible width and height (Recommended: 195PX width x 152PX height)
• Region E | Spotlight Headline Accent Image Dimensions: 352PX width x 255PX height 
• Footer Logo Dimensions: Max width of 125px x Max height of 161px
• Page Background Image Dimensions: 1680PX width x 960PX height
• Subpage Banner Images: 1500PX width x 300PX height

Important Image Naming and File Size Recommendations

• We recommend that you avoid using spaces or special characters in the file name for the images as this can cause them not to display. Hyphens or underscores are acceptable and can be used as substitutes when naming images.
• All files should be kept under 1 MB in size. If you need assistance compressing your files, we recommend Tiny PNG
• Need assistance? Our Creative Services Image Editor makes cropping and sizing photos easy
• 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. 
  
  

Accessing Files & Folders

• Click Configure › Templates › Files & Folders › Site Files to see the folders that pertain to your template assets
• The icons folder (for custom global icons) and images folder (for all other template assets) are default subfolders within the
  Site Files
• Template assets will need to be uploaded to newly created subfolders within the images folder
• Select the images folder and click Folder Actions › New Subfolder and then add an appropriate name for the folder (i.e. logos, background, accent)
• Looking for resources? Find custom icons, stock photography, photo editing and color schemes here
  
  

Uploading Logos | Custom Icons (Global + Custom Link Spotlight)

• Icons and logos need to be PNGs 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 custom icons to the icons folder and logos to the logos subfolder within the images folder 

Background Images (Page Background and Link Spotlight Icon Backgrounds)

• Photos can be JPGs or PNGs, and need to be sized to the correct dimensions prior to upload
• Upload your photos into their respective subfolders created in the images folder (i.e. background, accent)
  
  

Subpage Banner Images

• Photos can be JPGs or PNGs, and need to be sized to the correct dimensions prior to upload
• Photos get uploaded per page by clicking Page Options > Background Image > Select an Image
• These assest do not have to be uploaded to Files and Folders the way other assests do since they are being uploaded directly to the subpage

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

Region A | Content or Announcements App (only)

• This is a hidden app region that only shows when content is made active
• The App Name will not show in this region, even if turned on

Region B | Multimedia Gallery App (only)

• Need assistance? Our Creative Services Image Editor makes cropping and sizing photos easy!

Region C | Any App

• Content in this region displays horizontally
• This region displays the apps as side tabs that open when clicked on

Region D | Any App

• Content in these regions displays horizontally

Region E | Any App

• Content in these regions displays horizontally
• Headlines & Features app displays in a spotlight card style

Region F | Any App (Flex Column 1)

• Content in this region displays vertically

Region G | Any App (Flex Column 2)

• Content in this region displays vertically

Region H | Embed Code (Only)(Flex Column 2)

• Content in this region displays vertically
• This is a tabbed social media region

Region I | Any App (Flex Column 2)

• Content in this region displays vertically

Region J | Any App (Flex Column 3)

• Content in this region displays vertically