1

I'm using Magento 2 Porto theme and I relocate the position of some header elements like language selector etc. its working fine sometimes but after removing the browser cache its showing following js errors:

SCRIPT438: Object doesn't support property or method 'widget'

SCRIPT438: Object doesn't support property or method 'stellar'

HTTP404: NOT FOUND - The server has not found anything matching the requested URI (Uniform Resource Identifier).

SCRIPT5007: Unable to get property 'timepicker' of undefined or null reference

SCRIPT438: Object doesn't support property or method 'swMegamenu'

SCRIPT438: Object doesn't support property or method 'owlCarousel'

when I refresh it again then all the errors were gone and the page works fine once again. On the Internet Edge its showing JS errors all the time. I tried to upload the backup files but still seeing the same issue. Any one can help me to fix this issue

Thanks!

  • i have the same issue in developer mode, but in production mode with js and css merged it works correctly. – LucScu Jul 17 '17 at 13:55
  • Does this happen if you revert back to the Blank theme? If not you should be asking the theme developers for assistance, I don't have a good impression of the theme as people are always running into issues with it. – Ben Crook Jul 17 '17 at 14:02
  • I am facing issues with porto theme. – Himanshu Macrew Jul 19 '17 at 7:46
  • @HimanshuMacrew have you found any solution for this? Actually I am facing this type of issue with dotdotdot.js plugin. – Knight017 Sep 18 '18 at 11:42
1

This is a known error in the Porto theme (see more here https://themeforest.net/item/porto-ultimate-responsive-magento-theme/9725864/comments?page=141) , if you don't have experience with RequireJS it's best if you ask assistance from the theme developer.

The error is trown because of incorrect Javascript use in the static blocks used by the Porto theme. You should check all the JS resources in the static blocks and pages (for example, the homepage and all the Owl sliders).

Markup should be like this (owl slider example):

        require([
            'jquery',
            'owl.carousel/owl.carousel.min'
        ], function ($) {
            $("#featured_product .owl-carousel").owlCarousel({
                autoplay: true,
                autoplayTimeout: 5000,
                autoplayHoverPause: true,
                margin: 10,
                nav: true,
                navText: ["<em class='porto-icon-left-open-huge'></em>","<em class='porto-icon-right-open-huge'></em>"],
                dots: false,
                navRewind: true,
                animateIn: 'fadeIn',
                animateOut: 'fadeOut',
                loop: true,
                responsive: {
                    0: {
                        items:2
                    },
                    768: {
                        items:3
                    },
                    992: {
                        items:4
                    },
                    1200: {
                        items:5
                    }
                }
            });
        });

Example RequireJS file (app/design/frontend/Vendor/Theme/requirejs-config.js):

var config = {
    paths: {
        'owl':                  'Magento_Theme/owl.carousel/owl.carousel',
        'stellar':              'Magento_Theme/js/jquery.stellar.min'

    },
    shim: {
        'owl': {
            deps: ['jquery']
        },
        'stellar': {
            deps: ['jquery']
        }
   }
};

Reading material:

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.