0

I have a block that displays pictures from instagram, he gets them using the library.

https://www.mageplaza.com/magento-2-instagram-feed

I have 6 elements in a row, I want to use them in a carousel

    <div class="mpinstagramfeed-container">
        <div id="mpinstagramfeed-photos-<?= /** @noEscape */ $widgetId ?>" class="owl-carousel lhb-instagram-module-container row shuffle"></div>
    </div>

below is the code that is responsible for initializing the instagram module and carousel

    <script type="text/x-magento-init">
    {
        "#mpinstagramfeed-photos-<?= /** @noEscape */ $widgetId ?>": {
            "mageplaza/instagram": {
                "id": "<?= /** @noEscape */ $widgetId ?>",
                "token": "<?= /** @noEscape */ $block->getAccessToken() ?>",
                "count": "<?= /** @noEscape */ $total ?>",
                "sort": "<?= /** @noEscape */ $options['sort_by'] ?>",
                "image_resolution": "<?= /** @noEscape */ $image ?>",
                "layout": "<?= /** @noEscape */ $options['layout'] ?>",
                "show_like_comment": "<?= /** @noEscape */ $options['show_like_comment'] ?>",
                "show_popup": "<?= /** @noEscape */ $options['show_popup'] ?>"
            }
        }
    }
    </script>
        require([
            'jquery',
            'owlcarousel'
        ], function () {
            'use strict';
            $.noConflict();
            $(".owl-carousel").owlCarousel({
                items: 4,
                nav : false,
                pagination : false,
                dots: false,
                responsiveClass: true,
                responsive: {
                    0: {
                        items: 2,
                    }
                }
            });
        });

instagram data arrives with a delay and the carousel is initialized before it arrives.

tell me please how to make the elements are in the carousel?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.