Home Forums WoodMart support forum Product categories custom style

Product categories custom style

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #417090

    atpd23
    Participant

    Hello,

    At the top of the shop page I need to place product categories filter. I can do it by setting a custom HTML block in Theme settings > Product archive > Shop filter. The used HTML block consists of product categories element (image category-1.png).

    In the image you can also notice the actual and required look of category buttons. I could customize the look by using info boxes, but that isn’t the way to go because I would need to customize it for every shop page category section individually – I prefer to keep it global as it is now by adding a HTML block into the Shop filter but with custom style.

    Best Regards

    Attachments:
    You must be logged in to view attached files.
    #417193

    Aizaz Imtiaz Awan
    Keymaster
    Xtemos team

    Hello,

    Sorry to hear about the inconvenience, can you please share valid WP-ADMIN Login details of your Site in the below listed format on which you are facing the issue so that we can proceed further and check the issue on your Site and assist you with the possible solution in this regard accordingly.

    WP-ADMIN URL:
    WP-ADMIN USERNAME:
    WP-ADMIN PASSWORD:

    Best Regards

    #417565

    atpd23
    Participant

    Hello,

    I am sending login details. I would need to place category icon next to the category name as it is shown in the image above.

    Best Regards

    #417600

    Aizaz Imtiaz Awan
    Keymaster
    Xtemos team

    Hello,

    The required design that you mentioned has been tried off with CSS because there wasn’t a direct option for that and this is how it looks on your Site: https://ibb.co/bgK6b2B

    This was the CSS applied in this regard:

    .category-grid-item .wrapp-category {
        border: 1px solid #d3d3d3 !important;
        border-radius: 15px !important;
        padding: 1em 0 1em 0 !important;
    }
    .category-grid-item .category-image-wrapp {
        position: absolute !important;
        padding-left: 1em !important;
    }
    .category-grid-item .hover-mask {
        padding: 1em 0 0 4em !important;
    }

    Best Regards.

    #417711

    atpd23
    Participant

    Hello,

    That’s great, thank you very much.

    Would it be also possible to move the sorting panel below the category selection, like in the attached images (actual.jpg and required.jpg)?

    Best Regards

    Attachments:
    You must be logged in to view attached files.
    #417801

    Aizaz Imtiaz Awan
    Keymaster
    Xtemos team

    Hello,

    We are glad that we could be of some help 🙂

    Regarding your Sorting Panel move concern, the thing is if we try to do this with Custom CSS, it would mess up the Layout of the Shop page because then all of the Content will need to be adjusted in this regard. So, we wouldn’t recommend you to adjust that in this regard.

    Hope you can understand !

    Best Regards

Viewing 6 posts - 1 through 6 (of 6 total)