We use cookies to offer you a better browsing experience, analyse traffic and personalise content. Read how we use your data in our privacy policy.

Quickview

Display a quick view of data without leaving the current page

Features

  • Show or hide in edit mode
  • Left or right positioning
  • Use any stack as open button
  • Use any stack as the body

  • Deep custom styling for header
  • Optional footer
  • Ideal for slide-in-menus

Example

The example provided here uses a Button to open and a Quickmenu inside.

Edit Mode

The Quickview stack works as an overlay which in edit mode would be cumbersome to have around all the time. Therefore, you can turn it on and off with this switch.
Visible in Edit Mode is turned off by default. If you want to work with the Quickview contents, you must turn this switch on!

Open Button

You can use any stack as the Open Button, such as Button, Icon or Image.
If you plan to use the Button Stack to open the QuickView, be sure to check the "Omit Link" option of the Button, otherwise the background page will "jump" to the top when the modal is opened.

General

You can have Quickview on the left or on the right side with right being the default.
NEW 1.0.1
  • Allow Background Scolling - this switch allows you to control whether the user can scroll the background while QuickView is active
  • Z-Index - gives you the option to control the Z position of Quickview. Only use this if there is a conflict with another stack

Header

  • Color - Besides the standard colors, the Custom option provides color selectors for the header text and the background
  • Divider Color - the color of the divider can be set individually
  • Font Set, Style Set and Cust. CSS Class - open up the advanced features of the Font and Style stacks

Body

  • Color - Besides the standard colors, the Custom option provides color selectors for the body text and the background
  • Use this if the stack you are using as the body contents does not provide these settings

Footer

  • With Footer - switches the footer area on or off
  • Color - Besides the standard colors, the Custom option provides color selectors for the footer text and the background
  • Divider Color - the color of the divider can be set individually

Editing The Content

If you switch to Visible in Edit Mode, the Quickview stack looks like the example below. You can now
  • enter the title
  • drop in any stack as the contents of the body
  • drop in any stack as the contents of the footer