How does the editor Element Path work?

The gray “Path” box running along the foot of the editor body will display the HTML element path of the cursor position in the editor body.

An element path is the hierarchy of elements in your document. For example , if you click on a span tag that is within a div tag, it will give you an element path of:

Path: DIV > SPAN

If you were to add an image inside the above span tag and click on the image, it will give you an element path of:

Path: DIV > SPAN > IMG

…and so on.

This is also a great way to access and make changes to elements that are hard to find or see in the design bed. In the above example you can easily find and access the span tag by simply clicking on the inner image.

Element paths are useful in visualizing the structure of your document. Mousing over the a path item will display a block highlighting that element’s position in the editor design body. Clicking on the path item will open a context menu with editing options such as structure editing, tag removal, and tag block deletion options.