Unendliche Schriftrolle mit Mauerwerk in Woocommerce funktioniert nicht

Lesezeit: 2 Minuten

Benutzer-Avatar
Lisa

Ich stehe vor einem unangenehmen Problem bei der Integration des Infinite-Scroll-Plugins in WordPress mit dem Theme, das Mauerwerk verwendet.

Ich habe die neueste Version von Infinite Scroll, 2.6.2, und ich habe diesen Code im Callback-Bereich des Plugins hinzugefügt:

// hide new items while they are loading
var $newElems = jQuery(newElements).css({ opacity: 0 });
// ensure that images load before adding to masonry layout
$newElems.imagesLoaded(function(){
// show elems now they're ready
$newElems.animate({ opacity: 1 });
    $container.masonry( 'appended', $newElems, true );
});

aber es funktioniert nicht, es fügt den neuen Elementen die Deckkraft hinzu, aber es fügt nicht die Positionen usw. hinzu, also funktioniert es nicht ganz; Die neuen Artikel werden oben auf der Seite über den alten Produkten angezeigt.

Skript sieht so aus:

/* <![CDATA[ /
var infinite_scroll = "{\"loading\":{\"msgText\":\"Loading...<\\/em>\",\"finishedMsg\":\"No additional products.<\\/em>\",\"img\":\"http:\\/\\/www.test.com\\\/wp-content\\\/plugins\\\/infinite-scroll\\\/img\\\/ajax-loader.gif\"},\"nextSelector\":\".next\",\"navSelector\":\".woo-pagination\",\"itemSelector\":\"li.product\",\"contentSelector\":\"ul.products\",\"debug\":false,\"behavior\":\"\",\"callback\":\"\\\/\\\/ hide new items while they are loading\r\nvar $newElems = jQuery(newElements).css({ opacity: 0 });\r\n\\/\\/ ensure that images load before adding to masonry layout\r\n$newElems.imagesLoaded(function(){\r\n\\/\\/ show elems now they're ready\r\n$newElems.animate({ opacity: 1 });\r\n$container.masonry( 'appended', $newElems, true );\r\n});\"}";
/ ]]> */

So sieht das Mauerwerk aus:

// Only fire masonry if the window is an appropriate size and images are loaded
jQuery(function(){
    var $container = jQuery('ul.products');
    $container.imagesLoaded( function(){
        if (jQuery(window).width() > 767) {
            $container.masonry({
                itemSelector : 'li.product',
                columnWidth : 295,
                isFitWidth: true,
                gutterWidth : 2
            });
        }
    });
});

Das Plugin von Infinite Scroll für WordPress: Hier ist der Link hat eine Option namens behavior wo man wählen kann Mauerwerkund natürlich müssen Sie die Selektoren richtig auswählen und danach wird es wie ein Zauber funktionieren, um mehr Entwickleroptionen zu sehen, auf die Sie zugreifen können die Entwickler-Website

1345350cookie-checkUnendliche Schriftrolle mit Mauerwerk in Woocommerce funktioniert nicht

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy