2

I want to add an external js in my home page. The external js loads a popup form in my home page. I have tried the code in phtml file and also in xml file. In both case the form will appear. But some js errors in the console

https://prnt.sc/mo0mnj

Uncaught TypeError: Cannot read property 'version' of undefined

Uncaught TypeError: owl.owlCarousel is not a function

Here is my code

cms_index_index.xml

<body>       
   <referenceContainer name="before.body.end">
        <block class="Magento\Framework\View\Element\Template" name="constant_contact" template="Magento_Theme::constantcontact.phtml"/>
   </referenceContainer>
</body>

constantcontact.phtml

<script> var _ctct_m = "5454agf54b30f4dfb97a"; </script>
<script id="signupScript" src="//static.test.com/js/new-form-widget/current/test-form-widget.min.js" async defer></script>

Please help me

Improve this question
11

2 Answers 2

Reset to default
0

I was having a similar problem and this worked for me:

<page>
<head>

<link src="//static.test.com/js/new-form-widget/current/test-form-widget.min.js" src_type="url" />

</head>
</page>
Improve this answer
-1

JavaScript, CSS, and other static assets are added in the section of a page configuration file. The default look of a Magento store page is defined by app/code/Magento/Theme/view/frontend/layout/default_head_blocks.xml.

The recommended way to add CSS and JavaScript is to extend this file in your custom theme, and add the assets there. The following file is a sample of a file you must add:

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <!-- Add local resources -->
        <css src="css/my-styles.css"/>

        <!-- The following two ways to add local JavaScript files are equal -->
        <script src="Magento_Catalog::js/sample1.js"/>
        <link src="js/sample.js"/>

        <!-- Add external resources -->
    <css src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css" src_type="url" />
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js" src_type="url" />
        <link rel="stylesheet" type="text/css" src="http://fonts.googleapis.com/css?family=Montserrat" src_type="url" />
    </head>
</page>

Reference : https://devdocs.magento.com/guides/v2.3/frontend-dev-guide/layouts/xml-manage.html#layout_markup_css

Improve this answer
1

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.