Stream Cards Are Clumped

If you see stream cards not being positioned one under other or being clumped/stacked or any other visual issue with stream position you must be experiencing layout calculation issue. It’s highly possible if you’re trying to insert stream to element which is initially not visible on page or added to page dynamically. In this case there are several workarounds:

  1. Add next snippet to the very end of flow-flow/js/public.js for additional layout calculation after page load.
    jQuery(document).on('done.shuffle', function(event, shuffle) {
     jQuery(function(){setTimeout(function(){
           shuffle.update() /* additional calculation*/
     }, 500)})
    })

    Also try to play with delay timeout. 500 number which is in milliseconds.

  2. You need to attach layout calculation to some event e.g. click on tab. So here example code for example element on page clicking on which will recalculate stream positioning:
    jQuery(function(){jQuery('#some_element_on_page').on('click', function(event) {
        var grid = jQuery('.ff-stream-wrapper').data('shuffle');
          if (grid) grid.update(); /* layout calculation on the fly */
      })})
in Troubleshooting