Home › Forums › WoodMart support forum › Product Categories element

Product Categories element

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • December 28, 2018 at 11:25 am #98817

    [email protected]
    Participant

    Is it possible to show product categories element(masionery with first wide) to show on mobile exactly like PC? I tried but it appears one after another.

    Attachments:
    You must be logged in to view attached files.
    December 28, 2018 at 2:20 pm #98847

    Bogdan Donovan
    Keymaster

    Hi,

    Try to add the following code snippet to the Mobile Custom CSS area in Theme Settings.

    body .categories-style-masonry-first .category-grid-item:first-child {
		width: 50%;
    max-width: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
}

body .categories-style-masonry-first .col-sm-4 {
		-ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
}

    Regards

    December 28, 2018 at 3:08 pm #98856

    [email protected]
    Participant

    Thank you,the code works. But I want little modification. I want the title to be shown on the image itself rather than on outside bottom of the images and I also Want 3 images, 2 images( sarees, top) (see the attchment) to be vertical instead of horizontal with 2 images in one raw(see the attachment). Can you help me with that?

    Attachments:
    You must be logged in to view attached files.
    December 28, 2018 at 8:17 pm #98902

    Artem Temos
    Keymaster

    Sorry, but there is not enough place for the title on smaller devices so the text can be shown below the image only.

    December 29, 2018 at 2:23 am #98943

    [email protected]
    Participant

    Ok..but can you remove the title

    December 29, 2018 at 9:15 am #98979

    Elise Noromit
    Member

    Hello,

    Add this code to the Theme settings > Custom CSS > Global CSS

    @media (max-width: 768px){
body .cat-design-default .hover-mask{
display:none;
}
}

    Best Regards

    December 29, 2018 at 11:32 am #99002

    [email protected]
    Participant

    The code is not working

    December 29, 2018 at 1:42 pm #99025

    Elise Noromit
    Member

    Hello,

    The code was provided for this block http://prntscr.com/m0zs2c Now you have removed it.

    Please make the decision which block you want to hide the title from and provide the screen. Custom CSS is not covered by our support we just help you, we cannot do the same work a few times per day. Hope for understanding.

    Best Regards

    December 29, 2018 at 1:58 pm #99028

    [email protected]
    Participant

    Yes. I wanted to remove the title of this element . But the code you provided didn’t work so I removed it temporarily as I am woking in website now. you can now check.

    December 29, 2018 at 4:40 pm #99056

    Elise Noromit
    Member

    Hello,

    Please clear your cache browser https://gyazo.com/02fe981f12192d7127ef0c79a429a743

    Best Regards

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)