New To Microthemer …. Question about the Full Code Editor

This topic contains 7 replies, has 2 voices, and was last updated by  Sebastian 5 months, 1 week ago.

Author Posts

diywm

Hi – I bought Microthemer because I’m using Oxygen and wanted a solution to writing CSS independently of Oxygen. However I am struggling with it when it’s not in full editor mode. I find all the buttons for targeting and doing CSS more confusing to use than just figuring out the targeting on my own and writing the CSS myself. So I am using it by setting the full code editor to on.

In this mode it’s fine but I don’t see any way to make multiple separate files if I wanted to. Is that possible? In this mode has everything always got to be in one file?


Sebastian

Hey,

Currently, the full code view CSS does gets written to a single file (active-styles.css) – the same file as the CSS code that is generated when using the other view.

In the not too distant future, the full code view will be merged with the folder system in the main view. So, as well as adding individual selectors to a folder, you will be able to add free form CSS or Sass snippets too. Optionally, assets added to a specific folder can be written to a separate CSS file. To enable this, you will be able to assign page logic to folders, so that certain CSS files can load on certain pages of the site.

I understand if you prefer to write CSS code by hand, rather than use the GUI fields. The advanced targeting options are designed to offer the same inspection tools you get with the browser, but with the advantage of not needing to copy and paste selectors. This video explains how to use the targeting options – just thought it worth mentioning. Also, I’m happy to explain any specific aspects of the program you have questions about.

Thanks,
Sebastian


diywm

Thanks for that.

I watched the video and can see how I could target items if I needed to, using the target tools, but still carry on using the full code editor (my brain cannot hack the button interface). I’d previously missed the breadcrumbs along the bottom which help when you can’t quite click on the precise thing you want to target.

But I do not see what purpose the label has. If I change it, it has no bearing on what is deposited in the SCSS window. Why would I want to change it anyway and even if I did, how would it get added as a class or id to the code, and if it did what makes it a class as opposed to an id? Or is it something else?


Sebastian

You’re absolutely right. There is no need for those fields in the full code view. I’ve just released version 6.0.7.6 which hides the fields when they’re not needed.

BTW you can click on the lines of HTML in the pane on the left to target elements too. Sometimes that’s easier than the breadcrumbs when elements aren’t directly clickable.


diywm

Oh OK – thank you. I am upgrading now to see the difference.

But …. I must ask … what’s the point of the labels for the other mode of use?


Sebastian

The labels are useful when the actual CSS selector code isn’t very meaningful. Noobs often don’t know what the selector code relates to. And for experienced coders, it sometimes useful to use a label if the HTML markup isn’t semantic. For instance, page builders often add random string classes e.g.

.my-builder-j9024ufj2o4j024

And in this case, it’s useful to add the label e.g. “Testimonials” when creating the selector.

You can also opt to use the actual CSS code as a label when working in the main view by the way. See the option to the right of the selector label field.

Cheers,
Sebastian


diywm

Thanks Sebastian. I think I’m all set now. Microthemer is a really robust solution and I’m very happy using the editor mode now.


Sebastian

That’s great. I’m here if you have any more questions 🙂

You must login or register to reply to this topic.