Canvas Types

The different canvas types in Showit and how to use them

Jason Lackey avatar
Written by Jason Lackey
Updated over a week ago

The Canvas Type setting in the Showit Design App affects the size of your canvases on the live version of your site. There are three different canvas types inside of Showit: Normal, Window Height and Grow with Content.

Normal Canvas

A normal canvas allows you to set the canvas height to any number of pixels you want. Using a Normal canvas type, your canvas height will appear exactly as it is set in the Design App. There are no minimum or maximum height requirements.

Window Height

A canvas set to Window Height is designed to utilize the full height of the user’s browser window and will resize the canvas as a browser window is resized. A canvas set to Window Height requires that you set a minimum canvas height for the canvas and when the window height of the canvas is taller than the minimum you have set the canvas will grow, keeping the content centered vertically.

Note: If a Canvas is set to Window Height and also set as Sticky, there’s a possibility that some of the Canvas will be cropped. This can potentially hide content if the Canvas’ Minimum Height is greater than the website visitor’s browser height. We’d recommend adjusting the Minimum Height to 600 or less for desktop and 400 or less for Mobile.

Grow with Content

This feature is for WordPress Blog Template pages. More specifically, this is for canvases that contain WordPress Placeholder Fields that contain content that overflows or is larger than the original size of the text field. The canvas will grow only if it contains WordPress placeholder fields containing content that is bigger than the text box.

Elements in a Grow With Content canvas can be Edge Locked to the bottom in order to make them reposition and/or grow with the canvas, based on the amount content that gets displayed in the WordPress Placeholder Field(s).

If you haven't yet visited our learning hub we highly suggest starting there to build the foundational knowledge you need to launch the site of your dreams with Showit!

Did this answer your question?