Magento – How to edit custom css In Magento 2 and we using porto theme

csslayoutmagento2theme

How to edit custom css In Magento 2 and we using porto theme ?

I'm using this code base theme working

app/design/frontend/vendor_name/theme_name

run below command to set developer mode

php bin/magento deploy:mode:set developer

and clear cache and deploy static-content

php bin/magento cache:clean

php bin/magento setup:static-content:deploy

But porto theme not working

Best Answer

We are using Same Porto Theme.

I recommend do not make changes in Porto Theme. Because they are upgrading their Versions. Once you upgrade to their latest version, your changes will be given.

So create your theme, by setting Porto as Parent.

magento\app\design\frontend\My\ThemeName\web\css\source\header.less
magento\app\design\frontend\My\ThemeName\web\css\source\footer.less

For how to create theme

http://devdocs.magento.com/guides/v2.1/frontend-dev-guide/themes/theme-create.html

Magento 2: How to override Luma Theme Home Page

magento\app\design\frontend\My\theme_name\theme.xml

<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
    <title>My Porto Child</title>
    <parent>Smartwave/porto</parent>
    <media>
        <preview_image>media/preview.png</preview_image>
    </media>
</theme>

At the End Run below commands

php bin/magento setup:upgrade
php bin/magento setup:di:compile
php bin/magento setup:static-content:deploy
php bin/magento indexer:reindex
php bin/magento cache:flush
chmod -R 777 var pub
Related Topic