abdus

Modifying tabs & moving fields to another tab in Page Editor

Recommended Posts

There's native `Fieldset in Tab` for creating editor tabs, but sometimes it could make more sense to put a field that's not directly related to `Content` into `Settings` or `Children` tab (such as for body class or some toggles that I see being used often). You can use the hook below to move fields between the tabs.

 

image.thumb.png.a395bbc6f409f8db3a5c02abf488f9cf.png

 

// site/ready.php

wire()->addHookAfter('ProcessPageEdit::buildForm', function (HookEvent $e) {
    // make sure we're editing a page and not a user
    if ($e->process != 'ProcessPageEdit') return;

    // RESTRICT BY TEMPLATE
    // $page = $e->object->getPage();
    // if ($page->template != 'home') return;

    // RESTRICT BY ROLE
    // $user = $e->user;
    // if (!$user->hasRole('editor')) return;

    $form = $e->return;

    $contentTab = $form->children->get('id=ProcessPageEditContent');
    $settingsTab = $form->children->get('id=ProcessPageEditSettings');
    // $childrenTab = $form->children->get('id=ProcessPageEditChildren');

    // if page template is set noSettings = true, $settings will not exist
    if (!$settingsTab) return;

    // MOVE TITLE FIELD TO SETTINGS TAB
    $title = $contentTab->get('title');
    if (!$title) return;
    $contentTab->remove('title');
    $settingsTab->prepend($title);
});

 

 

  • Like 13
  • Thanks 1

Share this post


Link to post
Share on other sites

Great tip! it is also possible to add new tabs? Like a tab called SEO where i put my seo fields.

Share this post


Link to post
Share on other sites
5 minutes ago, maxf5 said:

Great tip! it is also possible to add new tabs? Like a tab called SEO where i put my seo fields.

There's Fieldset in Tab (Open) for that. Create one, add to a template and move fields that you want to show in the tab between tabField and tabfield_END fields

image.png.25c07e6eeab56f7e9821e2c8db1dbae6.png

image.png.133983ac03a5c77b07f819512b4ada95.png

Which gives you a tab like this

image.thumb.png.4c0a35fd256f41ea88774cbc6933d25f.png

  • Like 2
  • Thanks 1

Share this post


Link to post
Share on other sites

Cool stuff! But in the example you would definitely want that template check at the top of the hook (or check the current process with $this->process) or you will get an error when creating or editing a user (no Settings tab exists).

  • Like 3

Share this post


Link to post
Share on other sites
12 minutes ago, Robin S said:

Cool stuff! But in the example you would definitely want that template check at the top of the hook (or check the current process with $this->process) or you will get an error when creating or editing a user (no Settings tab exists).

Good point. I left page template optional (but it's really encouraged), but I didn't consider user pages at all.

Updated the OP.

  • Like 1

Share this post


Link to post
Share on other sites

I'll certainly remember this thread on my next project. All the time I add fields that make sense to be moved into the settings tab, like "Show in footer menu".

Many thanks!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By Mustafa-Online
      Did any one tried to integrate "WordPress New Editor" into ProcessWire ??
      I did some searches and I found this Repo on Github: https://github.com/front/drupal-gutenberg Which allows Drupal Users to use Gutenberg.
      Any Thoughts ?

       
    • By MilenKo
      Hello guys.
      I've decided to get brave and start my first delayed output profile for a remake of my knowledge sharing profile. It went all.good so far but I decided to make it multilingual as to fit the users needs.
      For starters, added a field named: image_single and limited the input to one image as this would be used for the logo. Added.the markup to allow the front end editing (method D or direct edit tag to the <img>. After double clicking on the image, I see the pop-up showing up for a second and then closes. As far as there are no errors in the logs, I am a bit stuck to find the reason. I've read earlier that some users had issues with multilingual fields but could not find anything to point me to the right direction. Any ideas or suggestions?
    • By pwuser1
      Hi people I think I have seen them all but maybe I missed some of the just wanted to know what do you recommend for an editor with JQuery autocompletion or support? 
    • By hellomoto
      I have a manufacturers page select field and a dependent models one with pages of template `model` which are allowed children of pages with template `manufacturer`. So I have this as the findPagesCode for the models page options field:
      return $page->manufacturer->children(); However this requires the page be saved in order to display options. This is not ideal. 
      I have a singular autoload module with the following:
      public function init() { $this->pages->addHookAfter('render', $this, 'filterModels'); } public function filterModels($event) { $page = $event->arguments('page'); if($page->template != 'boat_vessel') return; $this->message("models filter"); } It's doing nothing. 
      I was thinking I could work out something with this example but I would need the above test to be working first anyway...
      $this->pages->addHookAfter('changed', function(HookEvent $event) { $page = $event->object; $change = $event->arguments(0); if($page->template == 'boat_vessel' && $change == 'manufacturer') { // execute some code } }); But what? How do I refresh the models field?
      Is there a way to do this in the field settings? I would think in the custom PHP textarea that `return $page->manufacturer->children();` would work but it doesn't. 
    • By Soma
      There's a permission for allowing editor to use the translator in PW 2.73. I could need this but it doesn't work. It shows the "Language" in the menu but when opening the page it says no entries to show. Anybody has some experience using the lang-edit permission for editor?