Knowledgebase

Advanced Properties control how a section is displayed, styled, animated, and shown across different screen sizes. These settings affect only the selected section.

Display

• Section Name: Internal identifier and anchor name. Letters, numbers, and underscores only.

• Width: Controls standard vs 100% width and padding behavior. Full-width options are not available for subsections.

• Font Color: Default, Light, or Dark text styling.

• Padding / Margin: Pixel-based or percentage-based spacing for each side of the section. Defaults vary for sections vs subsections.

Background

• Background Color: Supports solid and RGBA colors.

• Background Image: Select an image from the media library (1600px wide recommended).

• Position / Repeat: Controls image placement and repetition.

• Parallax: Optional scroll effects (desktop only).

• Parallax Speed: Controls scroll movement rate.

• Background Video: Optional video URL displayed behind content.

Shape

• Shape: Apply a CSS clip-path to the section using presets or a custom value.

• Shape on Hover: Alternate shape applied on mouse hover.

• Shape Animation Duration: Time (in seconds) for the hover transition.

• Borders & Corners: Border color, per-side border thickness, and rounded corners.

• Live Preview: Updates as values change.

Animation

On Load

• Animation: Entry animation applied when the section appears.

• Duration: Length of one animation cycle.

• Iterations: Number of times the animation runs (or infinite).

• Delay: Time before the animation starts.

On Hover

• Hover Animation: Optional hover-based motion effects.

Devices

Control section visibility and alignment per screen size:

• X-Small, Small, Medium, Large, X-Large

• Toggle visibility on/off per breakpoint

• Set alignment per breakpoint (Left, Center, Right)

Pop-ups (if enabled)

• Create and manage pop-ups associated with the section.

• Control placement, page types, and enabled state.

Advanced

• CSS Classes: Add custom class names for shapes, backgrounds, or the section.

• CSS Styles: Add inline CSS styles for advanced customization.