ConvertexThe Inspector
The inspector lets you select, examine, and manipulate elements directly in the preview. It is a powerful tool for understanding the structure of your page and converting only the parts you are interested in.
Activating the Inspector
The inspector is activated from the preview toolbar. Once activated, the preview behavior changes: instead of navigating normally, you can interact with individual elements on the page.
Inspecting Elements
Hovering
Hover over any element in the preview to see its information displayed:
- HTML tag: the element type (
div,section,h1,img, etc.) - CSS classes: the classes applied to the element
- Styles: the active CSS properties on the element
Hovering highlights the targeted element, allowing you to precisely visualize its boundaries on the page.
Selection
Click an element to select it. The selected element remains highlighted and its detailed information is displayed persistently.
Partial Conversion
One of the most useful features of the inspector is partial conversion. Instead of converting the entire page at once, you can:
Activate the inspector
Click the inspector button in the preview toolbar.
Select an element
Click on the section or component you want to convert.
Convert the selection
Run the conversion. Only the selected element (and its children) will be converted.
Partial conversion is ideal for long templates or complex pages. Convert section by section for a cleaner and more controlled result.
Deleting Elements
The inspector also lets you delete elements directly in the preview. This is useful for cleaning up a template before conversion:
- Select the element to remove
- Delete it via the delete button
- Undo if needed: the deletion is reversible
Deletion only modifies the preview, not your source code. Reload the preview to restore the deleted element, or use the undo button.
Common Use Cases
Cleaning up a template before conversion
You have a downloaded HTML template with sections you do not need (footer, promotional banners, etc.). Use the inspector to delete those elements before converting the rest.
Converting section by section
For a long page, converting everything at once can produce a bulky result. With the inspector, select and convert each section individually. This gives you fine-grained control over the result and makes it easier to paste into Webflow Designer.
Identifying a component's structure
Hover over elements to understand how a component is structured (which tags are used, which classes are applied). This is useful for deciding which parts to convert or modify.