I am including JS validations in Magento, there respected .js and .css files included like:


<css src="Smartwave_Porto::css/index.css"/>
<script src="Smartwave_Porto::js/index.js"/>

and include those css, js files in :

app/design/frontend/Smartwave/porto/Smartwave_Porto/web/css and js

I have created a CMS Page and call the test.phtml file in cms page

I want to include css and js files in the test.phtml file but I cant.

Explain how to inlude those css and js files in .phtml file Location of .phtml file:



  • 1
    You can not call js and css files in phtml files. However if you are including js and css files in default.xml it should be available overall the frontend.
    – Sejal Shah
    Aug 3 '17 at 7:32
  • Then how, Where to call Aug 3 '17 at 8:17
  • you have already called in default.xml. So it should be available everywhere on frontend.
    – Sejal Shah
    Aug 3 '17 at 10:05
  • ok, but i want it in cms page loading to frontend Aug 3 '17 at 10:32
  • css and js are like below (Reload the page to get source for: /magento2/js/index.js/) Aug 3 '17 at 10:59

You can follow the bellow technique.

enter image description here

You can also get static file location url directly:-

  • let us know, How to give other path here:<link rel="stylesheet" type="text/css" href="<?php echo $block->getUrl();?> other-path"> Aug 3 '17 at 10:56
  • <link rel="stylesheet" type="text/css" href="<?php echo $block->getUrl('css/index.css');?> "> Aug 3 '17 at 10:56
  • I was given liken lik above Aug 3 '17 at 10:56
  • $block->getUrl() will give your base path like example.com. Other path means your css or js file folder structure after your main path.
    – DelwaR
    Aug 3 '17 at 18:24
  • I tried this but remain same Aug 4 '17 at 4:05

You can add below code in PHTML file to call js

<script src="<?= $block->getViewFileUrl('Namespace_Vendorname::js/myjs.js')?>"/>

And to call CSS file add :

<link rel="stylesheet" type="text/css" href="<?= $block->getViewFileUrl('Namespace_Vendorname::css/mycss.css')?>">

$block->getViewFileUrl('Namespace_Vendorname::js/myjs.js') will load js from pub/static/frontend/ThemeNamespace/ThemeName/en_US/Namespace_Vendorname/jspath.

<link rel="stylesheet" type="text/css" href="<?= $block->getViewFileUrl('css/mycss.css')?>">

Above code will load CSS file from pub/static/frontend/ThemeNamespace/ThemeName/en_US/css

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.