ZCA Bootstrap 4 Template [Support Thread]

rbarbour:

@johndoes

This isn't an easy thing due to using the standard BS CSS which adds a 30px gutter. You can see how this effects the layout here. https://getbootstrap.com/docs/4.0/layout/grid/#how-it-works

You have 2 options:

1. Add the following class "red" to line 97 in /includes/templates/bootstrap-mystore/common/tpl_main_page.php

<div class="container-fluid **m-0 p-0**" id="mainWrapper">

then add the following class "red" to line 124

<div class="row **m-3**">

2. You can customize the BS CSS removing the gutters and adding your own paddings in /includes/templates/bootstrap-mystore/css/stylesheet.css
   https://getbootstrap.com/docs/3.3/customize/#grid-system
   Thank you.

I will be uploading Version: 1.0.6 by end of weekend...

This upgrade includes:

1.) Several HTML validations (github issue #62)
2.) Adds Responsive Carousel Banners (github issue #63)
3.) Adds the PhotoSwipe Lightbox to the document_general_info, document_product_info, page, product_free_shipping_info, product_info, product_music_info, product_reviews, product_reviews_info & product_reviews_write pages (github issue #64)
4.) Adds Admin controlled Template Colors Configuration (github issue #65)

hello rbarbour - I have realized that I do not know enough about bootstrap to work with this template but I do believe it is the way to go.

I have a problem in that the index page in my existing template is now showing the text 'Flexible Footer Menu' <indexDefaultHeading> and I am not sure how to remove it even though I have removed all the zca bootstrap template files - any ideas where I should look?

many thanks,
Mike

shags38:

hello rbarbour - I have realized that I do not know enough about bootstrap to work with this template but I do believe it is the way to go.

This template is the ONLY way to go! :D

Version 1.0.6 was uploaded Sunday but isn't yet available in the downloads.

shags38:

I have a problem in that the index page in my existing template is now showing the text 'Flexible Footer Menu' <indexDefaultHeading> and I am not sure how to remove it even though I have removed all the zca bootstrap template files - any ideas where I should look?

many thanks,
Mike

Mike,

More than likely you have a stray language file.

look in your /includes/languages/english folders

&

/includes/languages/english/extra_definitions folders

but as stated before this is not related to this template and should be posted in the proper thread.

rbarbour:

This template is the ONLY way to go! :D

Version 1.0.6 was uploaded Sunday but isn't yet available in the downloads.

Mike,

More than likely you have a stray language file.

look in your /includes/languages/english folders

&

/includes/languages/english/extra_definitions folders

but as stated before this is not related to this template and should be posted in the proper thread.

Thanks Raymond - your hint at extra_definitions folders did the trick - found it in /includes/languages/english/extra_definitions/flexible_footer_menu in the first block under define('HEADING_TITLE',''); removed Flexible Footer Menu

cheers,
Mike

Hi guys,
Just to ask if the carousel on front page is adjustable and can also take the full width of the page?

I'm having the devil of a time getting checkbox inputs to show as table-column elements.

In the responsive_classic and classic templates, the element is "coded" as

                    <tr>
                        <td><?php echo TEXT_GROUP_PUBLIC; ?></td>
                        <td><?php echo zen_draw_checkbox_field("group_public[$favorites_group_id]", '', ($group_info['is_public'] == 1)); ?></td>
                    </tr>

For the bootstrap template, I've wrapped the table with a <div class="table-responsive"> and added the classes "table table-bordered" to the table itself. Then, I modified the checkbox column to read:

                    <tr>
                        <td><?php echo TEXT_GROUP_PUBLIC; ?></td>
                        <td><div class="custom-control custom-checkbox"><?php echo zen_draw_checkbox_field("group_public[$favorites_group_id]", '', ($group_info['is_public'] == 1)); ?></div></td>
                    </tr>

... but still no checkbox is displayed.:(

Anyone have any suggestions?

lat9:

I'm having the devil of a time getting checkbox inputs to show as table-column elements.

In the responsive_classic and classic templates, the element is "coded" as

                <tr>
                    <td><?php echo TEXT_GROUP_PUBLIC; ?></td>
                    <td><?php echo zen_draw_checkbox_field("group_public[$favorites_group_id]", '', ($group_info['is_public'] == 1)); ?></td>
                </tr>

> For the bootstrap template, I've wrapped the table with a <div class="table-responsive"> and added the classes "table table-bordered" to the table itself.  Then, I modified the checkbox column to read:
> 
> ```
                    <tr>
                        <td><?php echo TEXT_GROUP_PUBLIC; ?></td>
                        <td><div class="custom-control custom-checkbox"><?php echo zen_draw_checkbox_field("group_public[$favorites_group_id]", '', ($group_info['is_public'] == 1)); ?></div></td>
                    </tr>

... but still no checkbox is displayed.:(

Anyone have any suggestions?

Cindy,

https://getbootstrap.com/docs/4.0/components/forms/#custom-styles

The ZCA Bootstrap Template uses custom forms.

An ID must be added to the check box

And a label must be created
<label class="custom-control-label" for="***ID****">

Thanks, @rbarbour. That corrected the issue I was having.

Hi everyone,

I need some help with this theme. Not highly expert so please bare with me. I was using a template to design a decent looking website. Ran into unlimited issues so dropped the idea of using third party templates. I downloaded this template and have managed to fiddle around with it a bit, so far to my satisfaction. Mainly turning on and off boxes and similar things.

Attached is the screenshot with numbers, 1 to 4. I'll explain what I'm trying to do and any help in regards to how to achieve results would be highly appreciated.

1. Log in. I would like to move the log in to the right side of the page. Next to search box, or find it for me box.
2. The top menu is same as side menu. I found the setting and it can be disabled/enabled. I'm thinking of editing it but then it means when enabled it will mirror the side menu which is number 4 in the pic.

What I'm trying to achieve is to have a different menu which stretches to the whole width of the page and in that I can add, drop down sub menus as per need. Question is how do I do it? Can it be done by using css menu and adding it to stylesheet?

3. That menu needs to go. Simply put. How can I do that?
4. Side menu is fixed. How to change its width? I saw the option in setting but it says the changes made will not take effect for zca theme. So, how can I go about and change it? Or possibly change it top menu suggestion of making it in css (by coping and pasting from some stylesheet which has some good looking menus) is it possible?

Any beginner level help would be appreciated. The reason I ditched the idea of third party theme is that no support. So here's to hoping that I'll be able to achieve some results using this theme. Where it says welcome to mobile direct, above it I would like a decent slider for products. Any suggestion to which works better with this build of zen cart version.

Many thanks in advance for your help and input.

Cheers.

P.S. I can locate files and edit using note pad or netbeans, no problem. I'm doing all this locally and not live so I can make the changes and adjust things first. Learn while I do this. Thanks.

windyborough:

1. Log in. I would like to move the log in to the right side of the page. Next to search box, or find it for me box.
   In: /includes/templates/bootstrap/common/tpl_header.php
   around line 54 find: ```

windyborough:

2. The top menu is same as side menu. I found the setting and it can be disabled/enabled. I'm thinking of editing it but then it means when enabled it will mirror the side menu which is number 4 in the pic.

What I'm trying to achieve is to have a different menu which stretches to the whole width of the page and in that I can add, drop down sub menus as per need. Question is how do I do it? Can it be done by using css menu and adding it to stylesheet?

The top tabs are admin controlled (ADMIN>CONFIGURATION>LAYOUT SETTINGS>Categories-Tabs Menu ON/OFF). You can add different plugins to achieve what you want.

Bootstrap Examples
https://getbootstrap.com/docs/4.1/components/navbar/

You can easily change those using the category tab dropdown or the CSS mega menu plugins. Like I did here
http://zcadditions.com/bootstrap_elux_demo/

windyborough:

3. That menu needs to go. Simply put. How can I do that?

That is an ezpage menu and is admin controlled (ADMIN>CONFIGURATION>EZ-PAGES SETTINGS>EZ-Pages Display Status - HeaderBar)

windyborough:

4. Side menu is fixed. How to change its width? I saw the option in setting but it says the changes made will not take effect for zca theme. So, how can I go about and change it? Or possibly change it top menu suggestion of making it in css (by coping and pasting from some stylesheet which has some good looking menus) is it possible?

The widths of the side columns are admin controlled (ADMIN>CONFIGURATION>LAYOUT SETTINGS>Responsive Left Column Width), (ADMIN>CONFIGURATION>LAYOUT SETTINGS>Responsive Center Column Width), (ADMIN>CONFIGURATION>LAYOUT SETTINGS>Responsive Right Column Width)

windyborough:

Any beginner level help would be appreciated. The reason I ditched the idea of third party theme is that no support. So here's to hoping that I'll be able to achieve some results using this theme. Where it says welcome to mobile direct, above it I would like a decent slider for products. Any suggestion to which works better with this build of zen cart version.

This template has options to turn any banner display into a banner carousel which can also be found under ADMIN>CONFIGURATION>LAYOUT SETTINGS

I personally like slick (http://kenwheeler.github.io/slick/) for a product carousel, you can also see that implemented here: http://zcadditions.com/bootstrap_elux_demo/

@rbarour many thanks for the detailed reply. Appologies for the late reply, I will do as you pointed out and get back if run into any issues. One quick question, I think somewhere in this thread you mentioned that you will update the template over the weekend. Shall I wait till you update the template or do it now and do again once the updated template is available to download.

Just wondering if the update will iron out issues which I might come across later on, so best to wait a day and then download the updated template and do everything on it? Also appreciate that you also provided some links.

I appreciate your reply and help, and I assure you, you will see a lot of posts/replies from me lol the site got a long way to go.

Cheers

windyborough:

@rbarour many thanks for the detailed reply. Appologies for the late reply, I will do as you pointed out and get back if run into any issues. One quick question, I think somewhere in this thread you mentioned that you will update the template over the weekend. Shall I wait till you update the template or do it now and do again once the updated template is available to download.

Just wondering if the update will iron out issues which I might come across later on, so best to wait a day and then download the updated template and do everything on it? Also appreciate that you also provided some links.

I appreciate your reply and help, and I assure you, you will see a lot of posts/replies from me lol the site got a long way to go.

Cheers

The current version is 1.06 and is available in the download section.

I won't be releasing another version till beginning of October but as of right now none of the changes will affect the catalog side.

rbarbour:

The current version is 1.06 and is available in the download section.

I won't be releasing another version till beginning of October but as of right now none of the changes will affect the catalog side.

I downloaded the latest version and using it. Since I last posted, I have had multiple issues (not template related) and since then been starting new projects to test and iron out the things. Right now stuck at two things, first is css mega menu. I managed to incorporate it by following the included instructions and I have to get another one to use. Plus it does not show up in configurations settings in admin panel and by the looks of it the the author who made it is not active perhaps. It's thread is really old, 2012. Need to get another mega menu.

I have taken your advice and downloaded slick. Slick is very slick lol. I love it haven't messed about it yet because its half one in the morning and I know I'll just mess it up if I even tried to "uderstand" it.

My question is, can you point me to the write direction for how to incorporate slick in your theme? Youtube? Slick looks advance and nice and to add it must need advance knowledge, I'm guessing, which I'm lacking. If you can point me to the direction then I'll try to figure it out that which files needs to be edited and copied from and to and all that.

I have found a ZX slider and it looks recent. But slick looks.. slick! It has many options and settings and it can/will make a bland site very lovely.

Any mega menu idea? I have found a cracking looking menu here same thing, don't know which file the html code will go into in the template and in which css will. I downloaded it and not sure how to add it to the theme.

Any help with the slick would be highly appreciated. Many thanks in advance. Cheers

Great template! It's so fast!

How do I go about adding/removing items from that bootstrap toggle menu?

Thank you

dellchase:

Great template! It's so fast!

How do I go about adding/removing items from that bootstrap toggle menu?

Thank you

The toggle menu is controlled via the admin,

You can remove the specials, all products and new product links from the categories
Configuration > Layout Settings > Categories Box - Show Specials Link
Configuration > Layout Settings > Categories Box - Show Products New Link
Configuration > Layout Settings > Categories Box - Show Featured Products Link
Configuration > Layout Settings > Categories Box - Show Products All Link

The other links in this toggle menu are taken from the information and more information sideboxes,
Configuration > Define Page Status >
Configuration > E-Mail Options > Display "Newsletter Unsubscribe" Link?

Also some are controlled by your ezpage settings
Sidebox Sort order is used when pages are listed in vertical links; Sort order should be greater than zero to enable it in vertical listing.

rbarbour:

The toggle menu is controlled via the admin,

You can remove the specials, all products and new product links from the categories
Configuration > Layout Settings > Categories Box - Show Specials Link
Configuration > Layout Settings > Categories Box - Show Products New Link
Configuration > Layout Settings > Categories Box - Show Featured Products Link
Configuration > Layout Settings > Categories Box - Show Products All Link

The other links in this toggle menu are taken from the information and more information sideboxes,
Configuration > Define Page Status >
Configuration > E-Mail Options > Display "Newsletter Unsubscribe" Link?

Also some are controlled by your ezpage settings
Sidebox Sort order is used when pages are listed in vertical links; Sort order should be greater than zero to enable it in vertical listing.

Thank you very much! Worked perfectly! But I was unable to remove the Important Links one. So I just removed the ez-pages code from tpl_offcanvas_menu.php which is fine because I don't want any ez-pages on that menu anyway. :smile:

Hello,

After making my tweaks and taking the site live I've ran into a couple issues.

Using Internet Explorer the Continue Shopping and Checkout buttons don't work on the Your Shopping Cart Contents page. They do work on FireFox and Chrome.

Also ran into one other issue. At checkout the page goes white on the payment page. I viewed the source and its blank. This is the error found in the logs:
[28-Oct-2018 00:25:01 MST] PHP Fatal error: Call to undefined method queryFactory::ExecuteNoCache() in /home/ffs/public_html/includes/modules/order_total/ot_gv.php on line 377

Modules -> Order Total -> Disabled Gift Certificates for the time being and that fixed it.

Thanks

dellchase:

Thank you very much! Worked perfectly! But I was unable to remove the Important Links one. So I just removed the ez-pages code from tpl_offcanvas_menu.php which is fine because I don't want any ez-pages on that menu anyway. :smile:

If you don't use EZ Pages just disable the side box. It will automatically remove the links from the drop-down

dellchase:

Hello,

After making my tweaks and taking the site live I've ran into a couple issues.

Using Internet Explorer the Continue Shopping and Checkout buttons don't work on the Your Shopping Cart Contents page. They do work on FireFox and Chrome.

Also ran into one other issue. At checkout the page goes white on the payment page. I viewed the source and its blank. This is the error found in the logs:
[28-Oct-2018 00:25:01 MST] PHP Fatal error: Call to undefined method queryFactory::ExecuteNoCache() in /home/ffs/public_html/includes/modules/order_total/ot_gv.php on line 377

Modules -> Order Total -> Disabled Gift Certificates for the time being and that fixed it.

Thanks

I can't replicate the issue what other order total modules do you have installed