ProcessWire 3.0.56

Core updates

This week we have a new version of ProcessWire on the dev branch that contains several additions and fixes. Here are a few highlights:

  • Updates to the way multi-language support handles locales on the front-end, plus the addition of $languages->setLocale() and $languages->getLocale() methods.

  • Code updates to ProcessPageList and a solution for the page editor breadcrumb trail that sometimes didn't go where expected.

  • Updates to markup regions support, with the biggest being the addition of <region> or [alias] <pw-region> tags. When used, they are removed from the final markup automatically, making them a handy addition for some cases. They can be used to define region placeholders, populate existing regions, or both.

Uikit admin theme updates

Work on the Uikit admin theme continues this week with the addition of sidebar support. For those that prefer most of the navigation to be in the sidebar rather than the masthead, you can now enable it as the default setting in the module configuration. You can also enable (or disable) it as a toggle in the user navigation.

The sidebars added this week are different from the offcanvas sidebar you may have seen in previous posts. Technically the navigation sidebar looks identical, but it's completely different in terms of how it works. I felt that sidebar navigation is more useful if it stays in the same place across page edits and other actions. To see what I mean, check out the screencast video below:

Something you'll also notice in that screencast is that there are actually two sidebars that can be revealed or hidden. These include the navigation sidebar and the page tree sidebar. By default, the navigation sidebar is visible, and the page tree sidebar is collapsed. Toggles can open or collapse either sidebar, and both are resizable. Notice that whatever you click in the sidebars loads in the main editor area, but the sidebars remain as they are. Meaning, you'll never lose your spot. Hopefully this will be a handy addition for many.

If you'd like to take it for a spin, this version of the Uikit admin theme can be downloaded from the GitHub repo now, and you'll want to make sure you are running the latest core dev version as well (3.0.56).

Live demo

You can also try out this update on our Regular demo site. Use the admin login with username bloguser and password processwire3. Though before you go there, read the instructions below.

We don't have the sidebars enabled by default at present, so after logging in, hover the "bloguser" user menu and click the "Enable sidebars" link. After doing that you'll see the navigation sidebar appear on the left.

To enable the page tree sidebar, click the toggle that appears on the right side of the screen OR hover the "bloguser" user menu again and click "tree toggle". Please note that I've not yet tested out these admin theme updates in anything but Chrome so far, but let me know if you run into any trouble using it. If you've logged into this demo before, you may need to clear your browser cache (or use incognito mode) to ensure older assets aren't getting loaded.

That's it for this week. Have a great weekend and enjoy March 18 edition of the ProcessWire Weekly at weekly.pw.


