ElementsElement Types & MethodsSlots

Prepend (Beta)

slot.prepend(component)

Add a component instance as the first child of the slot.

Only component instances can be added to slots. Components from installed libraries are not supported; only components in the site’s own component library can be added to a slot. This action is undoable via the Designer’s undo stack.

Beta

These methods are in public beta and may change with future releases.

Syntax

slot.prepend(component: Component): Promise<null>

Parameters

  • component: Component — The component definition to instantiate and insert at the beginning of the slot.

Returns

Promise<null>

A Promise that resolves when the component instance is added.

Example

// Get a component instance on the page
const elements = await webflow.getAllElements();
const componentInstance = elements.find(el => el.type === 'ComponentInstance');
if (componentInstance?.type === 'ComponentInstance') {
  // Get the first slot on the instance
  const slots = await componentInstance.getSlots();
  const firstSlot = slots[0];
  if (firstSlot) {
    // Find the component to add
    const components = await webflow.getAllComponents();
    const cardComponent = await webflow.getComponentByName('Card');
    if (cardComponent) {
      // Prepend a component instance to the slot
      await firstSlot.prepend(cardComponent);
    }
  }
} else {
  console.log('No component instance found');
}

Designer Ability

Designer AbilityLocaleBranchWorkflowSitemode
canDesignAnyAnyCanvasAny