Nested carousel not showing prev/next buttons

Greetings Xtemos team! I hope everyone is doing well.

Please see the link in the private content. This is an unpublished page currently in “draft” mode.
This page has a nested carousel (row #12)
“Hide prev/next” buttons is set to NO
But there are no prev/next buttons on the front end.

Our web developer wrote to me:
“This is something wrong with the CSS that the template generates – it doesn’t match the settings.”

He made a temporary fix using a Raw HTML block that you can see in the last row. It is currently disabled so that you can see the issue, but you can enable it to see that the arrows get added.
Please just be sure to save as a draft and not publish the page.

I would appreciate your assistance with this matter, especially if it is a site-wide issue that doesn’t just affect this specific page.

Thanks!
Tom

Hi wildguitars,

Thanks for reaching to us and appreciate your patience.

Please add the below Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS:

div.wd-nav-arrows.wd-pos-sep .wd-next {
    inset-inline-start: auto;
    left: 0;
}

div.wd-nav-arrows.wd-pos-sep .wd-prev {
    inset-inline-end: auto;
    right: auto;
}

Regards,
Hung PD

Hi Hung,

Thank you for the prompt reply and for providing this custom code. Before I add it, I noticed that the header and footer have disappeared. I see that you saved the page a few times during your tests – do you know why the header and footer are gone?

Best regards,
Tom

Hi wildguitars,

The header and footer are still there, please double check https://ibb.co/V0v5NJdn https://ibb.co/DdCZpkP

Regards,
Hung PD

Hi Hung, I apologize for taking a few days to get back to you.

1. Please see this video showing that I am seeing the page without the header and footer: https://we.tl/t-1D3j5bXbvl

2. I’m curious, why was it necessary to add custom CSS to get the arrows to appear? After all, this is a built-in feature. Just trying to avoid adding custom code (which can break at some point as a result of an update) wherever and whenever possible.

Best regards,
Tom

Hi wildguitars,

Thanks for your patience.

You should deactivate all plugins (except WoodMart Core, Elementor and WooCommerce Plugins) and then reactivate them one by one. This makes it very easy to isolate the plugin causing problems.

Regards,
Hung PD

Hi Hung,

Thanks again for your prompt reply.
I copied the page’s code to a notepad, deleted the page, created a new page and pasted the code – the issue has been resolved. So I don’t think it was a plugin issue.

Regarding my question:
I’m curious, why was it necessary to add custom CSS to get the arrows to appear? After all, this is a built-in feature. Just trying to avoid adding custom code (which can break at some point as a result of an update) wherever and whenever possible.

Best regards,
Tom

[Author]

Posts