Hi,

I've been trying to figure this out for a couple weeks now (in my spare time) without success. I'm beginning to wonder if what I am trying to do is even possible because everything I've tried fails miserably. I'm migrating our forum from phpBB. Because of the way phpBB is designed, our top level categories do not have any posts in them. They simply hold groups of child categories. This results in the home page having no posts previews shown for the top level categories. With the current template system, how can I get the previews to pull from the child categories (if its even possible)? Any help/advice would be very much appreciated.

Best Regards,
Dustin

Thanks for the response First, you should know that I've never worked with nodejs coding before I decided to switch our forum to NodeBB about a month ago (my experience is in PHP and Python mostly). The problem is very likely something I did incorrectly.

So the plugin I am using is called Slick. You can find it here: http://kenwheeler.github.io/slick/

I tried a few methods to add it to my fork of lavender. I got it to the state it is in now using a tip @psychobunny gave on a topic I found in this forum. I can't recall which topic. It was made clear that the method was not the "proper" way to do it, but I had couldn't get it to work using the proper method so I tried the shortcut. Anyway, here's what I did.

1. I edited the slick script as follows:

Changed this....

(function(factory) {
    'use strict';
    if (typeof define === 'function' && define.amd) {
        define(['jquery'], factory);
    } else if (typeof exports !== 'undefined') {
        module.exports = factory(require('jquery'));
    } else {
        factory(jQuery);
    }

}(function($) {
...

To this:

(function(factory) {
    
    /*if (typeof define === 'function' && define.amd) {
        define(['jquery'], factory);
    } else if (typeof exports !== 'undefined') {
        module.exports = factory(require('jquery'));
    } else {
        factory(jQuery);
    }*/
    window['Slick'] = factory(window['jQuery']);

}(function($) {
...

Next, I added the script filepath to plugin.json. Then I added this to lavendar.js:

(function () {
		$(document).ready(function () {
				if ($('.category-page').length) {

					$('.subcategories').slick({
...

Thanks in advance for your help. I do appreciate it

Cheers!

@julian Thanks for the advice. I will give it a try asap and then let you know how it goes!

Edit: Thanks for your input as well @bitspook (didn't mean to be rude )

I was able to find a resolve the issue. I changed the slider related code in lavender.js to this:

	(function () {
		function doSlick() {
				if ($('.subcategories').length && !$('.slick-initialized').length) {

					$('.subcategories').slick({
						dots: true,
						infinite: true,
						speed: 300,
						slidesToShow: 4,
						slidesToScroll: 4
					});
				}
		}
		$(document).ready(function () {
			doSlick();
		});
		$(window).on('action:ajaxify.end', function (ev, data) {
			doSlick();
		});

	}());

Thanks @psychobunny for your suggestion about the console log. That steered me in the right direction