Shortkeys & Productivity

Just stumbled upon Pinegrow after using Webflow, and I must say, I’m thoroughly impressed!

The primary reasons I gravitate towards visual development tools are the heightened productivity and speed they offer, and Pinegrow certainly doesn’t disappoint in this regard. The array of features it brings to the table, such as the repeater, HTML snippets, and the AI assistant, have me genuinely thrilled.

However, I find that Pinegrow’s keyboard shortcuts are somewhat restrictive given its potential. Enabling users to define custom shortcuts would be an absolute game-changer, particularly for tasks like:

  • creating a new <div> or any other HTML element within the currently selected element.
  • duplicating class names or other attributes from the selected element.
  • wrapping an HTML element around the currently selected one.
  • removing the last-applied class from the selected element.
  • renaming the last-applied class on the selected element.

Just to name a few

Furthermore, the autocomplete function in Webflow has proven to be an invaluable time-saver over extended usage. A prime example is being able to type “mabo” and promptly have “margin-bottom” class easily selectable!

I’m brimming with excitement to delve deeper into Pinegrow over the next few days! Without a doubt, I’m enrolling for a subscription; the potential here is undeniable.

Hoping this post sheds light on aspects that a seasoned Webflow user might miss when transitioning to Pinegrow.

Cheers!

4 Likes
  • removing the last-applied class from the selected element. > CTRL + Z
  • creating a new <div> or any other HTML element within the currently selected element. > It would not make sense to add a keyboard shortcut to create a generic element. You would then have to change the newly created element manually as needed. I don’t see how this would speed up the workflow. I think it is already quite convenient to add elements with the right mouse context menu on the element.

There is already a panel with the autocomplete function, but if I remember correctly it is only for tailwind.

Hey Plunky,

Thanks for your comment!

  • The CTRL - Z does not seem to work for me to delete the last class of a selected element.
  • Streamlining your workflow by minimizing mouse usage often leads to increased efficiency in creation. Employing a quick keyboard shortcut and promptly typing the desired element for selection generally proves to be considerably faster than navigating through an extensive menu by clicking and hovering. I’ve witnessed proficient video editors who masterfully harness keyboard shortcuts and they produce work FAST.

Premiere Pro short-keys settings:

1 Like

Hi :wave:

I normally use:

. CTRL + L
to access the class panel. It scan and brings up the classes i use thee most

. CTRL + D
Obvious…

. CTRL+ H
It brings out the code panel, focused on the element I’ve selected

. CTRL + G
Grid

I agree that having a simple personal set of shortcuts could come handy - within AI / PS / INDD i setted up all sort of strange shortcuts for my needs, so I understand you.

Anyway, I see it’s from August your post, how’s it going with Pinegrow? Hope you enjoy it!

Have a good day