0

Is it possible to include in the already created custom.css adjustments that apply for the home page? It is about changing the style for H1 en H2 tags of the homepage. But i would not like that the H1 and H2 tags on other pages would be affected.

At the beginning i thought about creating a second custom.css and call it on the local.xml, but now i heard that i should try to make it on the already created custom.css (that has also adjustments for other pages of my webshop).

Any tips, suggestions, links?

Thanks for your collaborations.

2 Answers 2

0

You can use any CSS file for this, just target the homepage body class so other pages aren't affected. For example:

.cms-index-index h1 {
    color: red;
}
1

@Ben Crook's answer should work just fine, but there is an alternative method with a separate CSS file:

In [magento-root]/app/design/frontend/[your]/[theme]/layout/local.xml add the following:

<cms_page>
    <reference name="head">
        <action method="addItem">
            <type>skin_css</type>
            <name>css/homepage.css</name>
        </action>
    </reference>
</cms_page>

Then you can add the specific styles in the newly utilized file: [magento-root]/skin/frontend/[your]/[theme]/css/homepage.css

Note: This will be added to all of your cms_pages. If you want to avoid that, you can try working with different handles in place of the <cms_index_index>, but without a custom handle, it is far easier to save this in Magento admin.

Under Magento Admin->Cms->Pages->[Edit your Homepage], add the following snippet under Design->Layout Update XML:

<reference name="head">
    <action method="addItem">
        <type>skin_css</type>
        <name>css/homepage.css</name>
    </action>
</reference>
1
  • There are pros and cons to each method to, with this method there are more requests but the positive is the CSS is only rendered where it's used. And vice versa with the method I mentioned, if it's only a small amount of CSS I'd personally go down the less requests route.
    – Ben Crook
    Sep 6, 2017 at 16:11

Your Answer

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

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