tobiasmalikowski

But the cache_id is already set on the alm_element. So you suggest to do the following?

If filter is set to active:

1. Set cache to false
2. Remove cache_id

If filter gets resetted (no active filter):

1. Set cache to true
2. Set cache_id

Do you have any experience with that build in lazyLoad (preload) option?
I’ve tried to add that option to your JavaScript code, but can’t see any difference.

If I look at the network tab of Chromes Dev Tools the same amount of image requests are made. Do I have to do anything additional or how can I check for that lazyLoad?

I assume that lazyLoad only lazy loads the big images not the thumbnails.

Edit:
Ok I’ve checked and _preloadImage function is called. I also see a little loading icon if I open an gallery image and swipe to the next one. But how does this improve my performance if the big images are still requested on initial page load?

Hey Darren, just wanted to know when we can assume a fix for this.

Hey bigkahunaburger, I just solved this issue. Maybe this solution also works for you.

Just scroll down and look at my last post. Let me know if that helps you ??

Hey Darren,

I’m glad to say that I found the issue for the page jump after a lot of searching and debugging. Again the answer is very simple.

In ALM Settings there is an option in the Globals Section called “Top of Page: On initial page load move the user’s window to the top of the screen.”

I never thought that this could cause the issue, because it says on the initial page load, but in fact that function gets triggered also if ALM gets resetted.

Maybe you should describe that option a bit more, or change its behaviour.

Another question, I’ve wrote a whole Class which handles the ALM Filtering and I’m willing to share it with other people. What would be the best way to share it with your community? Posting the whole lot code here won’t be that great.

Cheers Tobias

Wow what can I say the solution is like always too simple to be true.

You have to pass the name of the “parent” taxonomy to previous_post_taxonomy, not the value.

Example Structure:

taxonomy = category
categories = Music, Movies, Books

Solution:

previous_post_taxonomy = “category”

What I did:

previous_post_taxonomy = “Music”

Thanks for the info darren, now I know that my second question is impossible to solve.

Back to question one, I’ve tested previous_post_taxonomy with the Name instead of the Slug and it works, but only once. Is that the way it is supposed to?

I thought it will work like this if previous_post_taxonomy is set:

Click load previous post -> previous post from same taxonomy is loaded
Click load previous post -> previous post from same taxonomy is loaded
…

But it is only working once. Any idea on this?

Buttons with the type=”button” have no default behaviour, so preventDefault() won’t do anything on them.

Source

But to be sure, I tested preventDefault on my click event, no change at all, still page jump.

Why are you using the taxonomy name here? In your nomral queries etc. you are using the slug. So I’ve tested with slug.

I’ll repeat my tests with the taxonomy name. However I think you should use the slug, cause slug gets cleaned by WordPress (special characters etc.).

Another question before I continue testing. Is it possible to pass multiple taxonomies? I’m asking this cause I’ve build a ALM Filter Class, which lets me filter by multiple taxonomies. This filter system is used in the overview page, while Previous Post Addon is used in the single view.

So if a user filters the posts and then decides to read a post (single view) the Previous Post Addon makes no sense, since my filters get lost. So I’m searching for a way to use that filter parameters with the Previous Post Addon.

Ok that’s interesting, I’ll look at this one. Could you see anything strange while looking at my code? Any Idea what is causing that jump? I’m not the only one who faces this behaviour.

Hey bigkahunaburger, I’m facing the same issue with page scrolling to top after filtering here.

Do you have something new related to that issue?

Here are the shortcode properties I’m using:

'posts_per_page' => 20,
'post_type' => 'customer',
'scroll' => 'false',
'css_classes' => 'row grid-20-columns',
'theme_repeater' => 'loop-customer-archive.php',
'button_label' => __('Load more References', 'text-domain'),
'button_loading_label' => __('Loading more References', 'text-domain'),

The HTML I use to trigger the filter:

