Lay Theme Forum

Hej,
After troubleshooting on my own at amateur level; disabling/enabling plugins and custom code. I’m posting here to hopefully find a fix. After updating to the latest versions of Laytheme and WordPress, my product variation pages seem to have broken along the way. These were working great before.

Issues:
When selecting a variation from the dropdown, the dropdown text does not update.
When selecting a variation, the product image does not update.

Notes:
The price does update correctly when a variation is selected.
When adding a variation to the cart, the correct variation and corresponding image is shown in the cart.
So it seems like the variation itself is being selected properly, but the display (text + image) is not updating.

Link:
https://www.mayaleroy.com/product/2024128/

Any help or suggestions would be greatly appreciated!

I’d like to second this request! Having the ability to target an Expand/Collapse row via URL, while respecting the 'Collapse other Rows' setting, would be useful. This functionality would be perfect for targeted menu items or sharing specific content through links in newsletters or with clients.

Stay awesome! 🏄‍♂️

This approach offers a simple solution for implementing filters, though it's not perfect and only allows one filter to be active at a time. The fewer filters you use, the easier it will be to set up.

• Create multiple rows, each containing a 'WooCommerce Thumbnail Grid' with a specific Category or Tags applied.
• Collapse all rows except for one that you want to be visible by default.
• Add a separate row at the top with text buttons to serve as filters. Set these buttons to expand/collapse the corresponding rows (ensure that 'Collapse other Rows' is enabled).

temporarily fix for
Customize -.> WooCommerce -> single product -> "Two Images per Row"

.swiper-wrapper {
    display: block !important;
}

Would love to see an update on this.

When single product page is set to "Two Images per Row", only two images are shown no matter how many images assigned to the product. Would be great to see multiple rows appearing, when product has greater than two images, like the setting suggests.

Or like Aleks is proposing; combine "two images per row" with "carousel", to show multiple product images.

Thanks!

@Richard-Keith bump. 🏄‍♂️

Dear @Richard-Keith

Have you had time to look into this code:
Thank you!

@nncrns said in Project captions as cursor inside Carousel:

Just had an idea and managed to solve it! In case anybody is looking for the same thing, this is the solution: I didn't try anymore to work with the existing captions, but rather use them as data input and display the text in a new div following my cursor. I matched the carousel slides with the captions by attaching a numbered data attribute to both of them – this works because the order of the slide elements and caption elements correspond (doesn't make a difference if the carousel has a random order or not).

jQuery

Before window.laytheme.on

//Caption moves with cursor

jQuery(document).bind('mousemove', function(e){
    jQuery(".moving-caption").offset({left: e.pageX, top: e.pageY});
});

window.laytheme.on("newpageshown", function(layoutObj, type, obj){

//Attach numbered data attribute to all slides and captions

    jQuery(".lay-carousel-slide").each(function(i) {
        jQuery(this).attr("data-project","project" + (i+1));
    });

     jQuery(".single-caption").each(function(i) {
        jQuery(this).attr("data-project","project" + (i+1));
    });

//Create element for moving caption

     jQuery("body").prepend("<p class='moving-caption _Default'></p>");

//Insert the caption text that matches the hovered element

    jQuery(".lay-carousel-slide").hover(function(){
        var projectNumber = jQuery(this).data("project");
        var currentCaption = jQuery(".single-caption[data-project='"+projectNumber+"']").text();
        jQuery(".moving-caption").text(currentCaption);
    });
}

The CSS:

.moving-caption {
    display: block;
    position: absolute;
    z-index: 10000;
}

Dear @nncrns

This sounds so cool for the Carousel plugin!
Only problem is that I can't get it to work when implementing the code on my own page. I copied- pasted the exact code to to my "costum CSS & HTML". And made sure my carousel images had captions.

Can it be that the code doesn't work anymore? that I missed something, or that I have to make some slight changes? (also, I have never seen it working live since the /dev link is offline)

Thank you!

Hi Armin,

Is there any possibility for an horizontal scrollable area.
It doesn't seem like overflow-x works within lay.

I really need it, any help is appreciated.
Thank you.

Hi Marcus,

I managed to work around the problem. Only now I stumbled upon another problem; since I can't get into my old domain wordpress dashboard anymore, I can't deactivate that key anymore. Could you help me with that.

And one other question; Can the subdomain use the same licence key as the main domain?
Thanks!

Hi Marius,

I did already some trouble shooting myself and tried indeed already disabling all plugins and themes.

The table prefix is also not the problem, the moving of the website did work. The website looks the same on both domains. Only problem I can not login to my dashboard on the new domain.

I moved my Laytheme website from one domain to another. using the "Moving a Lay Theme website" documentation. Thank you for that!

Everything went fine and it looks like everything moved accordingly. However it became impossible for me to log into the new domain .../wp-admin. I get the message "Sorry, you are not allowed to access this page."

I tried disabling plugins and themes through ftp but without result. returning the same error.
I had updated wordpress, all plugins and Laytheme before moving everything.

Any other suggestions I can explore?
Thanks

Hi he hello

I want to make a Div from the custom css/html sections to be shown when hovering over a div inside a page.
I made a little jsfiddle to explain/show what i mean and want.

When implementing the code inside laytheme, It only works half.
#a:hover {... works fine
#a:hover + #b {... doesn't work

I tried to explain as clearly as possible, if not please say so.
Thanks!