Builder content link
Builder public api key
097a76e23f5a4b23aaa3f9a0d58e6565
What are you trying to accomplish
We would like for our client to be able to drag Symbols from the Insert tab into a page, using Absolute positioning for a Figma-like experience.
-
To fit this use case, we would love to be able to use the Canvas element for the client to position elements in. However, we notice that while Templates can be dragged-and-dropped from the Insert tab into a Canvas element (albeit with some strange sizing issues), when we try to do the same with a Symbol, it refuses to enter the Canvas element and instead snaps to the next available position in the document. Is there a way to utilize Symbols inside the Canvas element?
-
As an alternative, we wondered if there were an expedient way to make Symbols and/or Templates inserted into a Page via the Insert tab default to having a position: absolute property, which would allow us to accomplish the same absolute-position type of workflow as the above with some slightly different setup that does not utilize the Canvas element. When we tried setting that CSS property on the symbolized elements, it was not reflected in instances of the Symbol, which makes sense, but we’re a little stuck on how to proceed.
Thanks for your help!
Screenshots or video link
Code stack you are integrating Builder with
Using the automatic Next.js integration from your DevTools