Tool Panel

One Column Widget

One Column Widget

The One Column Widget provides a single-column layout container. It can hold one addon or content block and supports background images, padding, and theme styling. Use this widget to wrap another widget with specific styling such as a background image or padding.

Common Tasks

Adding the Widget to a Page

  1. Navigate to the page in the Contensive page editor.
  2. Click the widget tool to open the widget panel.
  3. Find the One Column Widget in the Design Blocks category.
  4. Drag the widget onto the page at the desired location.

Adding Content to the Column

  1. Click the edit icon on the One Column Widget.
  2. Use the Addon for First Column dropdown to select the addon or widget to display inside the column.

Changing Column Content

  1. Click the edit icon on the widget.
  2. Change the Addon for First Column selection to a different addon.

Styling the Widget

  • Open the advanced editor to access the Styles tab.
  • Set padding (top, right, bottom, left) to control spacing around the column content.
  • Choose a Theme Style to apply a predefined look.
  • Set a Background Image on the Background tab to place content over a background.
  • Enable As Full Bleed for edge-to-edge rendering.
  • Set a specific Height if needed.

Removing the Widget

  • Click the edit icon on the widget and open the advanced editor.
  • Set the Active field to "No" on the Control Info tab to hide it, or delete the record to remove it permanently.

Edit Dialog Fields

Field Description
Addon for First Column Select the addon to display in the column
Active Enable or disable this widget
Sort Order Controls the display order when multiple widgets are on the page

Advanced Edit Fields

Field Tab Description
Name Control Info Internal name for this widget
Pad Top Styles Add top padding to the widget
Pad Right Styles Add right padding to the widget
Pad Bottom Styles Add bottom padding to the widget
Pad Left Styles Add left padding to the widget
As Full Bleed Styles Include margins for content
Height Styles Set a specific height with units
Theme Style Styles Select a layout wrapper class from Design Block Themes
Button Style Styles CSS class for buttons (default: "btn btn-primary")
Background Image Background Set a background image for the widget