0

I am trying to include custom css and js in custom theme and should come on all pages.

I have tried this from the Magento DevDocs, but I can't make it right and it's not showing. Please help me.

7ochem
7,61516 gold badges54 silver badges82 bronze badges
asked Feb 17, 2016 at 8:23
2
  • file css or js just in custom theme/web/css/file-css-name.css then refresh cache. maybe help you. Commented Feb 17, 2016 at 9:06
  • php bin/magento setup:static-content:deploy did you deploy content? Commented Feb 17, 2016 at 10:33

2 Answers 2

5

For keep css and js in all pages you have to customize default_head_blocks.xml file. set file,

magento2/app/design/frontend/{Vendor}/{themename}/Magento_Theme/layout/default_head_blocks.xml file

Put inside <head> tag,

<css src="css/styles.css"/> 
<script src="js/custom.js"/>

Add your css file inside,

app/design/frontend/{Vendor}/{theme}/web/css/styles.css

Add your custom js 

 app/design/frontend/{Vendor}/{theme}/web/js/custom.js

Remove cache folder and try.

Its now working in all pages of site.

answered Feb 17, 2016 at 9:11
5
  • Thanks. Although i have tried this and i was not aware that it will convert into .min.css. Actually it was there morning also. I was looking for my css. :) Commented Feb 17, 2016 at 11:05
  • also if we are editing the css, always its rendering from pub static folder and every time we need to refresh to see the css change in frontend. Is there any possible way to see css change every refresh of page? Commented Feb 17, 2016 at 11:07
  • apply command php bin/magento deploy:mode:set developer && php bin/magento cache:clean Commented Feb 17, 2016 at 11:11
  • after done above command , deploy theme using, php magento setup:static-content:deploy, may be solve your issue. Commented Feb 17, 2016 at 11:11
  • I Found This Magento2Site\vendor\magento\theme-frontend-blank\Magento_Theme\layout\default_head_blocks.xml Commented Jan 30, 2018 at 10:14
0

When I updated my theme, my css files got deleted from app/design/bluesky/frontend/theme-name/web/css/custom.css and also the path from the default_head_block_xml.

answered Oct 11, 2021 at 2:14

Your Answer

Draft saved
Draft discarded

Sign up or log in

Sign up using Google
Sign up using Email and Password

Post as a guest

Required, but never shown

Post as a guest

Required, but never shown

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

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.