Does the size of my banner image matter?

Note: This article is relevant to the legacy DesignPLUS Sidebar installed before July 2023. If your institution installed or updated the DesignPLUS Sidebar after July 2023, please check the New Sidebar Guides and the New Sidebar FAQ.

Since Canvas' max-width for images is 1100px, we recommend banners be at least 1100px wide to prevent pixelated resolution.  A 10:3 ratio (1100px by 330px) is recommended by Cidi Labs because DesignPLUS has Front Page themes that may not work properly without this ratio for the image.  Without enough height on the banner image, the overlaying links on the navigation block can overflow. The images below show two themes with (green arrows) and without (red arrows) a 10:3 ratio for banner image.


Basic Color (Panel Navigation) Front Page Theme


Ribbon Front Page Theme

The Front Page themes that need 10:3 ratio are:

  • Basic Color (Panel Navigation)*
  • Bookmark
  • Circle Left 
  • Circle Overlay 
  • Ribbons

*Instead of 8 links, Basic Color (Panel Navigation) requires 10:3 ratio for 4 links in the navigation block.


It's important to note that these Front Page themes will not experience any problems if the designer removes the navigation block from the banner.  Also, all of the Basic Page theme options will work with any size banner image.


If you have banner images that are not 10:3 ratio and would like to keep them but avoid the issues described above, you can disable themes for your institution.  DesignPLUS allows institutions to customize which themes are available to users. You can disable Basic Color (Panel Navigation) and any of the other themes listed above to avoid problems. If you choose to disable these themes, there are still 22 other Front Page themes DesignPLUS offers.