Skip to main content
Search

How to Drag & Drop Blocks

Posted

Introduction

Our editor allows you to create stunning eBay listings, websites, or templates using a simple drag-and-drop interface. This means you can visually arrange sections, columns, text, images, and other blocks without writing any code.

This guide walks you through how to use the drag-and-drop functionality effectively so you can build layouts faster and with more precision.

Step 1: Open the Block Panel

  1. Click the Blocks button in the left sidebar.
  2. You’ll see various categories such as Layout, Basic, eBay Blocks, and Custom Blocks.
  3. Hover over a block to preview its design.

Tip: You can expand or collapse categories to quickly find the block you need.

Step 2: Drag a Block onto the Canvas

  1. Select a block from the panel by clicking and holding it.
  2. Drag the block onto the canvas area where you want it to appear.
  3. Release the mouse to drop the block in place.

Visual Cue: While dragging, potential drop zones will be highlighted in blue to indicate where the block can be placed.

Step 3: Arrange Your Blocks

  • Once a block is on the canvas, you can drag it to a new position.
  • Use the blue highlighted areas to align the block with existing sections or columns.
  • Blocks automatically snap into place for precise layout alignment.

Step 4: Edit Block Content

After placing a block:

  1. Click on the block to select it.
  2. Edit its content directly on the canvas (e.g., text, images, titles).
  3. Use the Style Manager to adjust fonts, colors, spacing, and other visual properties.

Pro Tip: Double-click a block to open the Style Manager quickly and make design adjustments.

Step 5: Save Your Changes

Click the Save button in the top options panel to save your template.

  • If you try to leave without saving, a prompt will appear reminding you about unsaved changes.

Best Practices

  • Start with layout blocks (Sections & Columns) before adding content blocks like Text, Image, or Buttons.
  • Limit excessive nesting of blocks to maintain performance and clarity.
  • Use preview mode to test how your layout looks on desktop and mobile.
Table of Contents