Microthemer 5 feedback

This topic has 34 replies, 9 voices, and was last updated 5 years, 7 months ago by Sebastian.

Author	Posts

Sebastian May 16, 2017 at 2:05 pm	Microthemer 5 has recently been released. Read about the changes here. Please use this thread to let us know what you think! We expect to spend the next few weeks refining the new targeting features before moving on to other tasks. So please don’t be shy if you have any major or minor gripes with the latest changes.
lisendra May 17, 2017 at 5:28 am	Dear Sebastian, I was using Microthemer 5 beta, and it is a wonderfull ! But yesterday i updated it to 5.0.2, and now i’m receiving in the chrome console this error on every selector that i pass over with my mouse. "Uncaught DOMException: Failed to execute 'matches' on 'Element': '.flexslider-container, .homepage-slider .slides, .homepage-slider .flex-viewport, .flexslider-inner-container {' is not a valid selector. at Object.selectorMatches (/wp-content/plugins/microthemer/js-min/frontend.js?v=5.0.0.2&ver=4.7.5:1:11469) at Object.get_matching_selectors (/wp-content/plugins/microthemer/js-min/frontend.js?v=5.0.0.2&ver=4.7.5:1:27095) at Object.set_quick_go_options (/wp-content/plugins/microthemer/js-min/frontend.js?v=5.0.0.2&ver=4.7.5:1:9607) at Object.quick_targeting_actions (/wp-content/plugins/microthemer/js-min/frontend.js?v=5.0.0.2&ver=4.7.5:1:29116) at /wp-content/plugins/microthemer/js-min/frontend.js?v=5.0.0.2&ver=4.7.5:1:28429" Can you please advise, best regards, Bruno.
Sebastian May 17, 2017 at 12:35 pm	Hey Bruno, Great to hear that you’re enjoying the new version! Sorry about your current issue. I can see that it’s caused by the use of an opening curly brace character in the following selector you created: Header >> Flexslider container +3 more `.flexslider-container, .homepage-slider .slides, .homepage-slider .flex-viewport, .flexslider-inner-container { {` Microthemer adds { automatically, so you don’t need to do this when enter custom CSS selectors. To fix this issue, simply remove the curly brace from your selector. You can do that by navigating to the selector and then clicking its name in the top toolbar to reveal the editing options. I’ve just released an update to Microthemer (5.0.0.6), which should be available as an automatic update soon. MT now strips out curly braces, and anything after a curly brace. So you shouldn’t encounter this again future. Please let me know if you need help with anything else. And thanks for trying the beta. Sebastian
lisendra May 17, 2017 at 3:39 pm	Hi, Thanks you very much Sebastian, the new update solved the issue, could you please contact me with a support mail in private, i would prefer to avoid spaming the forum with useless issue, best regards, Bruno Ilic. PS: i would like to edit my previous post, to obuscate (remove) the domain name , but it seem that the option isn’t available after another reply, could you please help me?
Sebastian May 17, 2017 at 3:48 pm	Hey Bruno, I’ve removed the links to your site in the error report. Questions that might be relevant to other users are never spam. But if you’d prefer not to publish certain information online, I’m always happy to provide email support. I’ve sent you a message. Cheers, Sebastian
lisendra May 17, 2017 at 4:02 pm	HI, Thanks you very much Sebastian, best regards, Bruno Ilic.
Nelmedia May 18, 2017 at 12:41 pm	Hi Sebastian, Just used a PHP Compatibility plugin for PHP 7 and here’s the result for Microthemer 5.0.0.6: 1281 \| WARNING \| INI directive ‘safe_mode’ is deprecated since PHP 5.3 and removed since PHP 5.4. 1282 \| WARNING \| INI directive ‘safe_mode’ is deprecated since PHP 5.3 and removed since PHP 5.4. 1286 \| WARNING \| INI directive ‘safe_mode’ is deprecated since PHP 5.3 and removed since PHP 5.4. 1290 \| WARNING \| INI directive ‘safe_mode’ is deprecated since PHP 5.3 and removed since PHP 5.4. 4222 \| WARNING \| INI directive ‘safe_mode’ is deprecated since PHP 5.3 and removed since PHP 5.4. I guess these are all line numbers… So, just warnings, but you might want to take a look. Nelson
Sebastian May 18, 2017 at 3:23 pm	Many thanks for reporting this Nelson. I’ll address those warnings tomorrow. Sebastian
QloudPress May 18, 2017 at 5:22 pm	I assume the video was a good one? https://www.awesomescreenshot.com/image/2509008/29836601987b1b94c84f31dffd6e97ef
Sebastian May 18, 2017 at 6:28 pm	@QloudPress, thank you for reporting this. Here’s the correct video link for the getting started video: https://www.youtube.com/watch?v=NZFbc-KuMPk Not much I can do about the first newsletter batch sadly. But I’ve updated the link on the news article. Thanks again, Sebastian
Noosiekins May 18, 2017 at 10:26 pm	Hi! I just updated the Microthemer plugin and well… My menu by category is gone. This is the error message displayed on the page “Warning: Missing argument 3 for tvr_microthemer_frontend::add_first_and_last_classes() in /wp-content/plugins/microthemer/tvr-microthemer.php on line 9383” It just repeats itself. Help!
Sebastian May 19, 2017 at 11:26 am	@Noosiekins, would you mind sending me login details for your site, via our secure contact form? If you’d rather not, you should be able to remove the warnings by simply turning off the ‘Add first and last classes‘ option in Microthemer’s preferences. This might not be desirable if you wanted that functionality. And so I’d be happy to troubleshoot this more thoroughly if you can provide me with access to your site. Cheers, Sebastian
Noosiekins May 19, 2017 at 4:54 pm	Thanks! I’ve just sent you some login details over at secure contact. What is the “add first & last classes” functionality do?
Sebastian May 19, 2017 at 5:39 pm	Thanks for that. I’ve had a look, and I think there might be a compatibility issue with that feature and your theme: ProtoPress. One that needs to be addressed in the theme code, if my analysis is correct. The ‘add first and last classes’ feature adds extra CSS classes to the first and last menu items. This was useful for styling the first and last menu items differently from the rest. But it’s not so useful anymore because it’s easy to add :first-child and :last-child selectors with Microthemer now. The ‘add first and last classes’ feature is off by default on newer installs of Microthemer. So this problem shouldn’t affect too many people. I will raise a ticket with the theme author though to see if they can make an update to their theme. Are you OK for that feature remain off for now? Cheers, Sebastian
Noosiekins May 19, 2017 at 5:43 pm	Thanks. Good to know. I’m ok with it off for now. Until the next updates 🙂 Thanks for your help!
Sebastian May 19, 2017 at 5:56 pm	You’re welcome!
Abland June 11, 2017 at 2:41 pm	Version 5.0.2.4 – from the change log: “Added an option to enable Beaver Builder from within Microthemer. See the ‘View’ menu. This option only appears if Beaver Builder is installed an active.” I saw that in the code on the previous version and was clapping my hands in glee 🙂 Can’t wait to play later today!
Sebastian June 12, 2017 at 3:34 pm	Hey Abland, I’m glad you like that new feature. It’s been on my mind since you mentioned that you manually add ?fl_builder to the preview URL many moons ago. Some other suggestions you made will also make an appearance soon! I’ve also added an option to Load Beaver Builder media queries via the ‘Load media query set’ option on the Edit media queries screen. And I’m looking at other ways to improve the workflow too. All the best, Sebastian
adamsts July 4, 2017 at 6:20 am	Hi Sebastian. Great work on the recent updates. I am enjoying the plugin very much at the moment, especially as I use it more and discover the best way of accomplishing things. The Beaver Builder integration is clever and useful. I’ve spent many years hand-coding css and scss but prefer styling via the front end where possible. Your plugin gets me the closest to being able to use selectors and add my own custom code. Lately I have been using Beaver Builder and Beaver Themer for page layout and often end up customizing child theme code (php, css, js) as well. I have mainly been using either Genesis-based themes or GeneratePress for themes. Most of the things I’d like to see added you’ve mentioned already in this article under the What’s next section, particularly the css properties listed. Beyond that, I suppose having deeper integration and support for Sass would be helpful to someone like me. Definitely interested in where you go from here. Thanks!
Sebastian July 4, 2017 at 8:38 am	Hey @adamsts, Thanks for taking the time to leave feedback. It’s always great to hear when people are enjoying Microthemer! I’m also looking forward to adding the new CSS properties 🙂 With regards to ‘deeper integration and support for Sass’, did you have anything specific in mind? Cheers, Sebastian
adamsts July 4, 2017 at 7:57 pm	We’re sort of discussing this right now on the Facebook thread but I thought I’d post back here to complete the circle. Here is the comment I made regarding expansion of code view, live coding and sass: What I’ve started doing is creating all my base styles outside of MT and then adding them via the code editor view. Then I use MT as needed to tweak elements to override the base styles on any given element. What would be ideal is if the page view would update as I change make changes to the code rather than having to save to see the results. I could then manually code with the convenience of live front end editing, get all my bases styles in place and then carry on with tweaking via selectors. I’d also like to see expanded support for Sass. With the excellent organization of selectors in folders, I could see expanding this to include scss organization for mixins, partials, variables and so on. Could be well beyond the scope of what normal users would want or use so I understand if that’s not a big focus.
Sebastian July 5, 2017 at 6:01 pm	Hey Eric, What you’re requesting is actually on the road map. As long as I’m understanding you correctly. The two points you raised: Manually code with the convenience of live front end editing So you mean that, instead of hitting the ‘Ctrl+S’ keyboard shortcut to save settings and then wait for MT to update and reload the stylesheet, the CSS is instantly written to the browser with JavaScript? So a CSS property of color:red; will change the color of an element to red after you type the ‘d’ in red. This is indeed planned as 5.x update. MT will write JS to the head of the page instantly. As an interim preview before writing styles to the stylesheet. MT will do this for GUI selector fields as well as custom code areas. Expanded support for Sass So you would like to be able to have one code editor for e.g. SASS variables, another for mixins, and another for functions etc. Although you’re the first person to request this, it’s something I’ve been planning for some time. Although it wouldn’t be specific to SASS. What I had in mind was having an ‘Edit code editors’ screen that followings a very similar format to the ‘Edit media queries’ screen. Where you can define a custom code editor, give it a label, and then choose various options like CSS/SCSS vs JS code, All browsers vs IE conditional, whether the code should be wrapped in an MT media query (e.g. Phone, @media (max-width:480px)) and maybe some other fields. These custom code editors would replace the current fixed tabs in the full code view. Have I understood your requests correctly? And do my suggestions fulfil them? Cheers, Sebastian
adamsts July 7, 2017 at 1:12 am	Sebastian, Thanks for the feedback. I will do my best to provide meaningful detail below. I really don’t want you getting off in the weeds with requests that don’t benefit the majority of your users however I do appreciate your willingness to discuss these topics. Front-end Code Editor I hadn’t realized there was a keyboard shortcut even though I now see the helpful tooltip when hovering on the save icon. In some cases in other systems auto-update can be annoying when it updates too quickly. Having the keyboard shortcut is a good compromise so as far as I’m concerned this is fine as-is. Your plan to add auto-update sounds like it will work as well. I also hadn’t realized there was a toggle to resize the height of the code panel. That’s nice as well. The only other things I can think of at this point would be perhaps an option to dock the code panel to one side or the other (or either?). This would be helpful for me on a widescreen laptop where vertical space is limited. It would allow me to see more of the code while still having a mostly full-sized canvas. The other option might be a floating panel but that breaks your UI paradigm a bit so I understand if that’s not really a good option. Expanding Sass Support My idea was not so much different code editors as the ability to organize files into folders much like you have selectors today. I see what you mean by separate editors and do see how that could work as well. Here’s what I would have in the way of folder structure for a typical project where I use Sass – http://bit.ly/2uQmSpv. Honestly, I haven’t given this enough thought to provide meaningful feedback other than to say that supporting Sass by being able to organize the various files that make up a given project would be a great option. Your idea probably makes the most sense and would work just fine. I’ll reiterate my thought above and say that I don’t want to distract you with requests that don’t benefit the majority of your users so not focusing on this as a priority won’t offend me in any way. I would likely get more immediate benefit from the items you list under What’s Next in this article. Other Thoughts Lastly, I wanted to mention that I have been using MT extensively as part of an active project. As I’ve used it more and more I am becoming comfortable and increasing my productivity. I created the base styles in the code editor by hand, have added selectors for dozens of elements, some global and some page-specific. I even coded some jQuery in the JS code editor. All of this has proven to me that this is a solid tool that can be incorporated into my workflow. It is flexible enough to let me code by hand and clever enough to help me build out specific customizations via selectors which I can then hand off to less technical users to maintain OR can be disabled once development is done if I don’t want to hand off design to others. It ticks all the boxes and is what I was looking for when I set out to find a front end style editor plugin.
Sebastian July 11, 2017 at 9:19 am	Hi Eric, Thanks again for sharing your thoughts. Interesting that you missed the keyboard shortcut and height toggle. Those features are not as obvious as they could be. Along with some other features aimed at coders. I’ve sketched out a ‘Microthemer for coders‘ video that I plan to do some time next week. Hopefully that will illuminate some potentially missed features in lieu of adjusting the UI to make certain options more obvious. I like your docking idea for the code editor too. You’re the second coder to request some more flexibility in this area. Regarding SCSS structure, yes I probably won’t try to add a file manager. The directory structure you referenced can be created in a /my-theme/sass folder. And then the main.scss file can be imported in MT, or MT’s code editor can be the main.scss file, which imports all of the dependencies. My suggestion to create separate custom code editors should suffice if you want to be able to edit ‘SASS bits’ (e.g. home.scss or footer.scss) via MT. And it’s great to hear how you’ve managed to incorporate MT into your workflow. Using it as a collaboration too with less technical users too. Awesome! Sebastian
Nelmedia July 18, 2017 at 2:27 am	Hi Sebastian, I don’t know if it’s something hard to implement, but the only thing I don’t like that much about Microthemer is working with Google Fonts… It’s great to have easy access to it, but IF IT’S POSSIBLE, I’d like to see some improvements… 1- When we click to select a Google Font, it would be nice if we could filter them with some filters: for example Serif, Sans-serif, Monospace and Cursive fonts; I’ve seen on other places filter for fonts recommended for titles, etc… I know it’s big and it might even require to redo the entire Google Font interface… So, tell us what’s possible with it… 2- Sometimes, we know exactly which font we want, but we have to 1- switch to alphabetical view, and 2- search through every page to find the right font… It would be nice if we could search for a specific font in a search field and click on it… 3- Similar to the previous one, it would be nice to simply allow us to type the desired font into the font text field instead of having to open the dialog box and choose it there… We can do so right now, but only for the predefined fonts in the drop-down, not for Google Fonts… So, I’m surely not the only one that would like those improvements… if it hasn’t been done it might be because it’s nearly impossible… But who knows, you have come with more miracles than I anticipated with the v.5 release 😉 Great job!