0

I have created child theme but on page css from child theme is loaded before css from parent theme, and I don't get correct style. Is there a way to specific order of loading scripts from theme (to set child theme to load last) Example: In parent css -> .home{ color: red;} In child css -> .home{color: blue;} In page color is red, because parent is loaded last.

And I another question, can I turn off styles from parent theme on specific page? Problem is next: 1. Lets say i have class about-us in both css in parent and in child theme. 2. In parent theme it has one group of attributes, for example color and size 3. In child theme in has another group of attributes, for example background and line-heigh. 4. I want to my class in specific page load only attributes from child theme.

Is there a way not to load parent's styles at all on specific page?

2 Answers 2

0

You can use this extension for Magento2: Mage2-Ordered-Assets.

Once You have installed this extension, You can use "order" attribute in Your css tags. For example if You have styles file "css/style.css" use the code below:

<head>
    <css src="css/style.css" order="100" />
</head>

If "order" attribute is not provided, it will be treated by default as "1".

If You would like to override class from Your parent theme, override it in Your child theme:

Parent theme style:

.exampleclass{
    height: 200px;
    float: left;
 }

Child theme style:

.exampleclass{
    height: auto;
    float: none;
 }
2
  • Thank you for quick answer. This solved part of my problem. Is there a way not to load style for class from parent css in specific page. For example in my parent is .exampleclass{height: 200px} and I don't want to that be in my page which use child theme. Commented Jul 14, 2017 at 15:25
  • As far as i know, there is no solution for not loading specific class from a css styles file, if the whole file is loaded. I might be wrong, but I have no other ideas than overriding class. Accept this answer if You find it helpful please. Greetings!
    – Kuba M
    Commented Jul 14, 2017 at 19:16
0

Content -> Configuration -> edit (child theme) -> HTML Head -> Scripts and Style Sheets: enter image description here

Every page has a page class like this: .cms-about-us-page

enter image description here

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.