Lay Theme Forum

hey, I did something like this for a client using the expand/collapse row feature. You basically setup your rows like this:

first row: toggle text button (you could call this 'index')
second row: thumbnail grid
third row: project index

Right click the project index row (make sure the project index isn't dragged all the way to edge as you can't right click) and choose 'collapse row' (you can now move the index all the way to grid edge) and then open the text box on the first row and highlight 'images' and choose the button in the top centre with the up and down arrows 'expand/collapse row' link. This opens a dialog box, in there you could change the replacement text to something like 'images' and then click 'row 2' and 'row 3' so they are selected and then save.

I found in my scenario that turning off the 'collapse other rows' and 'scroll to expanded row' to work best and importantly making the gutter 0% between rows 2 and 3 so when you toggle between them they appear at the same height if that makes sense!

Hope that helps!

@arminunruh thanks!

hey i'm good thanks! and you?

Here is the setup I'm working on: https://alasdairdimmick.com/work/ - its a work in progress still. I really like it but I think this will be difficult to translate it to mobile unless I can insert images into accordion but I could also just not use the accordion for mobile!

Having the hover add on work for accordion would be cool as I could just make and edit them within the accordion text editor rather than in a text box outside it.

Hope that makes sense!

hey @arminunruh

I wonder if you were thinking of introducing images into the accordion?

I'm experimenting with using the accordion to show a list of projects, clicking the accordion title shows the project description and then on hover on the accordion title an image shows fixed and centre.

I see when you set a link to the accordion title there is no option for image hover here but I found a workaround if you setup a regular link with imagehover and paste that link into accordion title the imagehover works which is cool although is there anything I should be wary of using this workaround?

Then I was thinking could this work for mobile but the imagehover and accordion on mobile scroll weren't working too smoothly so I tried pasting an image url into the accordion text editor instead of using imagehover and that does work but the sizing is a bit all over the place and obviously not responsive.

Anyway, thought it was worth sharing as the accordion is great but being to have some images in there could be a great addition.

hey @arminunruh i just tried it on my girlfriend's phone which is also an iphone 12, ios 18.6.2 and it works perfectly fine - so i think it's probably just my phone!

@arminunruh sounds good, thanks!

@arminunruh i live in glasgow, scotland but have visited berlin a few times, very fun city!

yeah we could give that a go but there is no huge rush as i'm working on other projects at the moment :)

would be cool if we could add a background colour to the whole stack not just to the elements inside the stack, so perhaps if there was a background colour option here:

:)

@arminunruh 18.6.2

ah, I think I know why. I use 'single tab' in iphone settings > app > safari (scroll to bottom) and you have 'tab bar' and 'single tab'.

I've just tried it in 'tab bar' and works smooth like in your recording.

So possibly to do when safari is set to 'single tab', interesting...

thanks @arminunruh really appreciate you looking into it. The recording you made looks really smooth! it must be my phone, i'll see if I can upgrade the ios!

hey @arminunruh thanks for the update.

sorry lightbox is working now, amazingly I simply just didn't have the 'activate for phone version' box ticked, for whatever reason I forgot that setting existed!

The crashing issue is still very much the same on ios safari although ios chrome works a lot better.

Sure here is a link: https://alasdairdimmick.com/lagoon/

hey, I think you need to activate the new woocommerce email template to see product images in emails. If you go to:

woocommerce > settings > emails > scroll to the bottom I think it's in there

or

woocommerce > settings > advanced > features > email improvements and tick the box.

You need at least woocommerce version 9.8, you can read more about it here: https://developer.woocommerce.com/2025/04/09/woocommerce-9-8-modernized-designs-and-email-previews/#h-modernized-email-templates-and-previews

Hope that's useful!

@arminunruh said in Project index – categories separator:

it seems that i can pretty easily add a tag box to a media library item edit page.
would tag filtering be enough or would you also need categories, like we have for thumbnailgrid?

hey Armin, wonder if this is something you are still considering? I'd love to use this feature for a website, obviously understand you have many other things to do and I'm always appreciative of how well you respond to feedback and suggestions. It would be great if it is something on your list of potential features for the future. I think it would be used by lots of people as sometimes I think it's nice and useful to be able to filter the images within a project especially if there is lots of images and you are looking for something specific.

I wonder if too you could search for images via the media 'tags' or 'categories' in the search bar feature on the navigation bar and it displays the images in the results which could then be opened into a lightbox, ha perhaps I'm asking too much!

@arminunruh hey, I had this issue months ago where the thumbnail grid was empty on the gridder but showed fine on live site: http://laythemeforum.com:4567/topic/10379/gridder-bug-and-empty-thumbnail-grid/

and the latest update has fixed it now, thanks!

@shchepinov yeah I know, was just a little tip.

try this:

.tag-bubble:hover {
color: #fff;
}

@shchepinov ah okay usually you need a ; there, do you have a link to your site?

hey, do you have a link for a closer look?

you need to put a ";" after "fff", maybe why it's not working.

@fernandol97 just realised it wasn't working was because you were missing a closing bracket }

that's why it was showing up as red, you needed a closing } after "hidden;"

@fernandol97 nice one!

@fernandol97

body.slug-photographs .type-elementgrid .img img {
border-radius: 0;
}

try pasting this in, strange why its not working hmm