Selecting a module and the right inspector

Selecting an element determines which item you are working with, but it does not open the right inspector on its own. You display the module settings using its small gear icon, and the panel then offers only the values that the application knows for this type and can safely save.

What you will learn

  • Select the correct module instance on the canvas or in Layers.
  • Open its inspector using the separate gear icon.
  • Distinguish general options from specific module type settings.
  • Make a change and have it safely saved.
  • Understand why the inspector content changes upon selection.

First, select the exact element

Clicking a row, position, or module only selects and highlights the element. It does not mean that the right inspector will open automatically. You display it using the small gear icon on the specific element. Separating these two steps prevents the panel from popping up on every routine selection on the canvas.

A module can be selected directly on the canvas or in the Layers tree. The tree is useful when several blocks are close together, overlap, or are visually subtle. Selection is intentionally locked in clean Preview mode, so return to editing mode.

Editing mode
Editing mode

Responsive column widths and their visibility are handled in Grid mode. Its inspector works with the selected row and its grid, which is not automatically the standard settings of the position you just clicked.

What you will find in the inspector

General module settings may include title, its HTML tag and class, module wrapper, layout, chrome appearance, CSS suffix, alignment, or assignment to all pages versus homepage only. Below these, fields determined by the schema of the specific module are displayed. Thus, a slideshow offers different options than a menu or a logo.

Closing the panel does not cancel the selection. The element remains active until you select another, so always re-read its name before making further adjustments.

Editing a module step by step

  1. Click on a module on the canvas or on its item in the Layers tree. This only selects it.
  2. Use the small gear icon on the selected module to actually open the right inspector.
  3. Verify the name and type of the selected instance in the right panel.
  4. Change one easily recognizable option, such as title display.
  5. Observe the safe preview. For live data, only representative content may be shown.
  6. Wait for auto-save before proceeding with further major adjustments.

The inspector can be moved aside

You can reposition the panel within the editor when it obscures part of the canvas. Its position is remembered only for the current tab session; it is not an exported template setting.

Next step: Moving, reordering, cloning, and deleting modules.