Issue #2061Opened June 2, 2019by froderf0 reactions

[QUESTION] How to place a component at the end of the canvas.

Question

How can I put my footer at the end of the canvas?

I want the editor to not allow placing a block/widget below the footer.

example


<!-- only allow dragging/placing of widgets here -->

FOOTER
<!-- Should not have blocks/widgets below this -->

Answers (3)

artfJune 13, 20190 reactions

You can use something like this

const footer = '<div style="padding: 100px">My footer</div>';
editor.getWrapper().getEl().insertAdjacentHTML('afterEnd', footer);
froderfJune 15, 20190 reactions

@artf Do we have something like removeAdjacentHTML() editor.getWrapper().getEl().removeAdjacentHTML('afterEnd', footer);

because when we used

const footer = '<div style="padding: 100px">My footer</div>';
editor.getWrapper().getEl().insertAdjacentHTML('afterEnd', footer);

it keeps duplicating every after you reload the window.


I'm looking for a way to solve this but no luck :( Seems like a bug?

artfJune 15, 20190 reactions

Do we have something like removeAdjacentHTML()

getEl() gives you the HTMLElement instance so insertAdjacentHTML is from DOM API, not GrapesJS

it keeps duplicating every after you reload the window.

... can you create a reproducible demo?

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...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.