Keyboard shortcuts for selecting components on the page

Keyboard shortcuts for selecting components on the page would be very useful:

  • Select previous component (arrow ▲)
  • Select next component (arrow ▼)
  • Select parent (cmd+▲)
  • Select child (cmd+▼)
  • Move selected component to previous position (cmd+shift+▲)
  • Move selected component to next position (cmd+shift+▼)
2 Likes

That’s a great idea, I like it! I’ll get it added to the list :blush:

1 Like

@Massimo Good news! This has now been added in the latest build, 0.8.0!

However, there is a slight issue in that it doesn’t work on scrollable pages… But, don’t worry, we’re workign on a fix for the next build.

List of keyboard shortcuts here.

Yes, I’ve seen that for now virtually none of those keyboard shortcuts work yet. Let’s wait for the fix.

@Massimo As requested, we’ve added (and fixed) the keyboard shortcuts that will allow you to select and move components. Some of the shortcuts are slightly different from what you suggested, but I think you’ll find what we’ve done is a little more powerful.

Check the release notes for 0.8.2 for a video and a link to the manual :wink:

1 Like

@dan These are going to be handy. Good stuff!

One other item I would like to see exposed in the menu system is the Command-Shift-F Quick Add Window command. I’m constantly forgetting about this wonderful feature and as I have mentioned in the past I think it should be exposed in the UI for new user to more easily discover.

1 Like

Ah yes, good reminder, we’ll get that into a build soon. Your comment also gave me an idea… I can now build layouts using JUST the keyboard :exploding_head:

This is kinda fun :grinning_face_with_smiling_eyes:

You are right, so it is even better. Good job!

1 Like

If I may…the only flaw I found is that in order to activate keyboard selection or movement, you must first click on the component in the “Page Layout” panel, i.e., that panel must be active.
Because if I have to select and move a certain element, first I select it on the page and then I am “forced” to make another click to activate the Page Layout panel, and only after that I can use the shortcuts.

So it would be more convenient if component selection/movement would also work when the page editor area is “active,” because it is more intuitive.
Or, if this is not feasible, an alternative would be to have a key (e.g., Tabulator key) that from the editor area activates the Page Layout panel, so that you can then use the shortcuts.

I hope I have explained myself.

Very cool!

The power of Elements!

1 Like

Hmmm, I’ve just done a quick test, and you don’t need the node browser (aka Page layout) panel visible, it just works in the editor, like this…

Strange, they don’t work for me.

Hmmm. Is there a way to turn these shortcuts off? or at least reassign them to other keys? Option+arrows usually move the caret in text editing, as I’ve done for 30+ years (just did it now to put the ‘+’ by 30, jumping caret back a word). Imagine my surprise when I installed the update and lost the capability to move around efficiently via keyboard.

Good catch! We’ve found the bug. It seems the shortcuts don’t work on new documents; however, if you save and re-open them, they should work as expected. We’ll obviously get this fixed for the next build!

We can solve this! Look out for a fix in the next build :sweat_smile:

1 Like