Home › Forums › WoodMart support forum › How To Increase Size of Brand Swatches on Shop Sidebar?

How To Increase Size of Brand Swatches on Shop Sidebar?

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • February 13, 2020 at 9:26 pm #173304

    ehangartner
    Participant

    I really love how big the brands swatches are on this sidebar: https://woodmart.xtemos.com/shop/

    How am I able to make mine the same? I tried making the size “extra large” but it doesn’t seem to be working. I also would like to get rid of the circular containers that mine are in. Thank you!

    February 14, 2020 at 10:23 am #173409

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    Unfortunately, there is no option in Theme Settings available to increase the size of brand images in the sidebar on the shop page.

    You need to add the following Custom CSS in the Global CSS Area under Theme Settings >> Custom CSS.

    .woodmart-woocommerce-layered-nav .swatches-normal.swatches-brands .filter-swatch > span {
width: 80px !important;
height: 60px !important;
}

    And for the circular containers please provide with admin panel login details of the website to check it myself and help you out accordingly.

    Best Regards.

    February 18, 2020 at 8:35 pm #174402

    ehangartner
    Participant

    Hey Aizaz, that CSS snippet didn’t seem to work. I’ve provided the credentials for you to login as Admin here below.

    February 19, 2020 at 6:55 am #174460

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    I have fixed the issue on your website and now its working absolutely fine on my end. Please disable server cache, deactivate cache plugin, clear browser cache and check back.

    Screenshot for Clarification: https://ibb.co/TT0vcvY

    I have added the following custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

    .woodmart-woocommerce-layered-nav .swatches-large .filter-swatch > span {
width: 80px !important;
height: 70px !important;
}

    Best Regards.

    February 19, 2020 at 3:42 pm #174646

    ehangartner
    Participant

    Thank you Aizaz! Could you also get rid of the circular containers for me?

    February 20, 2020 at 7:12 am #174695

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    I have removed the circular containers from the brand filters. Please clear the cache and check back.

    Video for Clarification: https://gofile.io/?c=Jmxe1u

    I have Replaced the previous custom CSS with the following:

    .woodmart-woocommerce-layered-nav .swatches-large .filter-swatch > span {
width: 64px !important;
height: 64px !important;
border:none;
}
.woodmart-woocommerce-layered-nav .filter-swatch > span::after{
background-color: transparent !important;
}

    Best Regards.

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