Sebastian April 13, 2017 at 11:59 am
We plan to release version 5 to the masses at the end of April. But for now, we’re sharing this pre-release with those of you that would like to feedback on the new features before they’re finalised. You can expect minor bugs, and not everything is totally polished, but it should give you a good taste of what’s to come.
The main improvements all hinge around making it easier to target the element(s) you want. The selector wizard has had a big overhaul. You can read about the main features on the version 5 changelog. We don’t want to explain much more than that initially. Please have a play and see if things make intuitive sense.
Please direct all comments and bug reports here for now.
dmccan April 14, 2017 at 4:03 pm
Wow! It is much more intuitive, the selection process is tons better, having the action at the top instead of the side is much easier. I did not feel lost or frustrated. Kudos!
Sebastian April 14, 2017 at 4:18 pm
I recall you asked for a way to update selectors via the selector wizard (ages ago). That will come in the final 5.0 release, even though it’s not part of the pre-release BTW 🙂
Thanks for taking the time to have a play and comment.
bonest April 20, 2017 at 2:36 pm
Impressive work. It is much more intuitive and fast to use.
Sebastian April 20, 2017 at 4:11 pm
That’s great to hear bonest!
I’m now working on some design improvements that didn’t make it into the original beta. And including a color palette for the color picker, which will initialise using theme colors and then auto-update with use. This was requested by another beta tester. Please let me know if you have any requests.
Abland April 20, 2017 at 5:54 pm
Well, Sebastian, we’ve just stepped into the next generation of Microthemer! 🙂 I’ve always been impressed with what you’ve done, but this beta is definitely head and shoulders above the current version.
I see “intuitive” has already been used – twice – so I’ll venture out and say seamless. I have to admit I was confused a bit at first trying to work it out without reading any instruction 😀 but I was justified the moment the “CREATE NEW” menu dropped down from a selected element. The adjustments flowed from there. The editor response time seems to be quite improved, too.
And importing the theme stylesheet or selected elements just worked 🙂 I highlighted an element and imported, and it created the selector for me and brought in all the contained style elements into the editor. When I changed anything it changed it in the active-styles.css too.
Media queries window seems smoother, if that makes sense. The layout just seems more appealing.
I’ll be playing with this more but first, congratulations! And thank you. This latest version is quite an achievement – again 🙂 There’s nothing I found that needed tweaked or adjusted. I’m looking forward to the full release.
Sebastian April 21, 2017 at 10:49 am
Ah Abland, you’re always so supportive. Thanks for your kind words and thorough review. It’s great to hear that you like the new changes. Version 5 is just part 1 of what’s to come. 5.x updates will all focus on improving the actual style options.
I see that you discovered quite a few of the new features. Some were added with novices/workflow speed in mind, like targeting elements more visually. While other features were added with developers in mind. Like the JS library import feature you touched on. And the ability to pull CSS media queries, selectors, and styles from a stylesheet into Microthemer.
Further to this, we added HTML and CSS browser inspection tools to the selector wizard (available via the ‘Advanced’ link). We hope this will be useful for more experienced users. Clicking on sections of HTML updates the list of CSS selector suggestions, as well as the actual CSS styles pane.
Another dev feature you may not notice as first is the ability to use the selector wizard when in the full code editor view. In this view, Microthemer now adds a CSS selector to the editor in plain CSS code, rather than always adding it to the GUI view. So those that prefer to code in full can still benefit from the selector generation benefits Microthemer provides.
You mention that you found it a little confusing at first without reading any instruction. The reason we sent the beta out without instructions is because many users will auto-update via WordPress, also in the absence of any instruction. Do you have any thoughts on how to make it easier for people to adjust? For instance, currently, double-click toggles the new hover inspect feature on/off. But we’re on the fence about whether this is a good idea or not.
Thanks again for feeding back!
Abland April 21, 2017 at 2:32 pm
I forgot to mention the pseudo classes that are available to apply. I must confess there were some I didn’t realize existed 🙂 In many regards, Microthemer isn’t just an editor – it’s a training tool as well.
For getting started I just thought this morning – what about a startup splash screen with the option to “Do not show on startup”? The splash screen could contain brief bullet points to get rolling because once I got rolling it all just flowed – or an animated gif or short video in the splash screen to show how to get started.
Going to try and find more “play time” later today 🙂
dmccan April 21, 2017 at 11:17 pm
I had another go today with a thought to what suggestions I might make. Here are some things I came across, which might be real or just show that I didn’t understand 🙂 or reflect what might be confusing.
* The color box for Font and Shadow is a bar, but the Background and Gradient it is a pie.
* I guess saving happens automatically, but I was worried that my changes would be lost. Maybe some place show ‘current changes saved’ or something? Or, do changes only happen when you exit?
* Once I started on a selector and made some changes I didn’t know how to “finish” or save. Or if I wanted to cancel how to get out of the mode I was in. I realize I can double click on another selector … but — oh, see next point.
* It seems there are several “modes” and how to get into and out of them was not always obvious. A few times I got into a mode and was stumped how to cancel it. For example, initially there is an advanced view that I found that was pretty cool … but I went on and did some changes and I didn’t see how to get back to see that link again. Ah, I see now I click the target icon. Perhaps the mode switchers could be in one place or something? How many “modes” are there?
* In addition to using a number input to change sizes, sliders are useful, especially if you don’t have much of a preview delay.
* I like that you can see the Microthemer options from the front end. I’m not sure if that’s new or I just noticed it.
* If I click the admin toolbar and go to the back end, the Microthemer bar stays active. If saving happens on exit then that might be a good time for a prompt to save.
* I know there is some code you can paste in your functions.php to keep using the CSS Microthemer generated. For me it would be nice if I could just copy the CSS and put it in my child theme and disable Microthemer. Can you do that now with the CSS you see when you click the eye icon … is copying that CSS sufficient?
dmccan April 22, 2017 at 8:04 pm
Another suggestion: In MS Word you have a format painter feature. Click on an element, click the format painter to copy the style, then click on another element to apply that style you just picked up.