2

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

app/design/frontend/Smartwave/porto/Smartwave_Porto/layout/default.xml

<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:

app/design/frontend/Smartwave/porto/Smartwave_Porto/templates/test.phtml

Thanks!

5
  • 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, 2017 at 7:32
  • Then how, Where to call Aug 3, 2017 at 8:17
  • you have already called in default.xml. So it should be available everywhere on frontend.
    – Sejal Shah
    Aug 3, 2017 at 10:05
  • ok, but i want it in cms page loading to frontend Aug 3, 2017 at 10:32
  • css and js are like below (Reload the page to get source for: /magento2/js/index.js/) Aug 3, 2017 at 10:59

2 Answers 2

1

You can follow the bellow technique.

enter image description here

You can also get static file location url directly:-

$block->getViewFileUrl();
5
  • let us know, How to give other path here:<link rel="stylesheet" type="text/css" href="<?php echo $block->getUrl();?> other-path"> Aug 3, 2017 at 10:56
  • <link rel="stylesheet" type="text/css" href="<?php echo $block->getUrl('css/index.css');?> "> Aug 3, 2017 at 10:56
  • I was given liken lik above Aug 3, 2017 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, 2017 at 18:24
  • I tried this but remain same Aug 4, 2017 at 4:05
0

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.