Comments

  • adrian

    adrian 1 week ago 80

    I absolutely love the new page tree sidebar - so clean!

    One suggestion - I'd really like to see the top menu also visible when using the page tree sidebar. That would be the perfect combination in my mind.

    Another suggestion would be to make it possible to have the page tree sidebar on the left.

    Really awesome stuff Ryan!

    • ryan

      ryan 1 week ago 61

      Glad you like it Adrian. I think everything you mentioned will be possible here. In addition to that, the page tree also works as an element that pulls up from the top or bottom of the screen, though so far I prefer it as a sidebar. I was thinking in the module configuration that there would be a few different layout options you could configure, one of them being as you mentioned (topnav with page tree left sidebar).

  • adrian

    adrian 1 week ago 40

    Sorry, another suggestion - have you thought about revisiting the full line hover for displaying the page action buttons (rather than having to mouseover the title, then move to the require action)? This option is in @tpr's AdminOnSteroids and it's such a nice tweak. I know you weren't keen on it originally, but I find it such a nice UI improvement - surely I am not the only one :)

    • ryan

      ryan 1 week ago 40

      Well I wasn't wild about the way I got it working because the action links were appearing most often when it wasn't my intention, but maybe @tpr got it working better than I did – I'll check it out.

  • Joel

    Joel 7 days ago 10

    thanks for the adding !!!! great solution to my use case

    • Joel

      Joel 7 days ago 20

      was trying to thank you for the new region element (forgot html gets stripped in comments)

  • Mike Rockett

    Mike Rockett 7 days ago 30

    I really like the new approaches being taken here - big steps for ProcessWire. However, the first thing I noticed was the fact that I can easily have three page trees in a single view, using the left sidebar, the root admin page, and the right sidebar. I get how the additional access-points to the page tree are useful, but perhaps they should only become accessible as and when needed? So when on the root admin page, I should not be able to access the sidebar page trees. Though, I'm sure you're already aware of this and have a plan in motion... Just pointing it out because of how it jumped at me.

    I also think the left sidebar should not be able to grow in size more than it needs to. Not sure what thresholds should be put in place, also giving consideration to mobile behaviour, but maybe 50% of the page width should be the limit.

    From the Chrome side of things, all looks good here, except for the fact that "Uncaught TypeError: Cannot read property '_wrapper' of undefined" is thrown when clicking on an item in the left sidebar.

    • Mike Rockett

      Mike Rockett 7 days ago 00

      Copied this here for discussion: https://processwire.com/talk/topic/15839-pw-3056-core-updates-uikit-admin-theme-updates/?do=findComment&comment=141393

  • ukyo

    ukyo 7 days ago 00

    Nice work !

    But, I love w2ui in layout concept. http://w2ui.com/web/demo

  • Mikel

    Mikel 5 days ago 10

    Hi, Ryan, love the sidebars! Very efficient while editing!
    As I am testing a lot on mobile devices, here are my findings so far:
    1. sidebar on mobile needs some kind of close button, otherwise you are forced to click a menu item to close it.
    2. I don't know if this is an apple related bug, but on all my devices (mobile as well as desktop) the "save and keep unpublished" button after page creation is floated the wrong way...
    More to come ;-)

  • Yannick Albert

    Yannick Albert 5 days ago 00

    Thanks for introducing the new tags. Nice addition. I see myself echoing some file contents directly into somewhere ;) However, i'm not sure if prefixed attributes are required here, at least on prefixed tags. ;)

  • Online

    Online 5 days ago 00

    Absolutely wonderful ???? I love the sidebar approach, I was wondering if there any way to "RTL" the admin interface?

  • AndZyk

    AndZyk 4 days ago 20

    UIkit has RTL support: https://getuikit.com/docs/rtl. I guess, you should be able to customize the theme yourself. ;-)

  • MilenKo

    MilenKo 2 days ago 00

    Hello all. I am trying to setup PW 3.0.56 with Regular profile to check the new functionality and UiKit implementation however after selecting the UiKit profile and install I get an error:
    Parse error: syntax error, unexpected '[' in C:\OpenServer\domains\regular.pw\site\templates\_main.php on line 38

    Inside the admin I still see the default admin so it looks like I am missing a step to setup the UiKit properly.

    The line 38 contains:

    • Adrian Jones

      Adrian Jones 2 days ago 10

      Milenko - I am not sure that there is a UiKit site profile. It's just a module that gets installed like any other. Download the zip (https://github.com/ryancramerdesign/AdminThemeUikit/archive/master.zip) and install it as normal. Then select the admin theme from your profile.

    • Alex

      Alex 2 days ago 10

      That error is usally because your PHP version is 5.3 or lower. Are you able to upgrade?

  • MilenKo

    MilenKo 2 days ago 00

    Adrian, I am talking about Regular-Master Blog profile which in the profile info is saying: Uikit 3 site/blog profile

    So I installed it following the steps and it all worked but afte that pointing to my new site give an error:

    Parse Error: syntax error, unexpected '[' (line 38 of C:\OpenServer\domains\regular.pw\site\templates\_main.php)

  • MilenKo

    MilenKo 2 days ago 00

    Sorry, my bad. As soon as i changed the settings of my server to use Apache 2.4 and PHP 5.5 x64, it all started working fine. Now I only need to figure out how to set AdminThemeUikit to be default but not the original admin I have right now. Funny enough the theme had an option to replace PW login screen but I just cant find where to switch to the admin too.

    • Adrian Jones

      Adrian Jones 2 days ago 00

      Put this in your config.php

      $config->defaultAdminTheme = 'AdminThemeUikit';

      PS - sorry for the incorrect info on the bug you were seeing. It looks like this theme required PHP 5.4 - maybe Ryan is planning on making PW require it as well sometime soon?

  • MilenKo

    MilenKo 2 days ago 00

    Thank you Adrian. To be honest, I remembered that besides the Uikit it was mentioned to have php 5.4 but I thought that I already switched to it. Anyway, if somebody else wants to try the profile now and steps in my shoes, would know how to get away with it and enjoy the profile.

  • MilenKo

    MilenKo 2 days ago 00

    Thank you Adrian. To be honest, I remembered that besides the Uikit it was mentioned to have php 5.4 but I thought that I already switched to it. Anyway, if somebody else wants to try the profile now and steps in my shoes, would know how to get away with it and enjoy the profile.

Post a Comment

Your e-mail is kept confidential and not included with your comment. Website is optional.