What is that thin blue line?

Besides the name of a 1988 documentary. :)

Can someone tell me what the purpose of this thin blue line on my stage is? The part above the line seems to be connected to BODY, and the part below to HTML. Not sure why this is - but I have a theory. Does the HTML section exist so that I can put headers, etc in there if I need to? If that's the case, why not just select HTML in the Overview section, rather than a part of the stage dedicated to it? I can't drag-and-drop components into that section of the stage, so I don't know why it exists.

And it bugs me. Alot. Makes me wanna take an extra OCD pill today.

Thanks in advance to anyone who can answer this for me!

Most likely it's showing you where there is an empty or scripted element. Sometimes scripted (custom code) elements will not show up correctly in the preview pane and show up as empty rows/columns/containers/etc. To put something in them you do exactly as you said, you click it in the Overview pane and drag it into there. After that you'll then be able to drag something into that element in the preview pane. I think it's just hard to try dragging something to a thin line :P.

Yep, that's what I think too. I'm just gonna get over it, and tell my OCD to be quiet about it. I'm brand new to BSS. Just built my first few pages with it today. Love it so far! Thanks for the reply.

I kinda wish that custom code containers that have "stuff" in them that doesn't show in BSS workspace (like scripts) would actually show something in the workspace so you know they are there... like a grayed out small box that says "custom code."

I'm with you on that too Printninja, I've thought that for quite some time that it would be nice if we could tell it a visual size or something so we could fill the space that would normally be shown on the actual page when uploaded. Would be pretty nice indeed!


One of the old site builders I used to use, Website Realizer, had a custom HTML component that was basically a resizable gray box that you placed on the page, and then you could expand it into any size rectangle you wanted to simulate the space that was taken up by whatever the code inside generated. This is what it looked like...

enter image description here

This would be my preferred choice if Martin considers this as a feature request.

That would be awesome! Heck, I would be happy even if it had a little popup window you could insert your dimensions for it in (or as part of the Options pane). Especially if that would allow us to drag and drop to the empty ones that are given a size. Using a custom code <br> will also give you a solid single line element which could be set to do a single line size if we had this capability for resizing or adding dimensions.


Possible feature request...

This is an interesting take. It assumes that custom code always produces a visible element though and could break people's layouts if we display it by default. Maybe it could be switched on from the context menu. Looking forward to your thoughts on this.

@Martin: If you add the ability to give it dimensions (basic w/h settings) that should also fix the issue of not needing dimensions for anyone using it for hidden scripts etc. They can put in 0,0 and that would take care of that as well as the rest of us that need it to show.<br /> Then, adding the toggle for on and off would complete the system. This way, if the code in the Custom Code block doesn't need any sizing help we can have it turned off and if it needs assistance for sizing we can turn it on.

Example 1: I use Custom Code blocks for my navs on most sites. Easier than trying to manipulate the default ones. I don't need size assistance for these as the code does all the work for it so I would turn that setting off and allow the code to handle it all.

Example 2: I use an external set of scripts, as most already know, for many gallery setups for some clients. Of course, the entire thing doesn't show in BSS correctly (nor in the preview browser). In this case I would turn that setting on and allow the app to put a specific sized box there in its place with the dimensions I would give in the settings for it. In this case, it would actually help a lot because what I usually get is a approx. 1 inch per image list going down the page for each gallery. Makes the page really really long if someone has a gallery of 25 to 50 images .... I'm sure you get the picture (no pun intended lol).

Hmm wouldn't let me amend my post, right after I posted it. In the above, there is a flaw in that those that don't need dimensions, wouldn't need to add anything for size, just turn the setting off and they would be all set. So, ignore the part where I have them adding 0,0. I had 2 ideas going on at the same time and forgot to delete that part lol.

Just make the custom code container re-sizeable with 8 nodes on the edges, like in the pic I posted. It can be a single 1px line by default (or even 0px) but when the component is hovered over the draggable nodes would appear allowing you to pull it as wide as the container it is in, and as tall as you want (presumably based on what it's going to generate.) In the example pic I posted (which is from the program Website Realizer), the custom code block looks and works just like this, except it's an old-non-responsive website builder, so there were no limits on positioning or size of the custom code container. I also like that is shows (grayed out) what the code inside the container actually is.

@Printninja: Yeah I too would like it just resizable with drag and drop, but I guess since nothing else has been, I had assumed that wasn't going to happen so that's why I asked for a place to put dimensions.

@Martin: What Printninja said, if that's doable I would rather see that than the way I stated it, but if not then the way I stated it would probably be the easiest to manage for both of us :)