inserting into a loop

[Marty Walker]

Hi all,

One of the sites I look after has a home page that displays some random artist artworks (exhibit a: http://www.illustratorsaustralia.com/). In the middle of all the thumbnails there's a large message box which is inserted there using jQuery. They want to change this layout to one that uses something like jquery masonry to flow the random thumbnails around an even larger message box. I have the code for the random images and the message box all worked out.

My question is: is there a way to insert (for want of a better word) that message code into the random thumbnails loop after a certain amount of thumbnails before masonry gets hold of it all and rearranges everything?

eg:

• thumbnail
• thumbnail
• thumbnail
• message
• thumbnail
• thumbnail
• thumbnail

Thanks for any help/suggestions.

[tpr]

The easiest thing could be saving the page to be inserted into a variable before the loop, and using a counter inside the loop to output the page if the counter reaches the number you need.

Otherwise you could use the "slice" and "and" methods of PageArray to construct your custom array of pages before the loop.

[Marty Walker]

@tpr Thanks! Of course. I was overthinking it.

[LostKobrakai]

If you're using the masonry package you should also take a look at the stamp option, which doesn't depend on the item order. At best your message should be the first item, if something on the javascript side fails, that it's still at the top and not buried beneath lots of thumbnails.

[diogo]

If you're already inserting the message with jQuery, maybe it's easier to solve it also with jQuery. Just make sure masonry is called after you insert the element. By after I mean Javascript's after, not just after in the code, see my example http://codepen.io/diogo-ed/pen/LVwRyB