Jump to content

AdminThemeModesta - New modest admin theme


nikola

Recommended Posts

After months of silence on the forum I've decided to speak out and introduce a brand new admin theme for ProcessWire 2.4.x

I've made the theme initially for our internal business project and I've decided to share it with you all ;)

The theme itself is designed only for ProcessWire 2.4.x and up because it's wrapped as a module (new theming design approach introduced in ProcessWire 2.4) and it also has it's own options you can configure.

It has all the bells and whistles as Default Admin Theme of PW 2.4 as well as some of my own ;)

You can download it from here:

https://github.com/nvidoni/AdminThemeModesta

and please let me know of any mistakes you find during your workflow...

Changelog:

v1.0.1

  • Added unpublished pages status icon next to username (fires modal window with unpublished pages list that you can edit)
  • Improved PageList (children are more indented with arrows before them, hidden pages have more lighter color and icons have more darker color - by suggestion from Martijn Geerts)
  • Other CSS improvements

UPDATE:

You can find version compatible with Processwire 2.4.4 and up on dev branch:

https://github.com/nvidoni/AdminThemeModesta/tree/dev

and also let me know about any mistakes that should be fixed.

Dev version isn't updated to v1.0.1 yet because of strange problem with theme not switching right (doesn't activate) - it started to happen from 2.4.5 dev version of PW...) and it seems it happens only in Windows environments...), hopefully we'll fix this soon.

To sum it up and let the images do the talking, here we go:

modesta-pages-list.png

modesta-settings.png

modesta-edit-page.png

modesta-pagination.png

modesta-panel.png

modesta-search-open.png

modesta-notice-highlight.png

modesta-notice-error.png

modesta-nav-open.png

  • Like 31
Link to comment
Share on other sites

Thanks Nikola,

Just playing around with this now - very nice :) It's great to have another 2.4 ready theme. I think it's time all the others listed in the modules directory get tagged as <=2.3

A few small things I have noticed.

  1. Scroll to top button closes the left sidebar
  2. I am not sure that the hamburger icon is the most obvious way of toggling that sidebar - maybe an arrow over at the top left of the page would be more obvious
  3. Your Pages menu item is not showing the new Tree and Find dropdown options (just made available in 2.4.4)
  4. With Lister (Page and User), there is an issue with the pagination buttons overlapping the selector string box
  5. With Kongondo's blog module the white text on the grey background doesn't work for the tabs very well. Not sure if this is something you should tweak, or he should tweak

Thanks again for sharing!

EDIT: Here is the change that is required to make the Pages dropdown work for 2.4.4:

https://github.com/ryancramerdesign/ProcessWire/commit/0d6d11207e40bd605efc1f7e958c031845a05214#diff-543b5b46d33bea6194fe304104d022c6L208

Link to comment
Share on other sites

Glad you like it :)

1. Sidebar closes if you click anywhere on the page (including the Back to top button), I can change that in the way that only "hamburger" icon has close function assigned to it.

2. I always liked the "hamburger" icon but sure will try some other options - maybe they would look nicer...

3. I've developed this under 2.4 stable, so I'll install latest dev version so I could add those things

4. I'll fix Lister as soon as I install latest dev version...

5. Not sure about the blog, I'll check it out and if it's problem on my side I'll fix it

I plan to support this theme for all upcoming releases of PW.

  • Like 1
Link to comment
Share on other sites

I always liked the "hamburger" icon but sure will try some other options - maybe they would look nicer...

It's not that I don't like the hamburger menu icon, but these days I associate it with a mobile menu, rather than a sidebar toggle.

Link to comment
Share on other sites

I've made new icon for panel switch (changes to hamburger icon in mobile view - panel contains user info and navigation instead recent and modified pages).

Changes commited to Github.

modesta-panel-switch.png

Link to comment
Share on other sites

Great job Nikola! Fantastic theme! Thanks for making this. I really like how you've taken advantage of Admin Themes being modules with all the configuration options too. 

