adminI’m working on these taxonomy archives, for example:
https://oddflower.co/shopify_cat/upcycled-pullovers/
You’ll see it loads like screenshot (1) and puts each product in a div that has a matching ID. These products are loaded into the wp_query results using a Shopify Javascript taxonomy.js (attached for reference).
After selecting a filter to filter out certain products in the query, a few of the products will load correctly, but then you’ll see some of the product divs at the end are empty, (the last 2 in my example screenshot (2)). The rest of the products I see all the way at the bottom of the page…
My script is at :
https://oddflower.co/wp-content/themes/oddflower-theme/assets/js/taxonomy.js
— it looks for divs by product ID and then injects the code with the image, etc. that needs to display.
Another example:
https://oddflower.co/shopify_cat/upcycled-denim/
After filtering, only one or two products gets in the div. The rest at the bottom.
We are passing the ID’s we need to load in our script using lines 1332 – 1355 in functions.php. It passes the ID’s into a variable to use in the taxonomy.js file. See screenshot (3).
To load only the new posts from the filtered query instead of trying to load all of them again, we would need to be able to pass only the new set of filtered ID’s into the script AFTER it reloads the wp_query with only the filtered results.
Successful completion of this task looks like:
1) After we filter the wp_query on these taxonomy pages, only the new (filtered) set of products should be loaded using the Shopify script, instead of loading all of them again.
2) All of those products should load into their corresponding divs by ID, the same way the do when you first load the taxonomy archive containing all of the products.
Thanks!
Posted On: July 23, 2024 15:26 UTC
Category: Ecommerce Website Development
Skills:WordPress, Shopify, JavaScript, PHP
Country: United States
click to apply
Powered by WPeMatico
