Ttdfjt

Does one make a shehecheyanu on "used" jewelry?

Are those flyers about apartment purchase a scam?

Are there any other rule mechanics that could grant Thieves' Cant?

Do Reform Jews believe in a theistic God?

Help, I cannot decide when to start the story

If "more guns less crime", how do gun advocates explain that the EU has less crime than the US?

Is there any way to stop a user from creating executables and running them?

Corroded Metal vs Magical Armor, should it melt it?

Do I have to cite common CS algorithms?

Why am I not billed for EOB balance?

Aderet's Anonymous Sefer and Haskamah?

How is являться different from есть and быть

Boss asked a co-worker to assault me

A torrent of foreign terms

Concat Loop Results to determine if contains value

Are differences between uniformly distributed numbers uniformly distributed?

How would timezones work on a planet 100 times the size of our Earth

What can Amex do if I cancel their card after using the sign up bonus miles?

The cat ate your input again!

Telephone number in spoken words

How to Check all AD userers for "blank" password?

What are these funnel-looking green things in my yard?

Why aren't rockets built with truss structures inside their fuel & oxidizer tanks to increase structural strength?

How do some PhD students get 10+ papers? Is that what I need for landing good faculty position?

How to add JS and CSS calling in PHTML file?

How to load a phtml file only for homepage? (Magento 2)Show PHTML-file in CMS page is not workingHow to include module's CSS in CMS pages with module blockHow to properly add “.phtml” files to cms home page?Call custom_module phtml file in cms pageHow to call phtml file in static block - Magento 2Magento 2 add block with js then call it from cmsMagento 2 - Custom style _listings.less not workinghow to call phtml file in static block?Not able to add Custom phtml file on Product Page - Magento 2.2.4

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;

2

1

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!

magento2 javascript phtml

share|improve this question

edited Feb 20 at 18:23

Rafael Corrêa Gomes

5,15022 gold badges3636 silver badges7272 bronze badges

asked Aug 3 '17 at 7:28

shivashankar mshivashankar m

1,37199 silver badges3131 bronze badges

• 
  
  
  

  
  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
  
  – shivashankar m
  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
  
  – shivashankar m
  Aug 3 '17 at 10:32
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  css and js are like below (Reload the page to get source for: /magento2/js/index.js/)
  
  – shivashankar m
  Aug 3 '17 at 10:59
  
  

  
  
  
  

add a comment | 

2

1

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!

magento2 javascript phtml

share|improve this question

edited Feb 20 at 18:23

Rafael Corrêa Gomes

5,15022 gold badges3636 silver badges7272 bronze badges

asked Aug 3 '17 at 7:28

shivashankar mshivashankar m

1,37199 silver badges3131 bronze badges

• 
  
  
  

  
  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
  
  – shivashankar m
  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
  
  – shivashankar m
  Aug 3 '17 at 10:32
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  css and js are like below (Reload the page to get source for: /magento2/js/index.js/)
  
  – shivashankar m
  Aug 3 '17 at 10:59
  
  

  
  
  
  

add a comment | 

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!

magento2 javascript phtml

share|improve this question

edited Feb 20 at 18:23

Rafael Corrêa Gomes

5,15022 gold badges3636 silver badges7272 bronze badges

asked Aug 3 '17 at 7:28

shivashankar mshivashankar m

1,37199 silver badges3131 bronze badges

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

share|improve this question

edited Feb 20 at 18:23

Rafael Corrêa Gomes

5,15022 gold badges3636 silver badges7272 bronze badges

asked Aug 3 '17 at 7:28

shivashankar mshivashankar m

1,37199 silver badges3131 bronze badges

share|improve this question

edited Feb 20 at 18:23

Rafael Corrêa Gomes

5,15022 gold badges3636 silver badges7272 bronze badges

asked Aug 3 '17 at 7:28

shivashankar mshivashankar m

1,37199 silver badges3131 bronze badges

edited Feb 20 at 18:23

Rafael Corrêa Gomes

5,15022 gold badges3636 silver badges7272 bronze badges

edited Feb 20 at 18:23

Rafael Corrêa Gomes

5,15022 gold badges3636 silver badges7272 bronze badges

asked Aug 3 '17 at 7:28

