How to control nesting of objects


Badge

I need a direct way to control nesting of contents. For example, a text box might be nested inside a graphic box and I want to pull it out, or vice versa.

Dragging one of these works sometimes, but I want to be able to control and change these relationships from the content menu not from the page itself (sometimes it’s crowded and I don’t have fine control).

This is driving me nuts - any help appreciated.


13 replies

Userlevel 5
Badge +2

Hi @Ed_Stanfield!

Two ways that work best for this:

  • While on the editor, and clicked on an element, you can click the ‘Send Backward’ or ‘Bring Forward’ buttons.
  • If you open the Contents section (click on the arrow on the left side of the screen) and when you click on an element there, you can click the ‘Move Up’ and ‘Move Down’ buttons next to the send backward and forward buttons.

Let me know if you are still having any issues! Happy to help further.

Badge

Hi,

The “move up” “move down” options only work for an entire section. Anything else is grayed out. I really really wish it would work on any element, it was make things a lot easier.

I can often drag one object onto another (and it turns into a checkerboard to indicate it is being nested) But, the box refuses to cooperate when I try to drag into onto the button. (no checkerboard)

Ed

Userlevel 6
Badge +3

Hey @Ed_Stanfield I tend to just use the keyboard keys to move things around if I don’t want to affect how they are nested – holding Shift + arrow keys moves it 10px at a time, so it’s not too slow.

Obviously, not a refined solution, but just how I manage with it for now.

Badge

Yes, I finally discovered that keyboard moves won’t affect the nesting.

Do you know how to put a box inside a button? I’m trying to follow the instructions create a drop down menu and it requires a box nested inside button.

Userlevel 6
Badge +3

I don’t think you can do that … sounds like it should be the button in the box. Can you share the drop down menu instructions/link?

Badge

You’re correct, it was my misunderstanding. You just need a full-width box to create a top menu background effect. Then a button inside that box that represents the menu item. (such as Services). Then, create another box and inside this 2nd box but the buttons that represent the links of a drop-down menu. Here is a test page I created to play with it. Ignore the top part where I’m playing with a sticky bar. Here are the CSS and JS images. I assume to get this to work with a stick bar you just apply them to the sticky bar JS / CSS areas. CSS%20for%20menu JS%20for%20menu

Userlevel 6
Badge +3

Can you pls share the link to your test page? 🙂

Badge

Oops, I forget to include that. https://go.edstanfield.com/test/

Userlevel 6
Badge +3

Yes I would guess you can apply this to the sticky bar, but I don’t think it’s the right solution as the drop down menu will probably be cut off. Try the Sticky Header script 🙂

Badge

I tried - you’re correct. I’ll try the Sticky Header link you sent.

Badge

I followed the Sticky Header link and didn’t find what I was looking for. One of the comments had this example that did a great job. But, I don’t see the script.

Userlevel 6
Badge +3

Typically landing pages don’t have header navs or drop-down menus as they can distract from the main conversion goal i.e. it’s standalone page, not website that allows the user to click to other pages.

Why do you want/need the drop-down menu?

Badge

I agree with you about the intent of a landing page. Occasionally I’ll get a request from someone that wants those on their page. Plus, I just wanted to see if I could make it work.

Reply