product categories widget

Hi,
I styled the title with CSS (screenshot attached). Please let me know if I can set these same settings somewhere in Theme settings (instead of using css). Also let me know if I can somehow center the title and divide the arrows, as per rendering attached.

Thank you

Attachments:

You must be logged in to view attached files.

rendering attached

Attachments:

You must be logged in to view attached files.

is there a way to style the arrows as per rendering? (white background and red border). i tried with css using .wd-arrow-inner but it’s now working. maybe there is another widget I can use to display categories as a slider, with more options for icons styling?
thank you

Hello,

Sorry to hear about the inconvenience. Kindly, please share your Site WP-ADMIN Login details in the Private Content field so that we can check this concern on your Site and help you out accordingly.

Best Regards

here you are
thank you

Hello,

Unfortunately, the Posts widget does not include an option to configure the carousel layout and arrow positioning as shown in your mockup.

Instead, I recommend using the WoodMart Blog widget and selecting one of the carousel designs. This will give you more control over the carousel settings, including positioning the navigation arrows together.

Regarding the arrow styling, you can change the global carousel design here:

Theme Settings > Styles & Colors > Carousel

There you can choose a different arrow style that better matches your design.

See Screenshots for better understanding:
https://postimg.cc/wtVrhrGK
https://postimg.cc/jw3k17Tf

Best Regards

Hi,
there are not posts, they are product categories (screenshot attached).
I managed to style arrows as per your suggestion above, but I set border 1px red, and there is no border in the icons.
Also, the icons show only on hover. How can I make them always visible?
Thank you

Attachments:

You must be logged in to view attached files.

Hello,

If you want arrows to be always visible in the carousel, add this code in Theme Settings > Custom CSS:

:is(.wd-carousel-container, .wd-products-element) .wd-nav-arrows[class*=wd-hover].wd-pos-sep .wd-btn-arrow {
        opacity: 1 !important;
        transform: translateY(0) !important;
        pointer-events: unset !important;
    }

    .wd-nav-arrows.wd-hover-1.wd-pos-sep .wd-prev,
    .wd-nav-arrows.wd-hover-1.wd-pos-sep .wd-next {
        transform: none !important;
    }

Regarding the border not applying. Please deactivate all the 3rd party plugins and activate only theme-required plugins on the site and then check the issue. I am sure your issue will be solved. Then, activate the 3rd party plugins one by one and check which plugin is creating the issue for you.

Otherwise, if the issue still exists, then keep the 3rd party plugins deactivated and let me know so I will check and give you a possible solution.

Best Regards

Hi,
did you already applied the code? Because now they’re always visible. I cannot find the suggested CSS anywhere though.
I soved the border issue.

thanks

Hello,

No, we did not apply that CSS from our side.

Best Regards

ok

Hello,

Thanks for the update!

If you face anything else or need further assistance, feel free to reach out anytime.

Best Regards

[Author]

Posts