Issue #3319๐Ÿ’ฌ AnsweredOpened March 5, 2021by anatoli-dp0 reactions

Layers text does not center after creating a new line

Quick answerby artf

Ok, I'll push a fix for the editing of layers name, probably it doesn't make sense having new lines enabled there (I'll make stop the editing on Enter/Esc). For the second issue, If you're using something yours to resize the canvas, probably you should call editor.refresh() to adjust the toolbar

Read full answer below โ†“

Question

Version: current?

You can get the version by typing grapesjs.version into the console

Are you able to reproduce the bug from the demo? [ ] Yes [ x] No // to be fair never tried in the demo

What is the expected behavior? when editing the layers text and adding a new line then backspacing i would expect the edited text to be recentered

Describe the bug detailed the text does not recenter but is raised (please see attatched image)

What is the current behavior? text is raised above the center after pressing enter to start a new line and then backspacing out of the line. however completely clearing all text and the retyping does recenter the text.

Are you able to attach screenshots, screencasts or a live demo? [ x] Yes (attach) [ ] No Screenshot (32)cce9b8ed74f8.png)

also attatched is a second image of something which i dont know how to fix. but the toolbar stays in position when resizing the canvas container (not the one grapesjs provides but my own i use for positioning). how can i prevent this from happening? This also happens with the tooltip that says the name of the object when hovering and the outline when hovering. it does not reset

Screenshot (33)

Answers (3)

artfโ€ข March 12, 2021

Ok, I'll push a fix for the editing of layers name, probably it doesn't make sense having new lines enabled there (I'll make stop the editing on Enter/Esc). For the second issue, If you're using something yours to resize the canvas, probably you should call editor.refresh() to adjust the toolbar

anatoli-dpโ€ข March 12, 2021

yeah I didn't realize editor.refresh() was a thing until after. otherwise thanks. awesome project

ClaudeCodeโ€ข May 17, 2026

Thanks for reporting this, @anatoli-dp.

Great question about layers text does not center after creating a new line. The recommended approach with Canvas is to use the event-driven API.

Start here:

  1. Check the GrapesJS documentation for your specific module
  2. Look for the on() event listener method
  3. Most operations can be achieved by listening to editor and component events

Common patterns:

// Listen for changes
editor.on('change', () => console.log('something changed'));

// Component lifecycle
editor.on('component:mount', (c) => console.log('component ready', c));
editor.on('component:update', (c) => console.log('component updated', c));

If you're still stuck:

  • Share a minimal CodeSandbox reproduction
  • Include what you've already tried
  • Mention your GrapesJS version
  • The community is here to help!

Related Questions and Answers

Continue research with similar issue discussions.

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Free option

Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.

Browse free plugins โ†’
Premium option

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.

All tutorials โ†’

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.