ZCA Bootstrap 4 Template [Support Thread]

I'm not seeing the need, whether with or without a top banner. A screenshot would help to show what you're seeing.

lat9:

I'm not seeing the need, whether with or without a top banner. A screenshot would help to show what you're seeing.

You are right Lat is better with pictures my English is weak, as you can see on the pictures the logo and the banner go down because the <br> is missing for me.

Thanks for the picture, that issue is fixed in the forthcoming v3.5.2 of the template where I'd changed the heading structure to more properly display when the upper-header banners are included.

v3.5.2 of the Bootstrap template is now available for download: https://www.zen-cart.com/downloads.php?do=file&id=2191

This release contains changes associated with the following GitHub issues:

#203: Correct shopping-cart display when both icon and checkbox is rendered.
#206: Correct heading structure and add landscape for accessibility.
#209: Remove unneeded code from the admin's Tools :: ZCA Bootstrap Colors tool.
#210, #211: Updates to "ZCA Bootstrap Colors" and /css/stylesheet_zca_colors.php to make it easier to add/update colors now and in the future. Refer to the template's wiki (https://github.com/lat9/ZCA-Bootstrap-Template/wiki) for additional information.
#212: Updating/adding various color settings for the "ZCA Bootstrap Colors" tool.
#215: Remove unwanted bootstrap base color classes, so the the "ZCA Bootstrap Colors" control the sections.
#220: Coupon modal pop-up not displaying any text when there are no category-related restrictions.
#221: Correct 'run-on' sentence structure in coupon modal pop-up.
#222: zc158a no longer includes <strong> tags in 3-page checkout guidance language constants.
#223: Coupon modal pop-up creates PHP Warning when coupon has product-related restrictions.
#224: Use FA-5 classes for FA-icons (some were still using FA-4 'syntax').
#226: Correcting header-tag hierarchy and adding labels for accessibility.
#227: Correct notification name for coupon-link update.

lat9:

v3.5.2 of the Bootstrap template is now available for download: https://www.zen-cart.com/downloads.php?do=file&id=2191

Sorry...newbie guy/question here. Do I need to run the .sql file thats located in the /docs/bootstrap/uninstall/bootstrap_colors_uninstall.sql folder in the Install SQL Patches link on the admin site?

Thank you,

JTLS

Looking at the bootstrap_colors_unstall.sql code (a new file for this version) it appears that this is to be used strictly to reset colors for your bootstrap when they get messed up and they do.:P

When we were testing for color contrast compatibility, the process of wiping out all colors and starting over was tedious to say the least. This file will help us a lot.

This file can quickly get rid of alll colors and your next trip to the admin will return all the default colors to their rightful place.

For Lat9, and developer look at this on tpl categories.php found on templates/sidebox I added title= why not get used to doing some SEO?

