Discussion on Media Boxes Portfolio - Responsive jQuery Grid Plugin

yes you can, the WP is coming very soon

Would you be able to give a timeline as to when the WP version will be released, as I need to set this up soon?

Thanks again.

Hi,
I don’t have a date, but the plugin is ready, I’m just working on the final details, demos and docs.
Probably few weeks

Best, David

Hi,
I think you are using a different plugin, this is the media boxes plugin

Best, David

Hi David! I just noticed that haha, sorry! Im using your plugin in combination with another one

don’t worry

Hi,
if you have the filter navigation bar, you could just trigger a specific option, for example:

$('[data-filter=".indoors"]').trigger('click');

Best, David

Hi,
I don’t have a JSON example but the plugin is pure HTML/CSS/JS, so if you have a Javascript Ajax script that does this, then you can build the HTML with JS and initialize the plugin (this is what many customer have done)

Here’s an example of adding boxes with JS that came via AJAX: http://www.castlecodeweb.com/mediaboxes/example/add_boxes.html

you can check the source code

I hope it makes sense

alright, you can do it with this peace of JS:

$('[data-filter=".Indoors"]').trigger('click');

Thank you David, now it is working just as we imagined! Amazing plugin by the way

that’s awesome happy to hear that!

Hi,
this is the HTML version, the WP version is not up yet

Best, David

Hi David,

I tried to make html like a dark grid sample. First load all good the image and box content have a same heigh, gaps proporsional, but when I smaller the browser the grid box have a different gaps and the grid box not auto adjustment. May I know what specific images heigh and width. My html result for first load browser like this : https://ibb.co/hdKZVK

Hi there,
that’s probably because the layout is made for 4 columns, so when you reduce the browser width the number of columns changes, maybe you can change that it goes from 4 to 2 columns, you can configure this by using the “resolutions” JS option.

I hope it makes sense,
Best, David

Hi there,
I’m not familiar with Weebly, this is a pure HTML/JS plugin, so if your site support HTML then this should work

Best, David

Hi,
by default the plugin adapts to the 100% of its container, so it perfectly fits any width, if you want static columns (for example columns that have 150px of width) you won’t get the same result but it is possible, to do this just pass the following JS option:

columnWidth : 150,

you can read more about this option in the docs here: http://www.castlecodeweb.com/mediaboxes/documentation/#options

Best, David

And, are a posibility to set multiple sizes (like 50px, 100px, 150px) in the parameter of columnWidth?

Greetings.

Hi,
currently no, all columns are the same width

Best, David

that’s probably the “resolutions” option, you can check it out in the docs, but if you don’t want that option you can pass this option:

resolutions : [],

Ah thanks, I was able to work around it. One last thing. The media boxes images won’t load unless i scroll, or touch and scroll the media boxes. This issue is only on mobile. Is there a way to automatically load up the images without having to touch them? Use that same link i provided on your mobile device and you will see what i mean.

that’s weird, maybe the plugin is loading faster than the theme, try wrapping the JS initialization of the plugin in a timeout like this:

setTimeout(function(){

// JS initialization

}, 300);

Best, David

Hi,
Currently that layout is not possible with this plugin :/

Best, David