Tabbed navigation on settings pages

[Furniel]

I want replace long lists of settings with tabs. Made few tabs on general settings page like proof of concept:

Anyone interested in this or i shouldn't waste my time?

[szepeviktor]

See https://github.com/stuttter/wp-user-profiles

[nigrosimone]

I think any type of contribute is appreciated, but i think the better is use our time to fix only the bug, because any improvements/custumization/new feature has an hight risk of rejecting by official version. Historically, only the reproducible, obvious bug, fixed by the community, are planned into the official version.

If someone want make a improvements/custumization/new feature, the better way is build a separate plugin (w3tc is well pluggable with filter) or a w3tc extension (like cloudflare).

I have alvo released 7 plugins (https://profiles.wordpress.org/nigrosimone#content-plugins) with some w3tc missing features.

Side note: if you want, we have some old bugs without fix https://github.com/szepeviktor/w3-total-cache-fixed/issues?q=is%3Aissue+is%3Aopen+label%3ABug . I have tryed to found the issue without success.

[szepeviktor]

I am not a w3tc user!

[Furniel]

Finished working on UI, Added tabs to all pages that have more than 2 sections. Pages will look like this:

If anyone want's to test all commits are available in this branch .

[charlesLF]

I like the tabbed UI. Will test it locally and see how it works.

[szepeviktor]

Thank you.

Could you work in this repo? You have write access.

-- +36204242498 Ezen a készüléken sok az elütés. Elnézést!

On May 9, 2017 5:58:43 PM CEST, Furniel notifications@github.com wrote:

Finished working on UI, Added tabs to all pages that have more than 2 sections. Pages will look like this:

If anyone want's to test all commits are available in this branch .

-- You are receiving this because you commented. Reply to this email directly or view it on GitHub: https://github.com/szepeviktor/w3-total-cache-fixed/issues/471#issuecomment-300211016

[Furniel]

@szepeviktor if everything will work without problems i'll create pull request(for code review, discussion). I don't like develop new functions in master repo(sometimes i rewrite commits and use forced pushes and so on(i know that's bad practice), so i don't want to break something here and prefer use own repo for development).

[szepeviktor]

We have unlimited branches for you!

-- +36204242498 Ezen a készüléken sok az elütés. Elnézést!

On May 9, 2017 6:35:07 PM CEST, Furniel notifications@github.com wrote:

@szepeviktor if everything will work without problems i'll create pull request(for code review, discussion). I don't like develop new functions in master repo(sometimes i rewrite commits and use forced pushes and so on(i know that's bad practice), so i don't want to break something here and prefer use own repo for development).

-- You are receiving this because you were mentioned. Reply to this email directly or view it on GitHub: https://github.com/szepeviktor/w3-total-cache-fixed/issues/471#issuecomment-300223715

[charlesLF]

Yeah, have it in a new branch. This will make it easier for all of us to test it and contribute to it, and makes merging to master later on much easier too.

[szepeviktor]

Looks nice. @Furniel Please consider WordPress admin tabs: https://github.com/WordPress/WordPress/blob/3dab32af54ded5bd89802aeda6301ddd8640f191/wp-admin/css/common.css#L2155-L2229 It is easy.

[szepeviktor]

Some HTML in this article https://code.tutsplus.com/tutorials/the-wordpress-settings-api-part-5-tabbed-navigation-for-settings--wp-24971

[Furniel]

@szepeviktor My first implementation was based on native wp tabs, but they are unusable. With native wp tabs wp loads only selected tab and on every tab switch it must reload page, as result navigation becomes very slow. Second disadvantage - native wp implementation modifies url to remember selected tab, that's works for page reloading but doesn't work for settings save(w3tc adds message id to url on settings save and rewrites tab id. This can be fixed in some way, but i don't want modify more code than we need.).

[szepeviktor]

Although it is used this way in WordPress https://github.com/WordPress/WordPress/blob/ab3bca05c8103a8a73ae482d149d7821d44e4b30/wp-admin/freedoms.php#L26-L30 you may add hash targets in href and bind content switching (show/hide) by jQuery on them. It must be 5 lines of JavaScript. <a href="#settings" class="nav-tab"> jQuery('.nav-tab-wrapper .navtab').each(function () { ... });