Canvas VS Content mode

Smart Slider 3 has two different editing mode: Canvas and Content. In this article, we'll go through the basic differences and some use cases to help you decide which mode to use.

Slide building experience

Content Mode Canvas Mode
Structured building. You can move the layers with margins and vertical alignment of the column they're in. Sort of like a page builder. Free editor, you can drag layers anywhere.

Responsive behavior

The most important difference between the two modes is the responsive behavior. The table below shows the most common responsive issues and whether or not you'll need to make adjustments to ensure the correct look.
Responsive issue Content Mode Canvas Mode
Legibility - content isn't readable Not an issue. ( Adaptive sizing is turned on the Content layer.) Possibly an issue. Font size modifier is advised for different views.
Slider height - slider is too small on mobile Not an issue. (Content mode can adjust the height based on the tallest slide in the slider.) Likely an issue especially with content heavy slides. Custom slider sizes or hiding layers are advised.
Layers overlapping Not an issue. (Unless the layers were set up using negative margins.) Possibly an issue. Take a look at the alignment or chain layers.
Manual layer adjustments on different views Not needed. (Columns automatically break on mobile.) It's very likely that the layers need to be moved to achieve a correct look

Other responsive issues might occur in Canvas mode, but Content mode handles them by default.



Which responsive mode should I use?

You can achieve most layouts in Content mode, so you should use that. There are tutorial videos to learn the basics. This knowledge will help you create anything you want.

Pure Content mode sliders

They're great for most layouts you'll create.

Pure Canvas mode sliders

If you need layers to (partially) cover each other, or if you are using special layer animations/events.


In some cases you can build 90% of the layout with Content mode, but you need Canvas mode to position some layers. E.g.:

Frequently asked questions

How do I move a layer from Canvas to Content mode?
  1. Switch to Content mode
  2. Drag the layer to actually move it to Content mode
How do I move a layer from Content to Canvas mode?
  1. Switch to Canvas mode
  2. Drag the layer to actually move it to Canvas mode