<?php /** * Side Box Template * * BOOTSTRAP v3.0.0 * * @package templateSystem * @copyright Copyright 2003-2018 Zen Cart Development Team * @copyright Portions Copyright 2003 osCommerce * @license <http://www.zen-cart.com/license/2_0.txt> GNU Public License V2.0 * @version $Id: Drbyte Sun Jan 7 21:28:50 2018 -0500 Modified in v1.5.6 $ */ $content = ''; $content .= '<div id="' . str_replace('_', '-', $box_id . 'Content') . '" class="list-group-flush sideBoxContent">'; for ($i = 0, $j = count($box_categories_array); $i < $j; $i++) { switch (true) { // to make a specific category stand out define a new class in the stylesheet example: A.category-holiday // uncomment the select below and set the cPath=3 to the cPath= your_categories_id // many variations of this can be done // case ($box_categories_array[$i]['path'] == 'cPath=3'): // $new_style = 'category-holiday'; // break; case ($box_categories_array[$i]['top'] == 'true'): $new_style = 'sideboxCategory-top'; break; case ($box_categories_array[$i]['has_sub_cat']): $new_style = 'sideboxCategory-subs'; break; default: $new_style = 'sideboxCategory-products'; break; } if ($box_categories_array[$i]['has_sub_cat']) { $box_categories_array[$i]['name'] .= CATEGORIES_SEPARATOR; } if (zen_get_product_types_to_category($box_categories_array[$i]['path']) == 3 or ($box_categories_array[$i]['top'] != 'true' and SHOW_CATEGORIES_SUBCATEGORIES_ALWAYS != 1)) { // skip if this is for the document box (==3) } else { $content .= '<a class="list-group-item list-group-item-action d-flex justify-content-between align-items-center ' . $new_style . '" href="' . zen_href_link(FILENAME_DEFAULT, $box_categories_array[$i]['path']) . '" **title="' . zen_href_link(FILENAME_DEFAULT, $box_categories_array[$i]['path']) . '"**>'; if ($box_categories_array[$i]['current']) { if ($box_categories_array[$i]['has_sub_cat']) { $content .= '<span class="sideboxCategory-subs-parent">' . $box_categories_array[$i]['name'] . '</span>'; } else { $content .= '<span class="sideboxCategory-subs-selected">' . $box_categories_array[$i]['name'] . '</span>'; } } else { $content .= $box_categories_array[$i]['name']; } if (SHOW_COUNTS == 'true') { if ((CATEGORIES_COUNT_ZERO == '1' and $box_categories_array[$i]['count'] == 0) or $box_categories_array[$i]['count'] >= 1) { $content .= '<span class="badge badge-pill">' . CATEGORIES_COUNT_PREFIX . $box_categories_array[$i]['count'] . CATEGORIES_COUNT_SUFFIX . '</span>'; } } $content .= '</a>'; } } if (SHOW_CATEGORIES_BOX_SPECIALS == 'true' or SHOW_CATEGORIES_BOX_PRODUCTS_NEW == 'true' or SHOW_CATEGORIES_BOX_FEATURED_PRODUCTS == 'true' or SHOW_CATEGORIES_BOX_PRODUCTS_ALL == 'true') { // display a separator between categories and links // if (SHOW_CATEGORIES_SEPARATOR_LINK == '1') { // $content .= '<hr id="catBoxDivider" />' . "\n"; // } if (SHOW_CATEGORIES_BOX_SPECIALS == 'true') { $show_this = $db->Execute("SELECT s.products_id FROM " . TABLE_SPECIALS . " s WHERE s.status= 1 LIMIT 1"); if (!$show_this->EOF) { $content .= '<a class="list-group-item list-group-item-action list-group-item-secondary" href="' . zen_href_link(FILENAME_SPECIALS) . '" **title="' . zen_href_link(FILENAME_SPECIALS) . '"**>' . CATEGORIES_BOX_HEADING_SPECIALS . '</a>'; } } if (SHOW_CATEGORIES_BOX_PRODUCTS_NEW == 'true') { // display limits // $display_limit = zen_get_products_new_timelimit(); $display_limit = zen_get_new_date_range(); $show_this = $db->Execute( "SELECT p.products_id FROM " . TABLE_PRODUCTS . " p WHERE p.products_status = 1 " . $display_limit . " LIMIT 1" ); if (!$show_this->EOF) { $content .= '<a class="list-group-item list-group-item-action list-group-item-secondary" href="' . zen_href_link(FILENAME_PRODUCTS_NEW) . '" **title="' . zen_href_link(FILENAME_PRODUCTS_NEW) . '"**>' . CATEGORIES_BOX_HEADING_WHATS_NEW . '</a>'; } } if (SHOW_CATEGORIES_BOX_FEATURED_PRODUCTS == 'true') { $show_this = $db->Execute("SELECT products_id FROM " . TABLE_FEATURED . " WHERE status = 1 LIMIT 1"); if (!$show_this->EOF) { $content .= '<a class="list-group-item list-group-item-action list-group-item-secondary" href="' . zen_href_link(FILENAME_FEATURED_PRODUCTS) . '" **title="' . zen_href_link(FILENAME_FEATURED_PRODUCTS) . '"**>' . CATEGORIES_BOX_HEADING_FEATURED_PRODUCTS . '</a>'; } } if (SHOW_CATEGORIES_BOX_PRODUCTS_ALL == 'true') { $content .= '<a class="list-group-item list-group-item-action list-group-item-secondary" href="' . zen_href_link(FILENAME_PRODUCTS_ALL) . '" **title="' . zen_href_link(FILENAME_PRODUCTS_ALL) . '"**>' . CATEGORIES_BOX_HEADING_PRODUCTS_ALL . '</a>'; } } $content .= '</div>';

What new content are you adding?

Link Title Attribute Best Practices

You should use a link title when you are providing more information about the link.

Don’t use a link title to provide the information over again, as this is a usability fail that will only result in annoying your users.

Cindy - I think I found an issue with the Bootstrap and the Remember Me plugin.

The plugin puts a "Remember Me" checkbox on the login page. However, due to the input class of the checkbox, the actual checkbox isn't displaying.

The code looks like this:

<input class="custom-control-input" type="checkbox" name="permLogin" value="1" checked="checked" id="permLogin">

As you can see in the screenshot, it doesn't display the actual checkbox:

Now, if I manually change the class to anything else, it works. The problem is that I don't know where to change it.

I ASSUME that I need to change it in the observers/class.remember_me_observer.php on this line:

zen_draw_checkbox_field('permLogin', '1', $this->checkbox_default, 'id="permLogin"') .
            '<label class="checkboxLabel" for="permLogin" title="' . TEXT_REMEMBER_ME_ALT . '">' . TEXT_REMEMBER_ME . '</label>';

However, I don't know how! I did try to edit that line of code above to say 'id="permLogin" class="testing", but all that did was create a checkbox with the class saying class="custom-control-input testing".

The problem is that the checkbox itself won't display with the "custom-control-input" class. Perhaps there's a CSS edit to be made?

Any help is appreciated.

@Jeff_Mash, you'll need to edit /includes/classes/observers/class.remember_me_observer.php. Find this method

    public function create_checkbox() 
    {
        if (!$this->enabled) {
            return '';
        }
        $return_value = 
            '<br />' .
            zen_draw_checkbox_field ('permLogin', '1', $this->checkbox_default, 'id="permLogin"') .
            '<label class="checkboxLabel" for="permLogin" title="' . TEXT_REMEMBER_ME_ALT . '">' . TEXT_REMEMBER_ME . '</label>';

        return $return_value;
    }

and change it to read as follows for compatibility with the bootstrap template:

    public function create_checkbox() 
    {
        if (!$this->enabled) {
            return '';
        }
        $return_value = 
            '<br>' .
          [B] '<div class="custom-control custom-checkbox">' .[/B]
                zen_draw_checkbox_field('permLogin', '1', $this->checkbox_default, 'id="permLogin"') .
                '<label class="checkboxLabel" for="permLogin" title="' . TEXT_REMEMBER_ME_ALT . '">' . TEXT_REMEMBER_ME . '</label>' .
           [B]'</div>'[/B];

        return $return_value;
    }

.. essentially wrapping the checkbox and its label in a custom_control custom-checkbox div.

That still didn't work, Cindy. Here is a screenshot to show you the Inspect Code. You can see it has the changes you requested (wrapping the text in the custom_control custom-checkbox).......but I cannot get the checkbox to show up unless I somehow change the input class of the zen_draw_checkbox_field () so that it doesn't say "custom-control-input".

That image should show the code and the still-hidden checkbox field.

To summarize.........This doesn't work:

<div class="custom-control custom-checkbox"><input type="checkbox" name="permLogin" value="1" checked="checked" id="permLogin" [b]class="custom-control-input"[/b]><label class="checkboxLabel" for="permLogin" title="Tick this box to be automatically logged in on your next visit. Note: This will place create a cookie in your current browser that can only be read by this website.">Remember me?</label></div>

But this will work:

<div class="custom-control custom-checkbox"><input type="checkbox" name="permLogin" value="1" checked="checked" id="permLogin" [b]class="LiterallyAnythingElse"[/b]><label class="checkboxLabel" for="permLogin" title="Tick this box to be automatically logged in on your next visit. Note: This will place create a cookie in your current browser that can only be read by this website.">Remember me?</label></div>

Is there anyway to change that input class when calling zen_draw_checkbox_field()?

What version of the template? Running the v3.5.2 on zc158a and enabling the privacy to be displayed on the create-account page, the associated checkbox (er) displays.

I am running 1.5.8a with the latest Bootstrap.

When I enable the privacy box (under Create Account), that checkbox displays just fine. Here's the code:

<div class="custom-control custom-checkbox mb-3 mt-2">
                <input class="[b]custom-control-input[/b]" type="checkbox" name="privacy_conditions" value="1" id="privacy" required="">                <label class="custom-control-label checkboxLabel" for="privacy">I have read and agreed to your privacy statement.</label>
            </div>

But for some reason, the checkbox for Remember Me (on the Log In page) doesn't show up. Here is the code:

<div class="custom-control custom-checkbox"><input class="[b]custom-control-input[/b]" type="checkbox" name="permLogin" value="1" checked="checked" id="permLogin"><label class="checkboxLabel" for="permLogin" title="Tick this box to be automatically logged in on your next visit. Note: This will place create a cookie in your current browser that can only be read by this website.">Remember me?</label></div>

Here's what I don't understand. I can get the Remember Me checkbox to display if I go to INSPECT the code and manually change the input class="custom-control-input" to say something else (like input class="anythingElse"

But this is the exact same input class="custom-control-input" as the Privacy checkbox which does display without any issues.

What do you think the problem could be? If you want to see it, I currently am leacvin

The last sentence in my previous reply was cutoff. I was saying, if you want to see the checkbox on my site, I currently have it enabled here: https://www.mjmmagic.com/store/index.php?main_page=login

My bad; you need to add the custom-control-label class to that (er) <label> tag.

I am having difficulty using any other PHP version than the ancient version 5.4
If I select any other version above 5.4 such as 7 all the way to 8.1 my site does not load at all (blank site without any error message)

Zen Cart Version 1.5.6c

In my cPanel I can set the PHP version in this menu:

MultiPHP Manager

System PHP Version
The system default PHP version is set by the system administrator.

Any domain that is set to the inherit value indicates that it does not have its own PHP version explicitly set. Read more about inherit.

Set PHP Version per Domain
Select the domains that you wish to change from the table, then apply a PHP version from the list.

Any help will be appreciated

lat9:

My bad; you need to add the custom-control-label class to that (er) <label> tag.

But WHERE do I add that? This is the code that spits out the checkbox:

'<div class="custom-control custom-checkbox">' .
            zen_draw_checkbox_field('permLogin', '1', $this->checkbox_default, 'id="permLogin"') .
            '<label class="checkboxLabel" for="permLogin" title="' . TEXT_REMEMBER_ME_ALT . '">' . TEXT_REMEMBER_ME . '</label>' .
			'</div>';

As you can see, there is no way to edit the "class value" for the zen_draw_checkbox_field() function in that line of code.

Now, I can APPEND a class value to it by doing this:

zen_draw_checkbox_field('permLogin', '1', $this->checkbox_default, 'class="custom-control-label" id="permLogin"')

Then it only appends that class to the existing class like this (which still doesn't work):

<input type="checkbox" name="permLogin" value="1" checked="checked" class="custom-control-input custom-control-label" id="permLogin">

The only way for it to work seems to be to change wherever zen_draw_checkbox_field() is getting that default "custom-control-input" when it outputs it. Where do we change THAT so that it can be something else?

arxvaldex:

I am having difficulty using any other PHP version than the ancient version 5.4
If I select any other version above 5.4 such as 7 all the way to 8.1 my site does not load at all (blank site without any error message)

Zen Cart Version 1.5.6c

In my cPanel I can set the PHP version in this menu:

MultiPHP Manager

System PHP Version
The system default PHP version is set by the system administrator.

Any domain that is set to the inherit value indicates that it does not have its own PHP version explicitly set. Read more about inherit.

Set PHP Version per Domain
Select the domains that you wish to change from the table, then apply a PHP version from the list.

Any help will be appreciated

That's definetely an old version. Have you checked your store/log directory to see what error messages are being written to the log files? That will usually indicate exactly why the screen is blank and help you narrow down the issue.

It's probably some outdated PHP function that is still being used by your older site but has been deprecated in more current versions.

Jeff_Mash:

But WHERE do I add that? This is the code that spits out the checkbox:

'<div class="custom-control custom-checkbox">' .
zen_draw_checkbox_field('permLogin', '1', $this->checkbox_default, 'id="permLogin"') .
'<label class="checkboxLabel" for="permLogin" title="' . TEXT_REMEMBER_ME_ALT . '">' . TEXT_REMEMBER_ME . '</label>' .
'</div>';

> 
> As you can see, there is no way to edit the "class value" for the zen_draw_checkbox_field() function in that line of code.
> 
> Now, I can APPEND a class value to it by doing this:
> 
> ```
zen_draw_checkbox_field('permLogin', '1', $this->checkbox_default, 'class="custom-control-label" id="permLogin"')

Then it only appends that class to the existing class like this (which still doesn't work):

<input type="checkbox" name="permLogin" value="1" checked="checked" class="custom-control-input custom-control-label" id="permLogin"> ``` > > The only way for it to work seems to be to change wherever zen_draw_checkbox_field() is getting that default "custom-control-input" when it outputs it. Where do we change THAT so that it can be something else? Change ``` '<label class="checkboxLabel" for="permLogin" title="' . TEXT_REMEMBER_ME_ALT . '">' . TEXT_REMEMBER_ME . '</label>' . ``` to ``` '<label class="[B]custom-control-label[/B] checkboxLabel" for="permLogin" title="' . TEXT_REMEMBER_ME_ALT . '">' . TEXT_REMEMBER_ME . '</label>' . ```

Have checked the Store Log the only errors are from AdminNotifications.php but these errors are with a running site on PHP 5.4
I have created an exact duplicate of my setup in another folder and will remove plugins one by one to source which is giving troubles on PHP 8

Thank you much appreciated