Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #1493688
    ThorstenFB
    Guest

    Hi,

    to open portfolio links in a new tab, I followed the instructions here: https://kriesi.at/support/topic/portfolio-custom-link-target_blank/#post-715795

    This works quite well so far. But portfolio entries that are loaded afterward (via the “load more” button) are still opened in the same tab.

    I would therefore appreciate your help.
    Thanks a lot!

    Thorsten

    #1493707

    Hey ThorstenFB,

    Thank you for the inquiry.

    Try to add this code to the functions.php file to re-apply the target attribute to the loaded portfolio items.

    add_action('wp_footer', function () {
        ?>
        <script>
            jQuery(function ($) {
    
                function applyMasonryTargetBlank() {
                    setTimeout(function () {
                        $('.av-masonry-entry a').attr('target', '_blank');
                    }, 500);
                }
    
                applyMasonryTargetBlank();
    
                $(window).on('debouncedresize', function () {
                    applyMasonryTargetBlank();
                });
    
            });
        </script>
        <?php
    }, 9999);
    

    Best regards,
    Ismael

    #1493711

    Hi Ismael,

    thanks for your help. Unfortunately this isn’t working on my site (see private content).
    Do you have an idea to resolve?

    Thanks a lot
    Thorsten

    #1493756

    Hi,

    Thank you for the update.

    It seems to be working when we tested it on our end. Please try to increase the timeout from 500 ms to 1000 ms or longer. If you can provide the login details in the private field, we’ll check the script further.

    Best regards,
    Ismael

    #1493766

    HI Ismael,

    thanks again for your help!
    I changed the timeout but the problem still exists.
    You see the login details in the private content.

    Best regards,
    Thorsten

    #1493770
    This reply has been marked as private.
    #1493948

    Hi,

    Thank you for the link.

    We adjusted the script a bit, added change detection to the .av-masonry-container, then apply the target attribute to its child elements or entries. It should work correctly now.

    add_action('wp_footer', function () {
        ?>
        <script>
        jQuery(function ($) {
            function applyTargetBlank(container) {
                container.find('a').each(function () {
                    if (!$(this).attr('target') || $(this).attr('target') !== '_blank') {
                        $(this).attr('target', '_blank');
                    }
                });
            }
    
            var masonryContainer = $('.av-masonry-container');
    
            applyTargetBlank(masonryContainer);
    
            var observer = new MutationObserver(function (mutationsList) {
                mutationsList.forEach(function (mutation) {
                    if (mutation.addedNodes.length) {
                        $(mutation.addedNodes).each(function () {
                            if ($(this).hasClass('av-masonry-entry') || $(this).find('.av-masonry-entry').length) {
                                applyTargetBlank($(this));
                            }
                        });
                    }
                });
            });
    
            if (masonryContainer.length) {
                observer.observe(masonryContainer[0], {
                    childList: true,
                    subtree: true
                });
            }
    
            $(window).on('debouncedresize', function () {
                setTimeout(function () {
                    applyTargetBlank(masonryContainer);
                }, 2000);
            });
    
            $(document).on('click', '.av-masonry-load-more', function () {
                setTimeout(function () {
                    applyTargetBlank(masonryContainer);
                }, 2000);
            });
    
        });
        </script>
        <?php
    }, 9999);
    

    Best regards,
    Ismael

    #1493968

    Thanks a lot, Ismael.
    Works perfect now!

    All the best
    Thorsten

    #1494002

    Hi,

    Great! Glad to know that this has been resolved. Please don’t hesitate to open another thread if you have more questions.

    Have a nice day.

    Best regards,
    Ismael

Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Open custom portfolio link only works partially with "load more" function.’ is closed to new replies.