search

desandro / masonry

:love_hotel: Cascading grid layout plugin
https://masonry.desandro.com
16.28k stars 2.11k forks source link

Masonry - Left to Right, Right to Left then back to Left to Right #1144

Closed cjc1867 closed 3 years ago

cjc1867 commented 3 years ago

Test case: http://codepen.io/desandro/pen/osFxj

Hi I am using a theme called Mesmerize for WordPress, the theme developer says he is using your Masonry JQuery.

On my blog page and several others that use the Masonry format, how can we just have each line ordered Left to Right only. When you want the output just to be in date order per line running in Left to Right it makes sense but not alternating between Left to Right then Right to Left....

I don't have much knowledge on JQuery so I need help in where to add the modified code or how to change it.

Thanks

Colin

desandro commented 3 years ago

Sounds like you're asking for horizontalOrder

cjc1867 commented 3 years ago

Hi Thanks for replying. I have organised by date and with 3 columns so I just want the blog items to go from left to right only for each row but it is alternating between Left to Right and then Right to Left then back again to left to right in date order. The layout is then not in correct date order reading from left to right.

Actually some rows are mixed and the date order starts from the middle instead of left.

So how can I change it as I don't know any jQuery and Theme Developer says the order is based on Masonry. That helps but not a lot.

So how can I alter it to Horizontal Order? I don't know where the JS files are stored.

Colin

desandro commented 3 years ago

You'll have to do into how Masonry is being initialized, either in a .js file or perhaps with HTML. I leave that to you!

cjc1867 commented 3 years ago

Hi I have added a file called horizontal and have enqueued it via functions.php and it doesn't work.

$('.grid').masonry({ itemSelector: '.grid-item', horizontalOrder: true }); What am I doing wrong?

Thanks

Colin

desandro commented 3 years ago

Check that data-masonry attribute is removed from .grid in HTML