For anyone that wants to install this theme, you can do so easily just by logging in, click "Modules" then "New", and paste in "AdminThemeModesta" in the Module Class Name field. 

Link to comment
Share on other sites

Nikola, I got an error to undefined function iconv() in my Ampps install. This is a native PHP function and I easily solved the problem by installing the iconv extension, but thought you should be aware of this since it's not being used on something critical and you could maybe use another approach or check if the extension is installed and alert for it in the theme settings that are affected by it. The functions where iconv() is being used are renderDate() and renderPageStatus() in the helpers file.

Link to comment
Share on other sites

diogo, I've used only iconv for date formatting because of inconsistencies in showing the right diacritics (for instance Croatian) on Windows and Linux platforms. I have already thought about that problem and I'll try to solve it in another way rather than adding a warning about missing extension.

Link to comment
Share on other sites

Many thanks for making this!

 1. Sidebar closes if you click anywhere on the page (including the Back to top button), I can change that in the way that only "hamburger" icon has close function assigned to it.

No please, +1 for let it as is (clicking anywhere)

  • Like 1
Link to comment
Share on other sites

Tested and convinced that your Theme is great - Thanks for sharing it!!

Would it be usefull to have a setting for the Theme - like:

choose from template - to create new child pages

example setting is:  products|team|blogpost

and in the sidepanel we've 3 Items with link to create a new childpage?

I'am newbee so excuse me if this was no real progress or usefull idea - but for my first tests with PW this kind of shortlinks i missed until now!

I know i can transcribe from your great select-box with the "create new" function but on large sites may a admin could choose the often used contentareas for the "create new" thingi.

whatever your Admintheme rocks! :cool:

Best Regards mr-fan

Ps.: one Problem found - on tables for eg. ModulesManager the textcolor is not set so it is quite white....

body {
    background: none repeat scroll 0 0 #EBECED;
    color: #F4F6F8;
    font-size: 100%;
}
Edited by mr-fan
Link to comment
Share on other sites

I'm receving the following error:

Error: Class 'AdminTheme' not found (line 3 of /Applications/MAMP/htdocs/mypath/site/modules/AdminThemeModesta-master/AdminThemeModesta.module) 

when I try to install the theme.

PW 2.3.5 here.

Suggestions?

Link to comment
Share on other sites

@horst

I've left the panel switch action as it is (you can click on the switch button or the document body to close it), but I've removed trigger from "Back to top" button - it doesn't close the panel when sliding up to the top of the page.

@mr-fan

Template selection drop down ("Add new" on the right side) is default action in PW 2.4 and up, it lets you assign templates to that drop down for quicker access - so no need to put it in the sidebar panel (anyway it's quicker to select template from drop down then opening sidebar panel and then selecting the desired template).

@diogo

There's no easy way for displaying formatted date (for all possible locale scenarios) so I've added warning if iconv extension is not loaded and it uses basic strftime without any conversion in that case, but most servers have iconv loaded so it's just for a few of scenarios where this extension is not loaded.

----

I've also made changes to the theme that reflect changes in PW 2.4.4, but I'm currently setting up the dev branch where I'll commit that version.

  • Like 3
Link to comment
Share on other sites

It's really great to see a new theme released for the newest processwire version.

I've only found one little style bug so far.

Go under Setup > Languages > Your Language and edit a file. There is a description text under the title "Language Translator" that is written white on gray.

Link to comment
Share on other sites

Just tested it on a fresh install, looks really nice. I like the especially the little smaller font, so everything looks more compact and clean. 

The only thing which bugs me, is the pagetree. I find it difficult to distinguish between pages with childs and ones without. 

Also, for me, the root-page doesn't look like it's the root anymore, but that's less important.

Link to comment
Share on other sites

Hi Nikola,

tried the Modesta (dev version) theme in an 2.4.5 dev installation. No sucess. I get the simple old-style PW design?

  • place files under /site/modules/AdminThemeModesta/
  • then search and install it in module section
  • made my configs
  • select theme in the profile settings
Link to comment
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
×
×
  • Create New...