<div class="alm-filter-nav small-15 columns" data-type="customer_category">
    <button class="alm-filter" type="button" data-taxonomy="customer_category" data-taxonomy-terms="europa" data-taxonomy-operator="IN">Europa</button>
</div>

How I use the almFilter method:

var data = {taxonomy: "customer_category", taxonomyTerms: "europa", taxonomyOperator: "IN", cache: "false"};
$.fn.almFilter('slide', '500', data);

Attributes of the alm-listing container before using almFilter:

class="alm-listing   alm-ajax row grid-20-columns"
data-repeater="default"
data-theme-repeater="loop-customer-archive.php"
data-post-type="customer"
data-post-format=""
data-category=""
data-category-not-in=""
data-tag=""
data-tag-not-in=""
data-taxonomy=""
data-taxonomy-terms=""
data-taxonomy-operator=""
data-taxonomy-relation=""
data-meta-key=""
data-meta-value=""
data-meta-compare=""
data-meta-relation=""
data-meta-type=""
data-year=""
data-month=""
data-day=""
data-author=""
data-post-in=""
data-post-not-in=""
data-exclude=""
data-search=""
data-custom-args=""
data-post-status=""
data-order="DESC"
data-orderby="date"
data-offset="0"
data-posts-per-page="20"
data-lang="de"
data-scroll="false"
data-scroll-distance="150"
data-max-pages="5"
data-pause-override="false"
data-pause="false"
data-button-label="Weitere Referenzen"
data-button-loading-label="Referenzen werden geladen"
data-button-class=""
data-destroy-after=""
data-transition="slide"
data-images-loaded="false"

Attributes of the alm-listing container after using almFilter:

class="alm-listing alm-ajax   row grid-20-columns"
data-repeater="default"
data-theme-repeater="loop-customer-archive.php"
data-post-type="customer"
data-post-format=""
data-category=""
data-category-not-in=""
data-tag=""
data-tag-not-in=""
data-taxonomy="customer_category"
data-taxonomy-terms="europa"
data-taxonomy-operator="IN"
data-taxonomy-relation=""
data-meta-key=""
data-meta-value=""
data-meta-compare=""
data-meta-relation=""
data-meta-type=""
data-year=""
data-month=""
data-day=""
data-author=""
data-post-in=""
data-post-not-in=""
data-exclude=""
data-search=""
data-custom-args=""
data-post-status=""
data-order="DESC"
data-orderby="date"
data-offset="0"
data-posts-per-page="20"
data-lang="de"
data-scroll="false"
data-scroll-distance="150"
data-max-pages="5"
data-pause-override="false"
data-pause="false"
data-button-label="Weitere Referenzen"
data-button-loading-label="Referenzen werden geladen"
data-button-class=""
data-destroy-after=""
data-transition="slide"
data-images-loaded="false"
data-cache="false"
data-events="scroll"

I also noticed that the following property gets added to the ALM element after filtering:

data-events="scroll"

I don’t know where this comes from but maybe it is causing the page jump?

Do you have any Idea what is causing the page to jump?
I think this is all that I can give to you to help finding this bug.

Tobias

Nope, I’m using the HTML Button element which should be used, since the filter is no link and needs JavaScript.

<button type="button" class="button" data-taxonomy="customer_category" data-taxonomy-operator="IN" data-taxonomy-terms="europa">Europa</button>

Hey Darren,

unfortunately I can’t tell you how to reproduce this. I’ve looked at the example and compared it with my code and its pretty much the same. Is there anything I can do to help you to debug this? I want to get rid of this jump as well ??

Hi Darren,

I’ve build a whole class to do that filtering stuff now and I’ll post is after its complete to help other people.

But I still need your help for one issue. If I reset ALM the page jumps up to the top. I reset ALM with the following piece of code:

$.fn.almFilter(self.transition, self.speed, preparedFilter);

self.transition is a string (“Slide”)
self.speed is a string (“500”)
preparedFilter is an object ({taxonomy: “reference_category”, taxonomyTerms: “europa”, taxonomyOperator: “IN”})