ZCA Bootstrap 4 Template [Support Thread]

[Dave224]

It appears on desktop rendering; it does not appear on mobile. This must be something in Bootstrap 4.6 that's not in 4.5 or something in the template 3.1.1 that's not in 3.0.0. I have not changed anything to customize that wasn't there before the update.
Dave

[lat9]

It appears on desktop rendering; it does not appear on mobile. This must be something in Bootstrap 4.6 that's not in 4.5 or something in the template 3.1.1 that's not in 3.0.0. I have not changed anything to customize that wasn't there before the update.
Dave

There were a fair number of changes going from Bootstrap 4.5.3 to 4.6.0 (https://github.com/twbs/bootstrap/releases/tag/v4.6.0) and the template's 3.0.0 to 3.1.0 changes affected most everything.

[Dave224]

There were a fair number of changes going from Bootstrap 4.5.3 to 4.6.0 (https://github.com/twbs/bootstrap/releases/tag/v4.6.0) and the template's 3.0.0 to 3.1.0 changes affected most everything.

I replaced the link to bootstrap 4.6.0 with the previous link to version 4.5.3 in includes/templates/bootstrap/html_header.php. The dropdown slider is still present.
Dave

[Dave224]

The problem is in includes/templates/bootstrap/css/stylesheet.css around line 31. I think the following code is intended for mobile only, but I believe the code is applied to both desktop and mobile.

/* set height of scrollable area in mobile menu */
div#navbarSupportedContent {
    max-height:90vh;
    overflow-y:auto;
}

If I comment out the code, the dropdown slider does not appear.

Dave

[DrByte]

The problem is in includes/templates/bootstrap/css/stylesheet.css around line 31. I think the following code is intended for mobile only, but I believe the code is applied to both desktop and mobile.

/* set height of scrollable area in mobile menu */
div#navbarSupportedContent {
    max-height:90vh;
    overflow-y:auto;
}

If I comment out the code, the dropdown slider does not appear.

Dave

I think you've customized the header nav and the mobile nav in a way that combines them into the same div instead of them being separate, else it wouldn't show on desktop mode.

[greg_beyer]

Hi @rbarbour,

FYI, The demo site url http://www.zcadditions.com/bootstrap_tpl_demo/ says that it expired yesterday

[lat9]

Hi @rbarbour,

FYI, The demo site url http://www.zcadditions.com/bootstrap_tpl_demo/ says that it expired yesterday

Unfortunately, @rarbour hasn't been around for a while. The updated demo site (for v3.0.0 and later) is https://vinosdefrutastropicales.com/zc157_bs4/.

[Opal5]

Hi, I was just wondering if someone could point me in the right direction as to what needs editing here. My new products listing https://earthlywhispers.com/shop/ind...e=products_new also my categories such as: https://earthlywhispers.com/shop/ind...ndex&cPath=4_5 when displayed in the mobile version you can't see the images, a teenie tiny little image and large text :/ What would I need to change for it to look a bit normal with the image bigger and text smaller? Thank you.

[lat9]

Hi, I was just wondering if someone could point me in the right direction as to what needs editing here. My new products listing https://earthlywhispers.com/shop/ind...e=products_new also my categories such as: https://earthlywhispers.com/shop/ind...ndex&cPath=4_5 when displayed in the mobile version you can't see the images, a teenie tiny little image and large text :/ What would I need to change for it to look a bit normal with the image bigger and text smaller? Thank you.

That appears to be an artifact of using rows instead of columns for the product-related listings' display. Those listings display better in the template's responsive mode, changing Configuration :: Product Listing :: Columns per Row from 1 to 0.

[Opal5]

That appears to be an artifact of using rows instead of columns for the product-related listings' display. Those listings display better in the template's responsive mode, changing Configuration :: Product Listing :: Columns per Row from 1 to 0.

Thank you so much! Perfect!!! You're a star! :)