order of precedence for styling

Home Forums WordPress Themes – Premium Luminescence order of precedence for styling

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #15146

    Hi,

    just installed Lum pro & child for a friend’s site and I’m fooling around trying to understand things before I dive in and break things

    There are several things that can be styled in the Customize menu, and I see that changes there are not reflected in the child’s style.ccs. Correspondingly, I can’t seem to change properties in the Customize menu at the style.css level.

    Am I correct in presuming that whatever’s in the Customize menu should be changed there, and anything else not there can be changed directly in the css?

    You recommend using Jetpack as an alternative for styling. What would happen if I install & activate the Jetpack css editor, how does it play with Luminiscence? Would it take over and save changes in Lum child’s style ccs or add a third styling layer? — I presume the Customize menu options would still take precedence over anything else

    Cheers,
    Alfredo

    #19901
    Sushil Adhikari
    Moderator

    Hi Alfredo…I’m here to help you out. My first question would be, did you create a custom menu or using the default menu (pages only)?

    Jetpack is just one option of a few, but jetpack also contains a lot more built in plugins of different things. For the Edit CSS, it adds this to the Appearance menu in the admin which you can use to override any CSS from the theme. Basically it will create a new stylesheet with your changes, in turn, helps when you update the theme at any point without losing your modifications. However, a child theme is needed if at any time in the future you decide to edit the actual files of the theme.

    It should not matter if you are using the child theme or the parent theme, Jetpack will work for both as the child theme simply inherits everything from the parent theme’s CSS and functionality. I believe it would take over css changes you add to the child theme (but you may want to try that because off hand, its only my guess, but I don’t see why it shouldn’t.

    About the customizer and any menu CSS overrides you do, the overrides should work. It depends on where the new stylesheet from jetpack loads. If it loads after all theme styles including those in the portion of your page code, then yes.

    #19902

    Thank you.

    I will use the child theme, as it’s possible that at some moment I may need to go into the files, yes. In that case I see Jetpack more as a convenience for my friend afterwards, as she gets just the one option in the menu clearly stating ‘Edit CSS’. And possibly Jetpack has some other things that’ll be of use for her too. I’ll look into that.

    The menu is custom, so far, in that I started changing colours, and I’ll start changing width, position and a couple of other things. When I tried to change colours in the stylesheet I discovered later that those changes regarding options accessible through ‘Theme | Customize’ do not work, so I’ll have to change things in two different places. Not a problem, as it’s logical once I think about it. As you say, I’ll have to test Jetpack and see whether it works the same way.

    #19941

    Right, I’ve been experimenting, and I’m going with Lum Child and using Jetpack for the CSS. Works very well, except where the theme customizer takes precedence. In particular, I’m trying for transparency for certain elements, but the theme customizer only allows for defining colours in hex.

    I checked with firebug and I can isolate those elemnts alright and transparency/rgba & opacity work well enough for a start. I guess I’ll have to dive into the child’s files and make some changes there.
    If you could point me to to right files? Then there’s the question of not letting the menu customizer to override that change, but we’ll see…

    In the customizer the elements are called ‘content background’ and ‘color background’. The elements I changed to transparent in firebug are .row-fluid and #bottom-wrapper

    The attached screenshot is the firebug result
    transparent.jpg

    Attachments:
    You must be logged in to view attached files.
    #19943
    Sushil Adhikari
    Moderator

    Thanks for the info of the customizer settings because I had to think, OK, where did I put that….

    The “content background” is in the header.php file which looks like this:

    <div class="row-fluid lum-equal-wrap" style="background-color: ">

    The php code there is what sets the customizer inline style for the container.

    Basically any customizer php code you see like:

    ….is what does the styling from the customizer, but as you pointed out, it only does HEX colours. This is one of the limitations of the WordPress Customizer (a core function). Anything you want to change to an rgba means removing the php code on whichever elements you need to change in the theme files.

    Caution to any modifications you make to the bootstrap containers like “row”, “row-fluid”, “container”, and the spans that you see like span8, span4…etc. Ultimately you should not modify these.

    #15147

    Great! thanks!! worked excellently 🙂

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.