customizing css for ultimo theme

Question

Hi am new to ultimo and recently am trying to add my own custom CSS in order

where you have put this css file? – Amit Bera Dec 17 '19 at 10:11 — Amit Bera, Dec 17 '19 at 10:11
in my custom module vendor\Module\view\frontend\web\css – Pramod Dec 17 '19 at 10:43 — Pramod, Dec 17 '19 at 10:43
add head tag outside of body tag and inside of page tag – Shafeel Sha Dec 17 '19 at 11:39 — Shafeel Sha, Dec 17 '19 at 11:39

score 2 · Accepted Answer · answered Dec 17 '19 at 12:16

I think the code should be 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>
        <css src="Learning_Module::css/custom-style.css" />
    </head>
    <body>

    </body>
</page>

score 0 · Answer 2 · answered Mar 30 '20 at 01:41

I agree with @Partab, just want to add more details to the answer. The file has to be exactly app/design/frontend/Infortis/custom/Magento_Theme/layout/default_head_blocks.xml where Infortis - is the theme vendor name, custom - name of the child theme, Magento_Theme - is the folder where the default_head_block.xml has to be stored, otherwise, it won't work.

The content of the .xml has to be

<?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>
        <css src="css/custom.css"/>
    </head>
</page>

Then you can add your own css rules to custom.css file. custome.css has to be stored at app/design/frontend/Infortis/custom/web/css/custom.css

Then you would delete the content of pub/static except the .htaccess file, then do the static deploy command

php bin/magento setup:static-content:deploy

Then flush and clean magento cache

php bin/magento cache:clean
php bin/magento cache:flush

Cleaning Magento cache is not necessary, but it will help sometimes.

customizing css for ultimo theme

2 Answers2