Customize the navigator
@minuwan well actually the view already renders the icon https://github.com/artf/grapesjs/blob/94e295ef919dceaade90a3aa36355f2e23935657/src/navigator/view/ItemView.js#L47 but the idea of customizing the render of layers it's not bad.
Read full answer below ↓Question
Is there any way to customize the view of the navigator/layers panel? I need to display an icon in front of each item in the navigator.
Answers (3)
@minuwan well actually the view already renders the icon https://github.com/artf/grapesjs/blob/94e295ef919dceaade90a3aa36355f2e23935657/src/navigator/view/ItemView.js#L47 but the idea of customizing the render of layers it's not bad.
I am not sure what "the navigator" is but since you can create your own panels and whatever, you can customize every bit of the visuals.
Can you be more precise on where you try to add your icons?
@NicoEngler Navigator is the layers panel, GrapesJS called it "The Navigator". Currently, it only contains few configs, but the render it in a different layout or add an icon to a layer item is not possible it seems.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #2364
[Question] How to add toolbar functionality to the layers panel.
I am trying to add the toolbar to the layers panel and I am not sure how to go about this. Is there any way to accomplish this? toolbar Whe...
Issue #3268
How to add javascript in the html without sanitization?
Hey @artf, I am taking javascript input from the user. I need to add this javascript inside the template HTML but it gets sanitized. Is the...
Issue #2196
[Bug] Link element selection shows no toolbar
Steps to reproduce: add Text, select a word, click on Link icon in RTE panel, select a Link. Expected behaviour: when I select Link I expec...
Issue #2355
[req] Rulers support in designer mode?
I know there's an older thread with Rulers support as a suggested roadmap item (but it's been closed) - Just wondering if there's any chanc...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.
Browse free plugins →Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.
Browse premium plugins →Related tutorials
In-depth guides on the same topic.
Tutorial
Super Tooltip for GrapesJS — Version 0.1.5 Released 🎉
We’re excited to announce the v 0.1.5 update of Super Tooltip, our floating‑menu and tooltip plugin for GrapesJS
Tutorial
GrapesJS in 2026: The Complete Guide to the Open-Source Web Builder Framework
Master GrapesJS in 2026. Architecture, code examples, React integration, plugin development, Studio SDK, and how it compares to other projects
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.