shivashankar mshivashankar m

1,37199 silver badges3131 bronze badges

asked Aug 3 '17 at 7:28

shivashankar mshivashankar m

1,37199 silver badges3131 bronze badges

2 Answers
2

active

oldest

votes

1

You can follow the bellow technique.

You can also get static file location url directly:-

$block->getViewFileUrl();

share|improve this answer

answered Aug 3 '17 at 10:39

DelwaRDelwaR

4422 bronze badges

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  let us know, How to give other path here:<link rel="stylesheet" type="text/css" href="<?php echo $block->getUrl();?> other-path">
  
  – shivashankar m
  Aug 3 '17 at 10:56
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  <link rel="stylesheet" type="text/css" href="<?php echo $block->getUrl('css/index.css');?> ">
  
  – shivashankar m
  Aug 3 '17 at 10:56
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I was given liken lik above
  
  – shivashankar m
  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
  
  – shivashankar m
  Aug 4 '17 at 4:05
  

  
  
  
  

add a comment | 

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

share|improve this answer

edited Aug 2 at 6:23

answered Aug 2 at 6:16

Mona MehtaMona Mehta

10577 bronze badges

add a comment | 

Your Answer

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "479"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: false,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: null,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f187645%2fhow-to-add-js-and-css-calling-in-phtml-file%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

1

You can follow the bellow technique.

You can also get static file location url directly:-

$block->getViewFileUrl();

share|improve this answer

answered Aug 3 '17 at 10:39

DelwaRDelwaR

4422 bronze badges

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  let us know, How to give other path here:<link rel="stylesheet" type="text/css" href="<?php echo $block->getUrl();?> other-path">
  
  – shivashankar m
  Aug 3 '17 at 10:56
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  <link rel="stylesheet" type="text/css" href="<?php echo $block->getUrl('css/index.css');?> ">
  
  – shivashankar m
  Aug 3 '17 at 10:56
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I was given liken lik above
  
  – shivashankar m
  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
  
  – shivashankar m
  Aug 4 '17 at 4:05
  

  
  
  
  

add a comment | 

1

You can follow the bellow technique.

You can also get static file location url directly:-

$block->getViewFileUrl();

share|improve this answer

answered Aug 3 '17 at 10:39

DelwaRDelwaR

4422 bronze badges

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  let us know, How to give other path here:<link rel="stylesheet" type="text/css" href="<?php echo $block->getUrl();?> other-path">
  
  – shivashankar m
  Aug 3 '17 at 10:56
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  <link rel="stylesheet" type="text/css" href="<?php echo $block->getUrl('css/index.css');?> ">
  
  – shivashankar m
  Aug 3 '17 at 10:56
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I was given liken lik above
  
  – shivashankar m
  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
  
  – shivashankar m
  Aug 4 '17 at 4:05
  

  
  
  
  

add a comment | 

You can follow the bellow technique.

You can also get static file location url directly:-

$block->getViewFileUrl();

share|improve this answer

answered Aug 3 '17 at 10:39

DelwaRDelwaR

4422 bronze badges

$block->getViewFileUrl();

share|improve this answer

answered Aug 3 '17 at 10:39

DelwaRDelwaR

4422 bronze badges

answered Aug 3 '17 at 10:39

DelwaRDelwaR

4422 bronze badges

answered Aug 3 '17 at 10:39

DelwaRDelwaR

4422 bronze badges

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

share|improve this answer

edited Aug 2 at 6:23

answered Aug 2 at 6:16

Mona MehtaMona Mehta

10577 bronze badges

add a comment | 

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

share|improve this answer

edited Aug 2 at 6:23

answered Aug 2 at 6:16

Mona MehtaMona Mehta

10577 bronze badges

add a comment | 

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

share|improve this answer

edited Aug 2 at 6:23

answered Aug 2 at 6:16

Mona MehtaMona Mehta

10577 bronze badges

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

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

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

share|improve this answer

edited Aug 2 at 6:23

answered Aug 2 at 6:16

Mona MehtaMona Mehta

10577 bronze badges

answered Aug 2 at 6:16

Mona MehtaMona Mehta

10577 bronze badges

answered Aug 2 at 6:16

Mona MehtaMona Mehta

10577 bronze badges