Dragging Some Blocks into Columns does not work


We are unable to add many UI components into existing columns.

For example, Drag and drop and "1 Row 2 Columns" block into the body. Then try to add something like "Contact Form Clean" or "Map Clean" into one of these columns. You cannot. Neither by drag and drop nor by right clicking the compoent and choosing "insert into column" as this options is greyed out.

You can move the second compoent there manually, by dragging from one block to another and adding a div manually with the correct class assigned to it. But this just seems silly and many of these pre-defined blocks cannot be added to columns for better layout choice.

Please can you fix this so that a lot more items can be added (drag and dropped) directly into columns and rows.

Hiya clarke,

That is most likely because there is already a "Container" set in your project and the "Container" setting or element is really only supposed to be used once in a page. If you're dragging from the default UI you should not have that issue, but if you're pulling in some downloaded components you will almost always have that issue because they almost always put things within a container for some reason. I find it extremely frustrating myself too, because I use a "Container" as a wrapper type of thing so I cannot add anything from the downloaded components directly into my project, I have to always put it at the top or bottom and drag it out of the container to where I want it. I'm not sure if this will be addressed at some point or not, I sure hope so! For right now you're doing what you will need to do to use multiple downloaded components.

I haven't tried a whole lot of the default ones as of yet, so if you're having an issue with those let us know that too since I'm assuming the issue is mostly with the downloaded ones which is where I always had that problem.

@jo, I worked with @clarkedesign on a work around for his issue. The component he is referring to is a BSS component. It is a form with in a DIV that has a class, yet the Overview pane has it labeled as Block which I'm sure is why it can't be dropped into a column for whatever reason. Luckily enough he was able to drag the form out and put it in another dragged in DIV and then add a class to that DIV the same as the original Block labeled DIV so that all the styling was applied.

I would have to assume that most downloadable components contain rows/columns so you would find a .container with in it so that it applies the proper margin/padding configuration.