2

I'm trying to add a CSS sheet to only the homepage.

I have copied the cms_index_index.xml to app/design/frontend/name/example/Magento_CMS/layout/cms_index_index.xml

I have added this code:

 <body>
    <head>
        <css src="name_example::css/slick-theme.css" />
    </head>
 </body>

I have flushed the cache multiple times. I do have the correct theme chosen. How do I add it?

4

Typo mistake there. Change

app/design/frontend/name/example/Magento_CMS/layout/cms_index_index.xml

To

app/design/frontend/name/example/Magento_Cms/layout/cms_index_index.xml

I do have the correct theme chosen

If you have verified that, then it should work with the path change

update

Your xml should look like this

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        ... <!-- your css here -->
    </head>
</page>
  • I did that and I got this error- Element 'head': This element is not expected. Expected is one of ( attribute, block, referenceBlock, referenceContainer, container, move, uiComponent ). Line: 853 So I removed the head tags and got this- Element 'css': This element is not expected. Expected is one of ( attribute, block, referenceBlock, referenceContainer, container, move, uiComponent ). Line: 853 – tjjen Apr 17 '18 at 18:51
  • I have edited my answer, there was another error in your xml file – Raul Sanchez Apr 17 '18 at 18:58
  • You welcome @tjjen – Raul Sanchez Apr 17 '18 at 19:03
0

Go to the admin

Content > Pages > Select your home page that you want edit.

In the content area, you can add your CSS inline - also cuts the number of calls down.

    <style xml="space"><!--
.product-item .product-reviews-summary .reviews-actions, .catalog-category-view .action.tocart, .action.primary, .action.tocompare, a.action.tocompare, .action.tocompare, .product-item-actions .actions-primary+.actions-secondary { display: none; }.product-item .price-box {margin: 5px;}.product-item-details {text-align: center;}
--></style>

I found that I have to use the exact tags for it to work - This is the first line of the content area.

<style xml="space"><!--

and this end the css.

--></style>

Below that, add your homepage information as needed.

Hope that helps some.

  • The wysiwyg crashes and I get a 500 Internal server error when the <!-- --> comment tags are there upon save. When I remove them and save everything is fine. – Matthew McLennan Dec 17 '18 at 18:32
  • Does it work without the <style xml="space"><!-- ? – dawhoo Dec 19 '18 at 18:53
  • 1
    It worked once that was removed. – Matthew McLennan Dec 19 '18 at 21:24
  • @MatthewMcLennan thanks, that may help someone out a lot. It's funny how one thing works some someone, but not another. With so many different setups, servers, and configurations, we need as much help as we can get! – dawhoo Dec 21 '18 at 11:40

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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