Fixed position edit toolbar

Resolved tproli
(@tproli)

8 years, 5 months ago

It would be super useful to have the edit toolbar (‘#tablepress_edit-table-manipulation’) positioned fixed to the bottom of the window (or elsewhere). I have some really long tables and when I have to duplicate or delete rows I have to scroll back and forth.

Ideally it would be a one-liner with custom icons to occupy less space.

If you wish I can help with that if you also think it could be a nice addon. Of course the best would be if this feature would be optional.

Thanks,
tpr

https://wordpress.org/plugins/tablepress/

Viewing 8 replies - 1 through 8 (of 8 total)

Plugin Author TobiasBg
(@tobiasbg)

8 years, 5 months ago

Hi,

thanks for your question, and sorry for the trouble.

This indeed sounds like a nice solution, and I would like to be able to offer something like this. Unfortunately, I haven’t yet found a nice, clean, and easy solution for this that does not interfere with the scrolling and the “postboxes” (the containers that contain the different elements on the page). I’m very open to suggestions and contributions here however!

Regards,
Tobias

Thread Starter tproli
(@tproli)

8 years, 5 months ago

I just made it fixed to the bottom using the developer tools and it worked great, it didn’t interfere with anything. But of course I see your points.

I guess there are plenty of nice solutions for this, for example:
– fixed bottom line (as I wrote above)
– sticking items to the top bar – however I don’t know how many items may there be on different WP installs, so TablePress items may not fit there
– sticking items to the top bar – dropdown mode: only one menu item that expands on hover
– auto-hiding sidebar on the right – this would be fancy, and right now I see this as the best solution regarding the interfere with other site elements.

Note that I mean only CSS (or maybe a little JS) mods, not backend modifications.

Plugin Author TobiasBg
(@tobiasbg)

8 years, 5 months ago

Hi,

thanks for those suggestions! Yes, fixing it to the bottom or top should actually not be that difficult.
Could you maybe give me the CSS that you used, so that I have something as a starting point or reference?

Regards,
Tobias
Thread Starter tproli
(@tproli)

8 years, 5 months ago
It was a really simple mod, here it is with some decoration:
```
#tablepress_edit-table-manipulation {
    position: fixed;
    bottom: 0;
    z-index: 9999;
    margin: 0;
    background: #dfdfdf;
    border: 1px solid #a0a5aa;
    border-bottom: none;
    box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.5);
}
```
Screenshot

The good thing is that the panel can be collapsed using the WP-handle on the top-right corner.

However, placing the Save button inside this area is also useful. Plus the ajax save message would also great to be able to see. But these would require larger modifications (and perhaps a concept :)).
Plugin Author TobiasBg
(@tobiasbg)

8 years, 5 months ago
Hi,

very cool! Thanks for sharing that. I really like the approach!
Adding an extra
```
right: 20px;
```
might even place it in a better position (especially when it’s minified).

I’ll definitely reuse this! A quick way for using it on all tables might actually be to insert the CSS into the TablePress Extension from https://tablepress.org/extensions/input-field-size/

Regards,
Tobias
Thread Starter tproli
(@tproli)

8 years, 5 months ago

Glad you like it! Indeed it adds extra functionality with only a few lines.

Using right: 20px; can make the panel cover the left WP sidebar but because the panel can minified, it’s not an issue.

Thread Starter tproli
(@tproli)

8 years, 5 months ago

Just tried the right sidebar “version” and it’s less usable imo. The fixed-bottom version is much better.

Plugin Author TobiasBg
(@tobiasbg)

8 years, 5 months ago

Hi,

yes, the fixed-bottom is probably indeed preferable. Thanks again!

Regards,
Tobias

Viewing 8 replies - 1 through 8 (of 8 total)

The topic ‘Fixed position edit toolbar’ is closed to new replies.