ZCA Bootstrap 4 Template [Support Thread]

[lat9]

I'd like to force the listing pages to use larger product images/fewer columns - I know that Product Listing > Columns per Row is recommended to be 0; is there another option?

With that setting at 0, edit your template's override of /includes/modules/bootstrap/product_listing.php, finding the following section

        // set css classes for "row" wrapper, to allow for fluid grouping of cells based on viewport
        // these defaults are based on Bootstrap4, but can be customized to suit your own framework
        if ($product_listing_layout_style === 'fluid') {
            $grid_cards_classes = 'row-cols-1 row-cols-md-2 row-cols-lg-2 row-cols-xl-3';
            // this array is intentionally in reverse order, with largest index first
            $grid_classes_matrix = [
                '10' => 'row-cols-1 row-cols-md-2 row-cols-lg-4 row-cols-xl-5',
                '9' => 'row-cols-1 row-cols-md-3 row-cols-lg-4 row-cols-xl-5',      //-lat9: Added for 3/9/0 configuration
                '8' => 'row-cols-1 row-cols-md-2 row-cols-lg-3 row-cols-xl-4',
                '6' => 'row-cols-1 row-cols-md-2 row-cols-lg-2 row-cols-xl-3',
            ];
            // determine classes to use based on number of grid-columns used by "center" column
            if (isset($center_column_width)) {
                foreach ($grid_classes_matrix as $width => $classes) {
                    if ($center_column_width >= $width) {
                        $grid_cards_classes = $classes;
                        break;
                    }
                }
            }
            $list_box_contents[$rows]['params'] = 'class="row ' . $grid_cards_classes . ' text-center"';
        }

... and edit that grid_classes_matrix for your customizations.

[swguy]

Beautiful! Thank you.

[marcopm]

First of all, thank you lat9 for this incredible work, such a useful and well done template!

I am scratching my head about the specials, all products, etc. pages.

Let's take the specials page for example. Both header_php.php and header_php_special_zca_bootstrap.php are loaded.

The first one (actually it's the main_template_vars.php in this case, but it's not that important) runs the query, calls splitPageResults (the "original" one), etc. and saves the results into $list_box_contents.

Then header_php_special_zca_bootstrap.php does some similar stuff, but with some adjustments for the bootstrap template, and saves to $listing_sql and $column_list variable.

If I'm not mistaken (please correct me if I'm wrong) the data extracted from header_php.php is not used at all, as tpl_modules_product_listing.php is called in the template, which only considers the data from header_php_special_zca_bootstrap.php ($listing_sql and $column_list variable) and produces its "own" $list_box_contents, which is the only one that will be used in the final page.

I guess header_php.php has been left as it is - despite the overhead - so as not to override too many core files, right? And because right now there's no way to tell ZC "for this page just load this header file and not that", without making some changes to the header files themselves (or to some other core files).
Or is it because the data extracted in header_php.php for these pages is/may be used somewhere else too?

[swguy]

Curious if anyone has adopted Instant Search for this template:
https://www.zen-cart.com/downloads.php?do=file&id=1336

[lat9]

First of all, thank you lat9 for this incredible work, such a useful and well done template!

I am scratching my head about the specials, all products, etc. pages.

Let's take the specials page for example. Both header_php.php and header_php_special_zca_bootstrap.php are loaded.

The first one (actually it's the main_template_vars.php in this case, but it's not that important) runs the query, calls splitPageResults (the "original" one), etc. and saves the results into $list_box_contents.

Then header_php_special_zca_bootstrap.php does some similar stuff, but with some adjustments for the bootstrap template, and saves to $listing_sql and $column_list variable.

If I'm not mistaken (please correct me if I'm wrong) the data extracted from header_php.php is not used at all, as tpl_modules_product_listing.php is called in the template, which only considers the data from header_php_special_zca_bootstrap.php ($listing_sql and $column_list variable) and produces its "own" $list_box_contents, which is the only one that will be used in the final page.

I guess header_php.php has been left as it is - despite the overhead - so as not to override too many core files, right? And because right now there's no way to tell ZC "for this page just load this header file and not that", without making some changes to the header files themselves (or to some other core files).
Or is it because the data extracted in header_php.php for these pages is/may be used somewhere else too?

No correction necessary. You've captured what's going on. While the queries are redundant, there's no way to tell the 'core' header_php.php to not generate that query and I'm not a big fan of core-file overwrites, so there's a bit of overhead in the generation of those product listings.

[lat9]

Curious if anyone has adopted Instant Search for this template:
https://www.zen-cart.com/downloads.php?do=file&id=1336

I'm working on one ...

[marcopm]

Curious if anyone has adopted Instant Search for this template:
https://www.zen-cart.com/downloads.php?do=file&id=1336

Yes I'm using it, with various changes/customizations (ajax call, better db search and results sorting for my needs, etc) since the plugin is a bit basic/clunky/outdated in some parts - but still an excellent starting point!
No need to use the provided css file, styling the results container and the single results is quite easy with bootstrap classes (I'm using the media object for the single results because I'm showing the product image as well)

Tbh this (instant search) is one of those many things that ZC should absolutely provide out of the box nowadays. I don't know if it's already in the works for v 1.5.8.

[earmsby]

I just added this template to a site using 1.5.7b and selected the template in Tools > Template selection. However, after changing the template to bootstrap, I'm seeing the stylesheets and layout for my old template. Is there another step I missed in activating the template?

[earmsby]

I just added this template to a site using 1.5.7b and selected the template in Tools > Template selection. However, after changing the template to bootstrap, I'm seeing the stylesheets and layout for my old template. Is there another step I missed in activating the template?

Hmm... never mind. I can't get my old template to change to any other template either, so it's obviously not an issue with this template specifically.

[swguy]

I think it would be fun to add the Font Awesome icon to the button.
In zen_image_button, you could modify the notifier to pass the image and alt text, then update the alt text appropriately.

// Add icons from Font Awesome
switch ($image) {
case BUTTON_IMAGE_ASK_A_QUESTION:
$alt = '<span class="fas fa-envelope"></span> ' . $alt;
break;
... etc.
}