Responsive Classic (built in to Zen Cart v1.5.5) [Support Thread]

Quote:

---

Originally Posted by earmsby

I'm back with another issue I'm trying to resolve. Lot's of things I like about this template but am finding customizing it to be surprisingly tricky due all the different stylesheets and ways that javascript changes elements. Anyway, on to my current question/problem:

I'm working on resizing a few things in the heading of the product listing (on the desktop view only at this stage). The button for "Add Selected to Cart" was much too big and extended off to the right beyond the right edge of the containing div (note: it goes off the right right when the screen is narrowed a bit. It might not do that if you have a bigger screen resolution but I am on a fairly small sized laptop). It has a lot of padding that seemed a bit extreme to me (30px right and left). I was easily able to add a new css rule to my custom css to decrease that.

But on hover, the button pops back up to the huge size. I can see that this is due to the css in stylesheet_css_buttons.css:

Code:

---

input.submit_button:hover {border:none !important;font-size: 1.2em;display: inline-block;margin:0;padding: 12px 30px 30px 30px !important;}
input.cssButtonHover {border:none;cursor: pointer;border:none;font-size: 1.2em;display: inline-block;margin:0;padding: 12px 30px 30px 30px !important;}


---

I don't want to completely change this across the board. I'd like to target just this particular button which is causing the problem. My understanding is that you can override an !important rule by creating another rule with !important and greater specificity. So I added a style:

Code:

---

input#submit1.cssButtonHover.button_add_selected.button_add_selectedHover{
    padding: 5px 5px; !important;
}

---

But when the page renders, my custom style is still overridden by the original rule in stylesheet_css_buttons.css. I've tried multiple different ways to target the button in the hover state and override the !important rule but nothing seems to work.

I checked that my custom stylesheet loads later than stylesheet_css_buttons.css in the header and it appears to do so. Been banging my head on this for quite a while now.

Here's a link to the page I'm describing: http://subitomusic.com/testing_estor...dex&cPath=1_13

---

Code:

---

input#submit1.cssButtonHover.button_add_selected.button_add_selectedHover{
    padding: 5px 5px; !important;
}

---

This ";" causes a problem.

Code:

---

input#submit1.cssButtonHover.button_add_selected.button_add_selectedHover{
    padding: 5px 5px !important;
}

---

It will work.

Code:

---

#submit1.cssButtonHover {
    padding: 5px !important;
}

---

And this might be OK.

If you use Google Chrome, DevTools will help you to find which CSS class you need to override.
Attachment 18849

I posted a reply but it doesn't seem to be updated, so I post again.

Code:

---

input#submit1.cssButtonHover.button_add_selected.button_add_selectedHover{
    padding: 5px 5px; !important;
}

---

This ";" causes a problem.

Code:

---

input#submit1.cssButtonHover.button_add_selected.button_add_selectedHover{
    padding: 5px 5px !important;
}

---

It will work.

Code:

---

#submit1.cssButtonHover {
    padding: 5px !important;
}

---

And it may be OK.

If you use Google Chrome, DEVtools will help you to find which css class you need to override.
Attachment 18850

Quote:

---

Originally Posted by K1979

I posted a reply but it doesn't seem to be updated, so I post again.

Code:

---

input#submit1.cssButtonHover.button_add_selected.button_add_selectedHover{
    padding: 5px 5px; !important;
}

---

This ";" causes a problem.

---

Thank you! (Boy do I feel like an idiot - I should have spotted that issue)

FYI responsive has issues with hamburger not appearing in desktop chrome, ff, edge and IE while inspecting elements in responsive design mode.

Nobody ever notice this?

Quote:

---

Originally Posted by pixelpadre

FYI responsive has issues with hamburger not appearing in desktop chrome, ff, edge and IE while inspecting elements in responsive design mode.

Nobody ever notice this?

---

This does happen on first page load when the responsive emulator hasn't selected the phone type in mobile design mode. It hasn't happened recently while inspecting for me - as long as I've reloaded the page with the phone type set - however it did in the past and was related to java not running as it should on the fly while inspecting.

Is this happening on all sites you inspect?

Things get ugly looking in the inspector here:

https://twitchtoo.com/tR_codeSHOP/

- until you reload and find the red chevron that replaces the hamburger then everything works as it should.

Current fix:
- load webpage
- load responsive design mode
- click refresh or F5 in FireFox
- get back to work :smile:

Quote:

---

Originally Posted by twitchtoo

This does happen on first page load when the responsive emulator hasn't selected the phone type in mobile design mode. It hasn't happened recently while inspecting for me - as long as I've reloaded the page with the phone type set - however it did in the past and was related to java not running as it should on the fly while inspecting.

Is this happening on all sites you inspect?

Things get ugly looking in the inspector here:

https://twitchtoo.com/tR_codeSHOP/

- until you reload and find the red chevron that replaces the hamburger then everything works as it should. screenshot

Current fix:
- load webpage
- load responsive design mode
- click refresh or F5 in FireFox
- get back to work :smile:

---

Does not happen to my other non-zencart websites. Refresh makes no difference. twitchoo also not working in any desktop browser.

pixelpadre if you could pm or post the site(s) I can look a little deeper. One that works for you, one that doesn't would be great.

one that works, blackbirdtreetrimmer.com
one that doesnt blackbirdtreetrimmer.com/estimator

Quote:

---

Originally Posted by pixelpadre

one that works, blackbirdtreetrimmer.com
one that doesnt blackbirdtreetrimmer.com/estimator

---

Thanks - I am able to recreate the problem you are having with Edge. I'll do some testing and report back!

comparing apples to oranges pixelpadre...
Your one example page is a bootstrap html page and bootstrap is reponsive by default (no need to switch to the inspector to set device type, just resize browser) whereas the responsive classic requires device detection to determine if it is being displayed on a tablet/mobile device. Once a tablet/mobile device is detected it then different code is presented to the browser.

Code:

---

<!--bof navigation display-->
<div id="navMainWrapper" class="group onerow-fluid">
<?php
 if ( $detect->isMobile() && !$detect->isTablet() || $_SESSION['layoutType'] == 'mobile' ) {
echo '<div class="header Fixed"><a href="#menu" title="Menu"><i class="fa fa-bars"></i></a></div>';
 } else if ( $detect->isTablet() || $_SESSION['layoutType'] == 'tablet' ){
echo '<div class="header Fixed"><a href="#menu" title="Menu"><i class="fa fa-bars"></i></a></div>';
} else {
//
}
?>

---

I had no issues in any of the browsers see the bars in a mobile view, once I made sure I had "switched" device views, which in edge required going to the emulation tab and picking a mobile device

Quote:

---

Originally Posted by barco57

comparing apples to oranges pixelpadre...
Your one example page is a bootstrap html page and bootstrap is reponsive by default (no need to switch to the inspector to set device type, just resize browser) whereas the responsive classic requires device detection to determine if it is being displayed on a tablet/mobile device. Once a tablet/mobile device is detected it then different code is presented to the browser.

Code:

---

<!--bof navigation display-->
<div id="navMainWrapper" class="group onerow-fluid">
<?php
 if ( $detect->isMobile() && !$detect->isTablet() || $_SESSION['layoutType'] == 'mobile' ) {
echo '<div class="header Fixed"><a href="#menu" title="Menu"><i class="fa fa-bars"></i></a></div>';
 } else if ( $detect->isTablet() || $_SESSION['layoutType'] == 'tablet' ){
echo '<div class="header Fixed"><a href="#menu" title="Menu"><i class="fa fa-bars"></i></a></div>';
} else {
//
}


?>

---

I had no issues in any of the browsers see the bars in a mobile view, once I made sure I had "switched" device views, which in edge required going to the emulation tab and picking a mobile device

---

I realize that one is bootstrap and one isnt. But how was I supposed to a question "do you have one that works and one that doesn't"?

The fact remains that the browser drop the menu icon while browsers are in responsive modes. Its a problem. Is it a problem with other zencart responsive templates? I do not have the answer for that. I'm just reporting what I observed. What anyone cares to do about it is of no concern to me. Leave it or change it. Who cares. It's a defect as it stands. Template works as expected on all devices. But for developmental purposes, no good.

Okay. So I uploaded Tableau responsive. All browers in develop mode displayed the hamburger. So it appears the problem is limited to classic responsive. Any more tomatoes to throw at me?

...sigh

Quote:

---

Originally Posted by twitchtoo

Thanks - I am able to recreate the problem you are having with Edge. I'll do some testing and report back!

---

Times up!

Before I spend the time to move elements on the product info page around in a different order than they appear by default, I just want to make sure there isn't some way to do this differently, in admin say. I ask this because, after using ZenCart for years, I never knew that things could be reordered on the listing pages (all, new, featured, etc.)

As far as I can see all the options on the admin > config > product info screen are just on/off switches, not sort order. But it's entirely possible I've missed this area of admin all these years.

Thanks!

To move things around on the product info page, you'll need to modify the template file.

includes/templates/YOUR_TEMPLATE/templates/tpl_product_info_display.php

Quote:

---

Originally Posted by swguy

To move things around on the product info page, you'll need to modify the template file.

includes/templates/YOUR_TEMPLATE/templates/tpl_product_info_display.php

---

Ok, that's what I thought (and have done before for other clients). Just wanted to make sure I wasn't making things more difficult for myself. :cool:

Thanks for confirming!

Hi Guys , Is it possible to change how categories are displayed . Currently they are vertical but i want them left to right. Even better would to have boxes behind them. Made a rough picture for clarification . Any help appreciated :)

Attachment 18908

Configuration >> Layout Settings >> Categories-Tabs Menu ON/OFF

Set to 1 and adjust as necessary with CSS

I just got around to stepping through checkout using Chrome. God help me when I get around to Edge.

Forum search did not yield any CHROME responsive_classic results
Google search did not yield any Chrome responsive_classic results

zc156c
responsive_classic cloned
built-in checkout process

Desktop
Checkout payment: FireFox appears as expected except box not drawn around payment expiration date
Checkout payment: Chrome formatting all fouled up. Box not drawn around payment expiration date

Boxes weren't drawn around a couple of places when I used the phone
I have not gone mucking around in any of the css files (that I know of)

Attachment 18909Attachment 18910

Mentioned before is the addition of a <br /> on or around line 40 of includes/templates/template_default/templates/tpl_checkout_payment_default.php

There is a <br class="clearBoth"> just before the PAYPAL info.

Adding a <br /> after that first br will fix that problem. Or, you can install and use lat9's One Page Checkout.

All others are CSS fixes that we can't help with much without a link.

TNX dbltoe,

I'll make that edit. EDIT: that corrected the Chrome layout. The fix might have been mentioned before but if a search doesn't yield results, it is difficult to go through 17 pages of comments.
There's too much stuff to fix with the out of the box install, that I didn't want to exacerbate the issue by adding more plugins. OPC is on the list of things to do once everything else is corrected.

Link is in my signature

Neglected to say
156c install, drop db tables, restore live db, zcinstall

Clone a template
Responsive Classic color changes (tnx dbltoe)

Quote:

---

Originally Posted by RixStix

There's too much stuff to fix with the out of the box install, that I didn't want to exacerbate the issue by adding more plugins. OPC is on the list of things to do once everything else is corrected.

---

THANX
My point was that BOTH problems would go away with OPC. If you need assistance or clarification, NO ONE is quicker or better than lat9

Then maybe there needs to be a message to not use the built-in checkout because of bugs and to go straight to OPC. (sorry for the snark)
Better yet, include OPC with zc_install.

You and Cindy are two of a small handful that are top of my trustworthy list. TNX

:blush: To be listed in the same sentence as Cindy is an enormous compliment!

I feel your frustration as well. Haredo and I spent MANY hours trying to sort out the colors to get the color change mod going. It's nowhere near perfect. We find something new from time to time. The goal is to one day have the colors selectable in the admin for a more rapid development of a site's colors.

An undertaking the size of a template or Cindy's OPC is enormous. We all just try to come up with solutions as we run into them.

Such as https://www.zen-cart.com/showthread....ndard-Checkout

Just a small omission can make template or checkout a nightmare.

I wish I could send a lot of coffee to the developers but, I am just able to contribute in helping others with things while the devs do their magic.

Quote:

---

Originally Posted by RixStix

Then maybe there needs to be a message to not use the built-in checkout because of bugs and to go straight to OPC. (sorry for the snark)
Better yet, include OPC with zc_install.

You and Cindy are two of a small handful that are top of my trustworthy list. TNX

---

you are dead to me..... ;)

Quote:

---

Originally Posted by carlwhat

you are dead to me..... ;)

---

oh but you ARE in that list too. ;)

Hi all, looking for guidance here. Using 1.5.6 and currently working on the product listing pages. Having some trouble with the alignment/layout I'm trying to achieve. Please see https://thecoinauthority.com/index.p...x&cPath=81_1_3 for reference.

What I am hoping to achieve is more of a table layout with 3 columns--the first being the image, the second being the product title above and description below, and the third column being the price above and add to cart button below.

I have tried adjusting sort orders and other settings without much success. I want to keep the responsive aspect when viewing on a mobile device obviously, so building it as a table probably wouldn't allow that to happen (?), but not sure where to start/look to make the adjustments I'm looking for.

The other problem I'm having is that I cannot just get an Add To Cart button in lieu of the Qty box. I've changed those option settings as well but it doesn't change anything on the page. Any ideas what I'm doing wrong?

Thanks in advance!

Funny you should bring that up. Haredo and I have been working on this for a couple of days.

It's my belief that there is at least one missing </div> as the div#productGeneral .centerColumn call does not "engulf" the area it should when looking at the elements (right-click >> inspect)

Plus, were were working on getting the page setup so that the shop owner could have the options of setting the information up in different ways similar to the login page options lat9 put in the Log In page.

If you'd like to play along, you are welcome to play with what we have done to the file so far. NO GUARANTEES and MAKE SURE YOU BACKUP. Copy your includes/templates/YOUR_TEMPLATE/templates/tpl_product_info_display.php to includes/templates/YOUR_TEMPLATE/templates/tpl_product_info_display.mqc so that both files are in YOUR_TEMPLATE's templates directory. That will give you a fall back option.

The file we are working with is

Code:

---

<?php/**
 * Page Template
 *
 * Loaded automatically by index.php?main_page=product_info.<br />
 * Displays details of a typical product
 *
 * @package templateSystem
 * @copyright Copyright 2003-2020 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: dbltoe haredo Fri Apr 3 10:37:10 2020 -0400 Modified for 1.5.6c responsive_classic
 */


//require(DIR_WS_MODULES . '/debug_blocks/product_info_prices.php');
?>
<div class="centerColumn" id="productGeneral">


<!--bof Form start-->
<?php echo zen_draw_form('cart_quantity', zen_href_link(zen_get_info_page($_GET['products_id']), zen_get_all_get_params(array('action')) . 'action=add_product', $request_type), 'post', 'enctype="multipart/form-data"') . "\n"; ?>
<!--eof Form start-->


<?php if ($messageStack->size('product_info') > 0) echo $messageStack->output('product_info'); ?>


<!--bof Category Icon -->
<?php if ($module_show_categories != 0) {?>
<?php
/**
 * display the category icons
 */
require($template->get_template_dir('/tpl_modules_category_icon_display.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_category_icon_display.php'); ?>
<?php } ?>
<!--eof Category Icon -->


<!--bof Prev/Next top position -->
<?php if (PRODUCT_INFO_PREVIOUS_NEXT == 1 or PRODUCT_INFO_PREVIOUS_NEXT == 3) { ?>
<?php
/**
 * display the product previous/next helper
 */
require($template->get_template_dir('/tpl_products_next_previous.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_products_next_previous.php'); ?>
<?php } ?>
<!--eof Prev/Next top position-->


<div id="prod-info-top">
<!--bof Product Name-->
<h1 id="productName" class="productGeneral"><?php echo $products_name; ?></h1>
<!--eof Product Name-->
</div>
<div id="proTopWrapper">
<div id="pinfo-left" class="group">
<!--bof Main Product Image -->
<?php
  if (zen_not_null($products_image)) {
  ?>
<?php
/**
 * display the main product image
 */
  require($template->get_template_dir('/tpl_modules_main_product_image.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_main_product_image.php'); ?>
<?php
  }
?>
<!--eof Main Product Image-->


<!--bof Additional Product Images -->
<?php
/**
 * display the products additional images
 */
  require($template->get_template_dir('/tpl_modules_additional_images.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_additional_images.php'); ?>
<!--eof Additional Product Images -->
</div>
<div id="proDescWrapper">
<!--bof Product description -->
<?php if ($products_description != '') { ?>
<div id="productDescription" class="productGeneral biggerText"><?php echo stripslashes($products_description); ?></div>
<?php } ?>
<!--eof Product description -->
</div>
</div>
<div id="proBottomWrapper">
<div id="cart-boxWrapper">
<div id="cart-box" class="grids">
<h2 id="productPrices" class="productGeneral">
<?php
// base price
  if ($show_onetime_charges_description == 'true') {
    $one_time = '<span >' . TEXT_ONETIME_CHARGE_SYMBOL . TEXT_ONETIME_CHARGE_DESCRIPTION . '</span><br />';
  } else {
    $one_time = '';
  }
  echo $one_time . ((zen_has_product_attributes_values((int)$_GET['products_id']) and $flag_show_product_info_starting_at == 1) ? TEXT_BASE_PRICE : '') . zen_get_products_display_price((int)$_GET['products_id']);
?></h2>
<!--eof Product Price block -->


<!--bof Attributes Module -->
<?php
  if ($pr_attr->fields['total'] > 0) {
?>
<?php
/**
 * display the product atributes
 */
  require($template->get_template_dir('/tpl_modules_attributes.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_attributes.php'); ?>
<?php
  }
?>
<!--eof Attributes Module -->


<!--bof Quantity Discounts table -->
<?php
  if ($products_discount_type != 0) { ?>
<?php
/**
 * display the products quantity discount
 */
 require($template->get_template_dir('/tpl_modules_products_quantity_discounts.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_products_quantity_discounts.php'); ?>
<?php
  }
?>
<!--eof Quantity Discounts table -->


<!--bof Add to Cart Box -->
<?php
if (CUSTOMERS_APPROVAL == 3 and TEXT_LOGIN_FOR_PRICE_BUTTON_REPLACE_SHOWROOM == '') {
  // do nothing
} else {
?>
<?php
    $display_qty = (($flag_show_product_info_in_cart_qty == 1 and $_SESSION['cart']->in_cart($_GET['products_id'])) ? '<p>' . PRODUCTS_ORDER_QTY_TEXT_IN_CART . $_SESSION['cart']->get_quantity($_GET['products_id']) . '</p>' : '');
    if ($products_qty_box_status == 0 or $products_quantity_order_max== 1) {
      // hide the quantity box and default to 1
      $the_button = '<input type="hidden" name="cart_quantity" value="1" />' . zen_draw_hidden_field('products_id', (int)$_GET['products_id']) . zen_image_submit(BUTTON_IMAGE_IN_CART, BUTTON_IN_CART_ALT);
    } else {
      // show the quantity box
      $the_button = '<div class="max-qty">' . zen_get_products_quantity_min_units_display((int)$_GET['products_id']) . '</div><span class="qty-text">' . PRODUCTS_ORDER_QTY_TEXT . '</span><input type="text" name="cart_quantity" value="' . $products_get_buy_now_qty . '" maxlength="6" size="4" />' . zen_draw_hidden_field('products_id', (int)$_GET['products_id']) . zen_image_submit(BUTTON_IMAGE_IN_CART, BUTTON_IN_CART_ALT);
    }
    $display_button = zen_get_buy_now_button($_GET['products_id'], $the_button);
?>
<?php if ($display_qty != '' or $display_button != '') { ?>
    <div id="cartAdd">
    <?php
      echo $display_qty;
      echo $display_button;
?>
          </div>
<?php  } // display qty and button ?>
<?php } // CUSTOMERS_APPROVAL == 3 ?>
<!--eof Add to Cart Box-->
</div>
</div>
<div id="pinfo-right" class="group grids">
<!--bof Product Price block -->
<!--bof Product details list  -->
<?php if ( (($flag_show_product_info_model == 1 and $products_model != '') or ($flag_show_product_info_weight == 1 and $products_weight !=0) or ($flag_show_product_info_quantity == 1) or ($flag_show_product_info_manufacturer == 1 and !empty($manufacturers_name))) ) { ?>
<ul id="productDetailsList">
  <?php echo (($flag_show_product_info_model == 1 and $products_model !='') ? '<li>' . TEXT_PRODUCT_MODEL . $products_model . '</li>' : '') . "\n"; ?>
  <?php echo (($flag_show_product_info_weight == 1 and $products_weight !=0) ? '<li>' . TEXT_PRODUCT_WEIGHT .  $products_weight . TEXT_PRODUCT_WEIGHT_UNIT . '</li>'  : '') . "\n"; ?>
  <?php echo (($flag_show_product_info_quantity == 1) ? '<li>' . $products_quantity . TEXT_PRODUCT_QUANTITY . '</li>'  : '') . "\n"; ?>
  <?php echo (($flag_show_product_info_manufacturer == 1 and !empty($manufacturers_name)) ? '<li>' . TEXT_PRODUCT_MANUFACTURER . $manufacturers_name . '</li>' : '') . "\n"; ?>
</ul>
<?php
  }
?>
<!--eof Product details list -->


<!--bof free ship icon  -->
<?php if(zen_get_product_is_always_free_shipping($products_id_current) && $flag_show_product_info_free_shipping) { ?>
<div id="freeShippingIcon"><?php echo TEXT_PRODUCT_FREE_SHIPPING_ICON; ?></div>
<?php } ?>
<!--eof free ship icon  -->
</div>
</div>


</div>


<!--bof Prev/Next bottom position -->
<?php if (PRODUCT_INFO_PREVIOUS_NEXT == 2 or PRODUCT_INFO_PREVIOUS_NEXT == 3) { ?>
<?php
/**
 * display the product previous/next helper
 */
 require($template->get_template_dir('/tpl_products_next_previous.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_products_next_previous.php'); ?>
<?php } ?>
<!--eof Prev/Next bottom position -->


<!--bof Reviews button and count-->
<?php
  if ($flag_show_product_info_reviews == 1) {
    // if more than 0 reviews, then show reviews button; otherwise, show the "write review" button
    if ($reviews->fields['count'] > 0 ) { ?>
<div id="productReviewLink" class="buttonRow back"><?php echo '<a href="' . zen_href_link(FILENAME_PRODUCT_REVIEWS, zen_get_all_get_params()) . '">' . zen_image_button(BUTTON_IMAGE_REVIEWS, BUTTON_REVIEWS_ALT) . '</a>'; ?></div>
<br class="clearBoth" />
<p class="reviewCount"><?php echo ($flag_show_product_info_reviews_count == 1 ? TEXT_CURRENT_REVIEWS . ' ' . $reviews->fields['count'] : ''); ?></p>
<?php } else { ?>
<div id="productReviewLink" class="buttonRow back"><?php echo '<a href="' . zen_href_link(FILENAME_PRODUCT_REVIEWS_WRITE, zen_get_all_get_params(array())) . '">' . zen_image_button(BUTTON_IMAGE_WRITE_REVIEW, BUTTON_WRITE_REVIEW_ALT) . '</a>'; ?></div>
<br class="clearBoth" />
<?php
  }
}
?>
<!--eof Reviews button and count -->




<!--bof Product date added/available-->
<?php
  if ($products_date_available > date('Y-m-d H:i:s')) {
    if ($flag_show_product_info_date_available == 1) {
?>
  <p id="productDateAvailable" class="productGeneral centeredContent"><?php echo sprintf(TEXT_DATE_AVAILABLE, zen_date_long($products_date_available)); ?></p>
<?php
    }
  } else {
    if ($flag_show_product_info_date_added == 1) {
?>
      <p id="productDateAdded" class="productGeneral centeredContent"><?php echo sprintf(TEXT_DATE_ADDED, zen_date_long($products_date_added)); ?></p>
<?php
    } // $flag_show_product_info_date_added
  }
?>
<!--eof Product date added/available -->


<!--bof Product URL -->
<?php
  if (zen_not_null($products_url)) {
    if ($flag_show_product_info_url == 1) {
?>
    <p id="productInfoLink" class="productGeneral centeredContent"><?php echo sprintf(TEXT_MORE_INFORMATION, zen_href_link(FILENAME_REDIRECT, 'action=product&products_id=' . zen_output_string_protected($_GET['products_id']), 'NONSSL', true, false)); ?></p>
<?php
    } // $flag_show_product_info_url
  }
?>
<!--eof Product URL -->


<!--bof also purchased products module-->
<?php require($template->get_template_dir('tpl_modules_also_purchased_products.php', DIR_WS_TEMPLATE, $current_page_base,'templates'). '/' . 'tpl_modules_also_purchased_products.php');?>
<!--eof also purchased products module-->


<!--eof Form close-->
</form>
<!--bof Form close-->
</div>

---

This is the complete file.

It is setup so that there are now some extra wrappers. #proTopWrapper with a #proDescWrapper inside it, and #proBottomWrapper

#proTopWrapper and #proBottomWrapper are there to establish basically a box with four equal squares. Upper left and upper right are in the #proTopWrapper. Lower left and lower right are in the #proBottomWrapper.

In the upper left, we have the product image and the additional images. In the upper right is the Product Description.

In the lower left is the cart-box which holds the attribute selections, price display, and add-to-cart button. In the lower right is the info-right which contains the review button, etc.

By manipulating the css with floats and widths, you can better control the display with this setup.

Again, a work in progress that can be seen at haredo.com.

Note that all the CSS changes are in the stylesheet_zcustom.css and labeled

Hi Guys , I have asked this question before but it was a bit confusing , so I added another picture .Is it possible to change how categories are displayed . Currently they are vertical but i want them left to right. Even better would to have boxes behind them. Made a rough picture for clarification . Any help appreciated :)
Attachment 18920


How I would like it to look !

Attachment 18921

Thanks for the reply! I'll play around with this some, but if I'm not mistaken this is for the product info page, rather than the product listing page? I may just need to do something similar and add some extra <div> tags to get the effect I want, but to be honest I'm not the most savvy when it comes to this. Not sure if doing floats or setting widths, etc. would accomplish the same effect without having to modify core files. If I can figure it out I'll post back, or in the meantime if you make some more progress and want to share please do so. :smile: Thanks!

Quote:

---

Originally Posted by dbltoe

Funny you should bring that up. Haredo and I have been working on this for a couple of days.

It's my belief that there is at least one missing </div> as the div#productGeneral .centerColumn call does not "engulf" the area it should when looking at the elements (right-click >> inspect)

Plus, were were working on getting the page setup so that the shop owner could have the options of setting the information up in different ways similar to the login page options lat9 put in the Log In page.

If you'd like to play along, you are welcome to play with what we have done to the file so far. NO GUARANTEES and MAKE SURE YOU BACKUP. Copy your includes/templates/YOUR_TEMPLATE/templates/tpl_product_info_display.php to includes/templates/YOUR_TEMPLATE/templates/tpl_product_info_display.mqc so that both files are in YOUR_TEMPLATE's templates directory. That will give you a fall back option.

The file we are working with is

Code:

---

<?php/**
 * Page Template
 *
 * Loaded automatically by index.php?main_page=product_info.<br />
 * Displays details of a typical product
 *
 * @package templateSystem
 * @copyright Copyright 2003-2020 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: dbltoe haredo Fri Apr 3 10:37:10 2020 -0400 Modified for 1.5.6c responsive_classic
 */


//require(DIR_WS_MODULES . '/debug_blocks/product_info_prices.php');
?>
<div class="centerColumn" id="productGeneral">


<!--bof Form start-->
<?php echo zen_draw_form('cart_quantity', zen_href_link(zen_get_info_page($_GET['products_id']), zen_get_all_get_params(array('action')) . 'action=add_product', $request_type), 'post', 'enctype="multipart/form-data"') . "\n"; ?>
<!--eof Form start-->


<?php if ($messageStack->size('product_info') > 0) echo $messageStack->output('product_info'); ?>


<!--bof Category Icon -->
<?php if ($module_show_categories != 0) {?>
<?php
/**
 * display the category icons
 */
require($template->get_template_dir('/tpl_modules_category_icon_display.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_category_icon_display.php'); ?>
<?php } ?>
<!--eof Category Icon -->


<!--bof Prev/Next top position -->
<?php if (PRODUCT_INFO_PREVIOUS_NEXT == 1 or PRODUCT_INFO_PREVIOUS_NEXT == 3) { ?>
<?php
/**
 * display the product previous/next helper
 */
require($template->get_template_dir('/tpl_products_next_previous.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_products_next_previous.php'); ?>
<?php } ?>
<!--eof Prev/Next top position-->


<div id="prod-info-top">
<!--bof Product Name-->
<h1 id="productName" class="productGeneral"><?php echo $products_name; ?></h1>
<!--eof Product Name-->
</div>
<div id="proTopWrapper">
<div id="pinfo-left" class="group">
<!--bof Main Product Image -->
<?php
  if (zen_not_null($products_image)) {
  ?>
<?php
/**
 * display the main product image
 */
  require($template->get_template_dir('/tpl_modules_main_product_image.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_main_product_image.php'); ?>
<?php
  }
?>
<!--eof Main Product Image-->


<!--bof Additional Product Images -->
<?php
/**
 * display the products additional images
 */
  require($template->get_template_dir('/tpl_modules_additional_images.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_additional_images.php'); ?>
<!--eof Additional Product Images -->
</div>
<div id="proDescWrapper">
<!--bof Product description -->
<?php if ($products_description != '') { ?>
<div id="productDescription" class="productGeneral biggerText"><?php echo stripslashes($products_description); ?></div>
<?php } ?>
<!--eof Product description -->
</div>
</div>
<div id="proBottomWrapper">
<div id="cart-boxWrapper">
<div id="cart-box" class="grids">
<h2 id="productPrices" class="productGeneral">
<?php
// base price
  if ($show_onetime_charges_description == 'true') {
    $one_time = '<span >' . TEXT_ONETIME_CHARGE_SYMBOL . TEXT_ONETIME_CHARGE_DESCRIPTION . '</span><br />';
  } else {
    $one_time = '';
  }
  echo $one_time . ((zen_has_product_attributes_values((int)$_GET['products_id']) and $flag_show_product_info_starting_at == 1) ? TEXT_BASE_PRICE : '') . zen_get_products_display_price((int)$_GET['products_id']);
?></h2>
<!--eof Product Price block -->


<!--bof Attributes Module -->
<?php
  if ($pr_attr->fields['total'] > 0) {
?>
<?php
/**
 * display the product atributes
 */
  require($template->get_template_dir('/tpl_modules_attributes.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_attributes.php'); ?>
<?php
  }
?>
<!--eof Attributes Module -->


<!--bof Quantity Discounts table -->
<?php
  if ($products_discount_type != 0) { ?>
<?php
/**
 * display the products quantity discount
 */
 require($template->get_template_dir('/tpl_modules_products_quantity_discounts.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_products_quantity_discounts.php'); ?>
<?php
  }
?>
<!--eof Quantity Discounts table -->


<!--bof Add to Cart Box -->
<?php
if (CUSTOMERS_APPROVAL == 3 and TEXT_LOGIN_FOR_PRICE_BUTTON_REPLACE_SHOWROOM == '') {
  // do nothing
} else {
?>
<?php
    $display_qty = (($flag_show_product_info_in_cart_qty == 1 and $_SESSION['cart']->in_cart($_GET['products_id'])) ? '<p>' . PRODUCTS_ORDER_QTY_TEXT_IN_CART . $_SESSION['cart']->get_quantity($_GET['products_id']) . '</p>' : '');
    if ($products_qty_box_status == 0 or $products_quantity_order_max== 1) {
      // hide the quantity box and default to 1
      $the_button = '<input type="hidden" name="cart_quantity" value="1" />' . zen_draw_hidden_field('products_id', (int)$_GET['products_id']) . zen_image_submit(BUTTON_IMAGE_IN_CART, BUTTON_IN_CART_ALT);
    } else {
      // show the quantity box
      $the_button = '<div class="max-qty">' . zen_get_products_quantity_min_units_display((int)$_GET['products_id']) . '</div><span class="qty-text">' . PRODUCTS_ORDER_QTY_TEXT . '</span><input type="text" name="cart_quantity" value="' . $products_get_buy_now_qty . '" maxlength="6" size="4" />' . zen_draw_hidden_field('products_id', (int)$_GET['products_id']) . zen_image_submit(BUTTON_IMAGE_IN_CART, BUTTON_IN_CART_ALT);
    }
    $display_button = zen_get_buy_now_button($_GET['products_id'], $the_button);
?>
<?php if ($display_qty != '' or $display_button != '') { ?>
    <div id="cartAdd">
    <?php
      echo $display_qty;
      echo $display_button;
?>
          </div>
<?php  } // display qty and button ?>
<?php } // CUSTOMERS_APPROVAL == 3 ?>
<!--eof Add to Cart Box-->
</div>
</div>
<div id="pinfo-right" class="group grids">
<!--bof Product Price block -->
<!--bof Product details list  -->
<?php if ( (($flag_show_product_info_model == 1 and $products_model != '') or ($flag_show_product_info_weight == 1 and $products_weight !=0) or ($flag_show_product_info_quantity == 1) or ($flag_show_product_info_manufacturer == 1 and !empty($manufacturers_name))) ) { ?>
<ul id="productDetailsList">
  <?php echo (($flag_show_product_info_model == 1 and $products_model !='') ? '<li>' . TEXT_PRODUCT_MODEL . $products_model . '</li>' : '') . "\n"; ?>
  <?php echo (($flag_show_product_info_weight == 1 and $products_weight !=0) ? '<li>' . TEXT_PRODUCT_WEIGHT .  $products_weight . TEXT_PRODUCT_WEIGHT_UNIT . '</li>'  : '') . "\n"; ?>
  <?php echo (($flag_show_product_info_quantity == 1) ? '<li>' . $products_quantity . TEXT_PRODUCT_QUANTITY . '</li>'  : '') . "\n"; ?>
  <?php echo (($flag_show_product_info_manufacturer == 1 and !empty($manufacturers_name)) ? '<li>' . TEXT_PRODUCT_MANUFACTURER . $manufacturers_name . '</li>' : '') . "\n"; ?>
</ul>
<?php
  }
?>
<!--eof Product details list -->


<!--bof free ship icon  -->
<?php if(zen_get_product_is_always_free_shipping($products_id_current) && $flag_show_product_info_free_shipping) { ?>
<div id="freeShippingIcon"><?php echo TEXT_PRODUCT_FREE_SHIPPING_ICON; ?></div>
<?php } ?>
<!--eof free ship icon  -->
</div>
</div>


</div>


<!--bof Prev/Next bottom position -->
<?php if (PRODUCT_INFO_PREVIOUS_NEXT == 2 or PRODUCT_INFO_PREVIOUS_NEXT == 3) { ?>
<?php
/**
 * display the product previous/next helper
 */
 require($template->get_template_dir('/tpl_products_next_previous.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_products_next_previous.php'); ?>
<?php } ?>
<!--eof Prev/Next bottom position -->


<!--bof Reviews button and count-->
<?php
  if ($flag_show_product_info_reviews == 1) {
    // if more than 0 reviews, then show reviews button; otherwise, show the "write review" button
    if ($reviews->fields['count'] > 0 ) { ?>
<div id="productReviewLink" class="buttonRow back"><?php echo '<a href="' . zen_href_link(FILENAME_PRODUCT_REVIEWS, zen_get_all_get_params()) . '">' . zen_image_button(BUTTON_IMAGE_REVIEWS, BUTTON_REVIEWS_ALT) . '</a>'; ?></div>
<br class="clearBoth" />
<p class="reviewCount"><?php echo ($flag_show_product_info_reviews_count == 1 ? TEXT_CURRENT_REVIEWS . ' ' . $reviews->fields['count'] : ''); ?></p>
<?php } else { ?>
<div id="productReviewLink" class="buttonRow back"><?php echo '<a href="' . zen_href_link(FILENAME_PRODUCT_REVIEWS_WRITE, zen_get_all_get_params(array())) . '">' . zen_image_button(BUTTON_IMAGE_WRITE_REVIEW, BUTTON_WRITE_REVIEW_ALT) . '</a>'; ?></div>
<br class="clearBoth" />
<?php
  }
}
?>
<!--eof Reviews button and count -->




<!--bof Product date added/available-->
<?php
  if ($products_date_available > date('Y-m-d H:i:s')) {
    if ($flag_show_product_info_date_available == 1) {
?>
  <p id="productDateAvailable" class="productGeneral centeredContent"><?php echo sprintf(TEXT_DATE_AVAILABLE, zen_date_long($products_date_available)); ?></p>
<?php
    }
  } else {
    if ($flag_show_product_info_date_added == 1) {
?>
      <p id="productDateAdded" class="productGeneral centeredContent"><?php echo sprintf(TEXT_DATE_ADDED, zen_date_long($products_date_added)); ?></p>
<?php
    } // $flag_show_product_info_date_added
  }
?>
<!--eof Product date added/available -->


<!--bof Product URL -->
<?php
  if (zen_not_null($products_url)) {
    if ($flag_show_product_info_url == 1) {
?>
    <p id="productInfoLink" class="productGeneral centeredContent"><?php echo sprintf(TEXT_MORE_INFORMATION, zen_href_link(FILENAME_REDIRECT, 'action=product&products_id=' . zen_output_string_protected($_GET['products_id']), 'NONSSL', true, false)); ?></p>
<?php
    } // $flag_show_product_info_url
  }
?>
<!--eof Product URL -->


<!--bof also purchased products module-->
<?php require($template->get_template_dir('tpl_modules_also_purchased_products.php', DIR_WS_TEMPLATE, $current_page_base,'templates'). '/' . 'tpl_modules_also_purchased_products.php');?>
<!--eof also purchased products module-->


<!--eof Form close-->
</form>
<!--bof Form close-->
</div>

---

This is the complete file.

It is setup so that there are now some extra wrappers. #proTopWrapper with a #proDescWrapper inside it, and #proBottomWrapper

#proTopWrapper and #proBottomWrapper are there to establish basically a box with four equal squares. Upper left and upper right are in the #proTopWrapper. Lower left and lower right are in the #proBottomWrapper.

In the upper left, we have the product image and the additional images. In the upper right is the Product Description.

In the lower left is the cart-box which holds the attribute selections, price display, and add-to-cart button. In the lower right is the info-right which contains the review button, etc.

By manipulating the css with floats and widths, you can better control the display with this setup.

Again, a work in progress that can be seen at haredo.com.

Note that all the CSS changes are in the stylesheet_zcustom.css and labeled

---

https://www.w3schools.com/howto/tryi...olumns_unequal shows how to start what you are wanting to do. There are some additions to the process that are not listed as this example is how to control the CSS.

First, you will want to establish some parameters in the actual file. You can start by adding this code above the cat81_1_3List div

Code:

---

<div id="svdbWrapper">
    <div class="svdbImage">
        Place code for the image here.
    </div>
    <div id="svdbProdInfoWrapper">
        <div class="svdbTitle">
            Place the code for the Product's Title here.
        </div>
        <div class="svdbDesc">
            Place the code for the Product's Description here.
        </div>
    </div>
    <div id="svdbPriceAddWrapper">
        <div class="svdbPrice">
            Place the code for the Product's Price here.
        </div>
        <div class="svdbCartButton">
            Place the code for the Product's ATC button here.
        </div>
    </div>
</div>

---

This will get the framework up for what you want to do without changing what you have.

Next, you can copy the corresponding code from your original and replace the red items above with your site's code. Copy the old rather than delete it in order to have a fall back.

When through, you should have two examples of the listing: the original and your new trial.

The svdbWrapper would be width:100%
The svdbimage, svdbProdInfoWrapper, and the svdbCartButton would be something like width:20%, width:50%, and width:30% respectively. This establishes your three-column layout and can easily be adjusted with the CSS later.

That should get you a little closer to what you are after.

Thank you! I think this has gotten me much closer to the design I want. Now that I have the formatting, I'm having trouble getting the layout to remain responsive as the window shrinks. Can you identify what I'm doing wrong?

https://thecoinauthority.com/index.p...x&cPath=81_1_3

As the window shrinks I want it to go vertical, with the image on top, title and description in the next row, and the price/add to cart button in the third row, rather than retain the horizontal layout.

The other issue (and not sure if this is new or not), but when I click Add to Cart, it doesn't add anything. Thoughts on where to start troubleshooting that issue?

Thanks again!

Quote:

---

Originally Posted by dbltoe

https://www.w3schools.com/howto/tryi...olumns_unequal shows how to start what you are wanting to do. There are some additions to the process that are not listed as this example is how to control the CSS.

First, you will want to establish some parameters in the actual file. You can start by adding this code above the cat81_1_3List div

Code:

---

<div id="svdbWrapper">
    <div class="svdbImage">
        Place code for the image here.
    </div>
    <div id="svdbProdInfoWrapper">
        <div class="svdbTitle">
            Place the code for the Product's Title here.
        </div>
        <div class="svdbDesc">
            Place the code for the Product's Description here.
        </div>
    </div>
    <div id="svdbPriceAddWrapper">
        <div class="svdbPrice">
            Place the code for the Product's Price here.
        </div>
        <div class="svdbCartButton">
            Place the code for the Product's ATC button here.
        </div>
    </div>
</div>

---

This will get the framework up for what you want to do without changing what you have.

Next, you can copy the corresponding code from your original and replace the red items above with your site's code. Copy the old rather than delete it in order to have a fall back.

When through, you should have two examples of the listing: the original and your new trial.

The svdbWrapper would be width:100%
The svdbimage, svdbProdInfoWrapper, and the svdbCartButton would be something like width:20%, width:50%, and width:30% respectively. This establishes your three-column layout and can easily be adjusted with the CSS later.

That should get you a little closer to what you are after.

---

Re: ATC. - When I go to add to cart on the product info page it redirects to timeout. Check your configure.php values. Both HTTP and HTTPS server should be "https" with same domain (both no www).

Disregard--your suggestion fixed the problem with ATC. Thank you!

Quote:

---

Originally Posted by swguy

Re: ATC. - When I go to add to cart on the product info page it redirects to timeout. Check your configure.php values. Both HTTP and HTTPS server should be "https" with same domain (both no www).

---

OK go to Admin > Configuration > Sessions and check the values. See also

https://docs.zen-cart.com/user/troub...gged_in_admin/

I was being stupid and forgot to change the write permissions of the config files when editing it. Didn't realize it wasn't saving my changes. So far so good with the ATC. Still playing around with formatting to resolve my responsive layout issues :-)
Thanks again!

Can't be more specific with the site down for maintenance.

There are a couple of ways to handle movement of wrappers for responsive.

What I recommend is getting it to look correctly at something around 1600px or better.

Then, look at your site for an iphone 6, 6+, and ipad in portrait. There you will see any changes you need to make in responsive_mobile.css for the portrait.


Yesterday was review page day at silversageherbsDOTcom. The reviews page is setup almost exactly like what I got from your description. The only thing we changed on the page was a float:right; for the buttons. You can inspect and turn them off and on to see the diff.

When we looked at the page in mobile portrait, the only thing we felt needed to be changed was to justify the text.

You can take a look at that page for another possible way to your solution.

Sorry about that--I've removed the maintenance mode. I think I've managed to figure out my responsive issues, at least with the formatting for the listing page. I'm pretty sure I need to add at least one more <div> element, as I currently have a % set for each div and depending on the screen size it either fills the right amount of space or not enough. I'm guessing I need one more div element to help ensure the widths of each subsequent div fill the entire space. If I can't figure that piece out, the way it's set up is at least close enough to where I wanted it.

However, the newest issue I've noticed is that as I shrink the screen size, the left menus (leftboxcontainers) become so narrow that the text overflows and doesn't look right. If I adjust the width in Layout Settings, the box looks better, but then in full-screen mode it is approximately 1.5x as wide as I want it. The issue seems to be with the responsive.css and % for each col group. Is there an easy way to set a min-width for the left boxes so that regardless of screen size they won't shrink beyond a set pixel amount (say 200px)? At a certain size I convert it to the hamburger menu, but there's that in-between size I still want the menu to appear.

Thank you!

Quote:

---

Originally Posted by dbltoe

Can't be more specific with the site down for maintenance.

There are a couple of ways to handle movement of wrappers for responsive.

What I recommend is getting it to look correctly at something around 1600px or better.

Then, look at your site for an iphone 6, 6+, and ipad in portrait. There you will see any changes you need to make in responsive_mobile.css for the portrait.


Yesterday was review page day at silversageherbsDOTcom. The reviews page is setup almost exactly like what I got from your description. The only thing we changed on the page was a float:right; for the buttons. You can inspect and turn them off and on to see the diff.

When we looked at the page in mobile portrait, the only thing we felt needed to be changed was to justify the text.

You can take a look at that page for another possible way to your solution.

---

I may have solved my own problem and hopefully didn't screw anything else up in the process. What I did was build in a specific width for .col150 (the column that houses the left boxes) and then used the calc function for the centercolumn to be 100% less the desired pixel width of the leftboxcontainer. I'm still playing with the responsive stylesheet to determine the right point to convert to the hamburger menu, but for now it appears that it achieves the look I wanted. Can anyone see a downside to doing it this way that I should be aware of before I continue building the site? All advice/suggestions appreciated, as always.

Quote:

---

Originally Posted by mcqueeneycoins

However, the newest issue I've noticed is that as I shrink the screen size, the left menus (leftboxcontainers) become so narrow that the text overflows and doesn't look right. If I adjust the width in Layout Settings, the box looks better, but then in full-screen mode it is approximately 1.5x as wide as I want it. The issue seems to be with the responsive.css and % for each col group. Is there an easy way to set a min-width for the left boxes so that regardless of screen size they won't shrink beyond a set pixel amount (say 200px)? At a certain size I convert it to the hamburger menu, but there's that in-between size I still want the menu to appear.

---

Our procedure is generally to get what we want on full screen. All those css changes would go in the stylesheet_zcustom.css There is no need to touch any other stylesheet for this.

Next, respsonsive_mobile.css in the bottom of the portrait portion to fix minor items needed for portrait mobiles. Then the same for the landscape mobile.

Next, is the responsive_tablet.css in portrait in landscape.

Only then do we start looking at the desktop changes that happen at various widths. If any changes are needed at various widths above those covered by mobile or tablet, we make those in responsive_default.css.

It's always good to enter something to make it easy to find your changes when you need them later. Something like

Code:

---

/*  SVDB  */

---

can be added on the line that you change or add.

This may or may not be related to the responsive template, but again hoping someone can help me troubleshoot the latest issue I'm having with the product listing page. When all products are in stock (and not marked call for price) the page looks exactly how I want. When a product is sold out or marked call for price, the background fills the space and I'm having trouble pinpointing what changes I need to make to fix it. What I really would like is to remove the "more info" link altogether and turn the "Sold Out" button into a link that takes you to the product details. Same with Call for price, except have the Call for Price button take you to the Contact us page. TIA!

https://thecoinauthority.com/index.p...1_1_3&sort=20a

Your background is controlled by the CSS and, it appears that you've dropped the call for the child. Sometimes called odd - even, sometimes parent - child.

Moreover, I'm concerned about your color choices. Check out https://contrast-ratio.com/#black-on-blue to see what your text looks like on the blue. Then click the swap colors button. Note that both options are less than 3 on the contrast scale. Change the black to white and note the difference.

Blue is a well-liked color by both male and female, but they both need to be able to read the text.

This is one of the major hits (along with font size) for mobiles and tablets.

Finally, what is your Product status in Catalog in the admin >> Configuration >> Stock, sixth item down.

Thanks for taking a look--I'll try to see what I may have left off. With regards to the contrast, the background should be White, not blue. That's the issue. When I set the qty to 0 (sold out) or call for price, that's when the background changes to blue like that. When i use the contrast tool using the blue text on white background i get 7.9, so I think as long as I can resolve the background issue it will be better. I just changed the product quantity for the 2nd item back to 1 (not sold out anymore) and you can see what I want the site to look like. I didn't make any css changes since my last post, only updated the # in stock resulting in this change. Maybe it will help narrow down the cause?

For configuration settings, they are as follows:

Product status = 1
Show Sold Out = 1

Thanks again!

I think I figured it out after a lot of trial and error--realized I was missing a </div> tag, but needed to add it on the functions_general.php instead of the product_listing.php which is why I wasn't connecting the dots sooner. As far as turning the Sold Out button into a link to the product page, I think I am just going to change ...more info into a similarly styled button and just change the text to Sold Out, then use the display:none on the original Sold Out styling.

So..I've been told maybe the html_header.php ...or..... the tpl_main_page.php is corrupted in some way in that the first page of
http://www.candyground.com
is not loading correctly...(maybe I need to load clean copies of html_header.php ...and.... the tpl_main_page.php ? ......WHERE TO GET THESE?

the top line ...where home | log in | shopping cart is........
the black line at the top should be wider?
I didnt change the width or anything....it might have changed after I added the slideshow....
but i removed the slideshow and it's still the same...
any ideas how to fix?

Quote:

---

Originally Posted by lrfowler24

... maybe I need to load clean copies of html_header.php ...and.... the tpl_main_page.php ? ......WHERE TO GET THESE?

---

Download a fresh copy of Zen Cart from https://www.zen-cart.com/latest

Keep that in a folder and make it read-only so you can't change it. Then you'll know that's a pristine image of your version, and you can always compare against that or use that as a source of files if things get messed up.

thanks for the great idea.....
html_header.php ...and..... the tpl_main_page.php are identical to the copies I have in the template folder and the newly downlaoded zencart folder .
what other problem might be the reason for the first page of www.candygoround.com to be messed up....
the product pages seem OK.

Are you sure it's 100% identical? As I mentioned in the other thread, it might be file encoding issue. Can you try the following, please:
#1 - rename your includes/templates/responsive_classic/common dirrectory to common_old (you're just making a backup)
#2 - upload includes/templates/responsive_classic/common from an original file set to the directory above
Refresh the page and see what happens.

Quote:

---

Originally Posted by balihr

Are you sure it's 100% identical? As I mentioned in the other thread, it might be file encoding issue. Can you try the following, please:
#1 - rename your includes/templates/responsive_classic/common dirrectory to common_old (you're just making a backup)
#2 - upload includes/templates/responsive_classic/common from an original file set to the directory above
Refresh the page and see what happens.

---

hello....thanks for replying....
I did as you suggested ...renaming and adding a new common folder...
but it didnt fix it...
How about I reload the responsive_classic template?.......how do I do that?
just move folders over ?

Is there a way to use the responsive_classic as the template default and then have a custom template that overrides responsive_classic ?

Thanks

Responsive Classic is the default template. Here's our recommendation if you are going to use Responsive Classic:

1. Start with Zen Cart and unmodified responsive_classic (hereafter RC)
2. Use lat9's clone a template to clone RC to responsive_base (hereafter RB)
3. Use the color change mod to create your colors in RB
4. Clone the color-changed RB to YOUR_TEMPLATE (where YOUR_TEMPLATE is whatever name you want for a final template.)
5. Proceed to make changes to your site's layout.

What this does is leave the responsive_classic (RC) untouched for emergency testing. It also leaves a colored copy (RC) available for short term testing. And, you have a base comparison of RC to YOUR_TEMPLATE to check when things go bump in the night.

Several of our customers take a finished YOUR_TEMPLATE and clone it into valentines, easter, july4, thanks, christmas, etc and swap them out at the appropriate time. Seems like a good idea for a mod: scheduled template changes. hmmmm

If some nice person were to take the above post (leaving out the last sentence), expand it a bit and submit it as a FAQ, I would be most grateful.

I am interested in the color change mod mentioned above but the link in the post goes to an error message. Can you repost the link to that?

Much appreciated!

Links fixed.

Quote:

---

Originally Posted by dbltoe

Responsive Classic is the default template. Here's our recommendation if you are going to use Responsive Classic:

1. Start with Zen Cart and unmodified responsive_classic (hereafter RC)
2. Use lat9's clone a template to clone RC to responsive_base (hereafter RB)
3. Use the color change mod to create your colors in RB
4. Clone the color-changed RB to YOUR_TEMPLATE (where YOUR_TEMPLATE is whatever name you want for a final template.)
5. Proceed to make changes to your site's layout.

---

DB,

Thanks for the quick response.

With this method, does this leave me with a YOUR_TEMPLATE containing all of responsive_classic overrides within?

Thanks?

YOUR_TEMPLATE is whatever you decide to name it and, yes, in the example it would contain a modified responsive_classic with the final color selections for your site.

For example, you could name it awesome_dawson, davdaw, or anything that you will remember.

You could even clone at any point that would help you test by reverting to a previous template. if you wanted a color-modded version in place for testing, that would make it:

1. responsive_classic - untouched.
2. responsive_base - a cloned responsive_classic.
3. responsive_color - a cloned responsive_base that's been color-modded.
4. YOUR_TEMPLATE - a clone of responsive_color for creating shop layout.

I will often clone again before installing a mod like One Page Checkout or any other mod that is going to affect the layout of the site. A clone really doesn't take much space but sure is helpful for incremental testing.

DB,

I was using YOUR_TEMPLATE for the purpose of the example. Although, awesome_dawson is pretty sweet ;)

I was just hoping by now that ZenCart had a more elegant way to build off the responsive template. I generally with cms like to use the least number of override files as possible. In my view, this keeps things simple, specially when performing upgrades.

I have been using ZenCart for a long time and it is my choice for anything e-commerce related, I don’t think anything could ever change that. I can only imagine that the antiquated and non responsive state of the template_default would be a turn off to new users. Having to install these mods to accomplish this kinda bloats things up and can be confusing for new users.

Although I would have quite a few wish list items for the override system, at the very least, make responsive_classic the template_default. Or a way to select which template becomes the base.

Thank You for the link to the mods.

~D

Quote:

---

Originally Posted by djdavedawson

Although I would have quite a few wish list items for the override system, at the very least, make responsive_classic the template_default. Or a way to select which template becomes the base.

---

I am presently working on clarifying terms with templates since the inclusion of responsive_classic.

Classic:
Classic template started as the "get it running quick" template to demonstrate what a fully optional cart could look like. Before the need for responsive templates, it could be used (with maybe a few color changes) to get a site up and selling as soon as possible.

With the advent of mobiles, tablets, etc.; responsive_classic was born.

Template_Default:
Template_default is not the template_default. Never has been. It should be named template_repository to be more accurate. It is not designed to be used as a presentation template. In versions before responsive_classic was added it did come up first in order to graphically point out where changes could be made. It points out (incompletely) what files can be used to create a custom template. It is not complete without lat9's template override sheet as an additional guide.

Think of it as a filing cabinet holding examples of letters used in a business. You might have more than one division in your business with each having its own logo, colors, address, phone, etc.

Your "override" in this case would be to take a form, add the correct logo, etc and then store the forms in the file cabinet for the company they belong with. Your automated system would get the specific forms from the new cabinet and the generic forms from the "default" cabinet.

After all, if the same form is used for all companies, why have it take up space in several file cabinets.

Responsive_Classic:
Responsive_classic is currently the template that's presented with the initial install of Zen Cart. Until it is cloned, another template is installed, replaced with another template, or the user wants to use Classic; the responsive_classic template is the one to build on. As mentioned earlier, I think it's best to clone responsive_classic at several levels for troubleshooting.

Template Selection:
Once you have cloned, added, or created a new YOUR_TMEPLATE; the template selection is made in the Admin's Tools menu under Template Selection. In order for any template to show up as a selection, it must at least have an includes/templates/YOUR_TEMPLATE/template_info.php file with the required information. Otherwise the template will not show up as a selection. Many forget this when creating their own template.

Overrides:
No matter what template is used, it generally does not use all the files in the folders of the template_default. But, as you change one of the template_default (base) files, you would save it to YOUR_TEMPLATE in the proper directory. That way, the next time the cart looks for the file, it will be in the current template's directory. It also provides an excellent way to see what files have been upgraded from the time the cart was installed.

Maybe that better explains what Zen Cart is talking about in each case.

NOTE:
Store-bought templates are seldom built using standard Zen Cart practices and will seldom work beyond their initial installation. One simple change can run in to files added to the store-bought that go against the default files of standard Zen Cart. That is one of the basic reasons that store-boughts are NOT recommended.

Quote:

---

Originally Posted by dbltoe

NOTE:
Store-bought templates are seldom built using standard Zen Cart practices and will seldom work beyond their initial installation. One simple change can run in to files added to the store-bought that go against the default files of standard Zen Cart. That is one of the basic reasons that store-boughts are NOT recommended.

---

as is pretty apparent from this discussion, templates are an area that some ZC developers are working and hope to get some better options available for everyone.

i may be the only one on this board that has no problem with store bought templates. some of them require more work than others to get working, and their marketing can be misleading at best. but they look nice and can provide functionality.

With the Mobile Menu in responsive classic, is there a setting or code to get more than 2 levels deep?

Thanks

Ok, scratch that, is there a way to make the links with submenus only link to the submenu and not the page.

Category counts are turned off

Thanks

Quote:

---

Originally Posted by djdavedawson

With the Mobile Menu in responsive classic, is there a setting or code to get more than 2 levels deep?

Thanks

---

Yes, if you would like to email me I can send a production copy of the unreleased Twitch MobileNavMenu Display Control for Zen Cart 1.56c. If there are other features you want this will give you the control to add them.

https://twitchtoo.com/images/zen_for...ay_Control.png

These controls are built into Twitch Base6 and will be ready for public release very soon!

Quote:

---

Originally Posted by djdavedawson

Ok, scratch that, is there a way to make the links with submenus only link to the submenu and not the page.

Category counts are turned off

Thanks

---

Yes, this involves moving the location of the 1st tier outside of the code that writes the link for display. You can see the heading or category name but only click the down arrow to view the subcategories.

Im having a problem with 157 on firefox android. the wide banner on the top is not visible on android with firefox.

Its also blocked on chrome. The method I used was upload. I worked around it by using html image with a CR.

Not able to duplicate.

lakecountyprocessservers.com

I guess we do need to compliment you on what I used to call "Coming up with four decimals on a slide rule".

First time I've EVER seen an image that's

Code:

---

<img src="includes/templates/responsive_classic/images/logo.gif" alt="" width="300" height="167.24738675958" />

---

No alt is not good. (that's a freebie)

CSS should be done in a stylesheet. You have 18 HTML errors in the define_main_page for CSS inclusion. (nudder freebie)

Image dimensions cannot have a decimal place.

Maybe your browser versions do not play well with others.


THIS WAS FOR THE SITE IN YOUR PROFILE SINCE YOU GAVE NO URL LOOKING AT NEW NOW

Quote:

---

Originally Posted by dbltoe

I guess we do need to compliment you on what I used to call "Coming up with four decimals on a slide rule".

First time I've EVER seen an image that's

Code:

---

<img src="includes/templates/responsive_classic/images/logo.gif" alt="" width="300" height="167.24738675958" />

---

No alt is not good. (that's a freebie)

CSS should be done in a stylesheet. You have 18 HTML errors in the define_main_page for CSS inclusion. (nudder freebie)

Image dimensions cannot have a decimal place.

Maybe your browser versions do not play well with others.


THIS WAS FOR THE SITE IN YOUR PROFILE SINCE YOU GAVE NO URL LOOKING AT NEW NOW

---

Logo was not the problem. Its the wide banner above it.

Logo was set at 300 and height was set to ''. Decimals are not my problem.

Alt tags are seo fodder and will disappear eventually. If you are thinking its a type of meta tag, you're wrong.

Define main page editor responsible for any perceived errors.

Problem is in chrome and firefox. havent tried edge.

Same problem with edge

You need to get out of the spans and in-line styles. They just get things all munged up in responsive. You're telling the system to make this image 2888 wide and it is by Jimminy gonna do it.

Get the width and height out of the in-line and add

Code:

---

div#bannerOne {width: 100%;}

---

to the end of your stylesheet.css. You will need to adjust the margin-top in the same listing to something like 35px and it may need to go in the responsive_default.css in order to not mess with the desktop version.

You can decide what to do with the padding on line 43 of the stylesheet.css.

If I wanted to make it work just for me, I would not have posted it here.

I just checked with the out of the box banners and they have the same issue, wide banner not visible.

Quote:

---

Originally Posted by dbltoe

No alt is not good. (that's a freebie)

---

I fixed the no alt for the logo. It now says dbltoe from zen-cart.com is the best.:laugh: lakecountyprocessservers.com

A question!
I installed 1.5.7 on my test site and works fine.
Now I want to modify tpl_main_page.php to block some columns.

In layout settings I have ACTIVATE Responsive Template set to 1.

When I upload tpl_main_page.php from responsive classic template to my own template in my test site the storefront no longer shows up and in my log is the following fatal error..

Code:

---

[01-Aug-2020 10:29:23 Europe/Zurich] Request URI: /CatalogTest/index.php?main_page=index, IP address: 87.245.97.248
--> PHP Fatal error: Uncaught Error: Call to a member function isMobile() on null in /home/httpd/vhosts/simmar.ch/CatalogTest.simmar.ch/CatalogTest/includes/templates/OWNTEMPLATE/common/tpl_main_page.php:97
Stack trace:
#0 /home/httpd/vhosts/simmar.ch/CatalogTest.simmar.ch/CatalogTest/index.php(94): require()
#1 {main}
  thrown in /home/httpd/vhosts/simmar.ch/CatalogTest.simmar.ch/CatalogTest/includes/templates/OWNTEMPLATE/common/tpl_main_page.php on line 97.

---

When I upload tpl_main_page.php from template default template to my own template in my test site everything works OK.

My question is - I assume I should be using the responsive_classic version and not the template default one or?

Appreciate any advice/help.

Quote:

---

Originally Posted by marton_1

A question!
I installed 1.5.7 on my test site and works fine.
Now I want to modify tpl_main_page.php to block some columns.

In layout settings I have ACTIVATE Responsive Template set to 1.

When I upload tpl_main_page.php from responsive classic template to my own template in my test site the storefront no longer shows up and in my log is the following fatal error..

Code:

---

[01-Aug-2020 10:29:23 Europe/Zurich] Request URI: /CatalogTest/index.php?main_page=index, IP address: 87.245.97.248
--> PHP Fatal error: Uncaught Error: Call to a member function isMobile() on null in /home/httpd/vhosts/simmar.ch/CatalogTest.simmar.ch/CatalogTest/includes/templates/OWNTEMPLATE/common/tpl_main_page.php:97
Stack trace:
#0 /home/httpd/vhosts/simmar.ch/CatalogTest.simmar.ch/CatalogTest/index.php(94): require()
#1 {main}
  thrown in /home/httpd/vhosts/simmar.ch/CatalogTest.simmar.ch/CatalogTest/includes/templates/OWNTEMPLATE/common/tpl_main_page.php on line 97.

---

When I upload tpl_main_page.php from template default template to my own template in my test site everything works OK.

My question is - I assume I should be using the responsive_classic version and not the template default one or?

Appreciate any advice/help.

---

Some additions
The only addon so far is the German language pack.
The \includes\templates\responsive_classic\common/html_header is dated 26June20 (that is the file that defines that variable and makes it available for use.)

Installation is vanilla except for modified language files.

Quote:

---

A question!
I installed 1.5.7 on my test site and works fine.
Now I want to modify tpl_main_page.php to block some columns.

---

What do you mean by columns? Are you talking about the sideboxes are entire columns on either side? All of that can be done without editing a file.

Quote:

---

In layout settings I have ACTIVATE Responsive Template set to 1.

---

If you are talking about the Layout Settings under the Configuration menu, there is no such setting for this template.

Quote:

---

When I upload tpl_main_page.php from responsive classic template to my own template in my test site the storefront no longer shows up and in my log is the following fatal error..

---

It could simply be that your OWNTEMPLATE is not responsive. Templates are often not interchangeable.

It seems you are trying to modify a template that is not responsive_classic BUT,

Quote:

---

The \includes\templates\responsive_classic\common/html_header is dated 26June20 (that is the file that defines that variable and makes it available for use.)

---

you list responsive_classic.

We ask for answers to the posting tips for a reason. In this case, a link to your site would really be helpful.

https://docs.zen-cart.com/user/templ...right_columns/
https://docs.zen-cart.com/user/sideboxes/sidebox_list/

Quote:

---

Originally Posted by dbltoe

What do you mean by columns? Are you talking about the sideboxes are entire columns on either side? All of that can be done without editing a file.If you are talking about the Layout Settings under the Configuration menu, there is no such setting for this template.It could simply be that your OWNTEMPLATE is not responsive. Templates are often not interchangeable.

It seems you are trying to modify a template that is not responsive_classic BUT, you list responsive_classic.

We ask for answers to the posting tips for a reason. In this case, a link to your site would really be helpful.

https://docs.zen-cart.com/user/templ...right_columns/
https://docs.zen-cart.com/user/sideboxes/sidebox_list/

---

Thanks for your quick reply.
I managed to fix the problem, I had forgotten to copy the responsive_classic jscript folder into my new template :(

A couple of questions
You posted "If you are talking about the Layout Settings under the Configuration menu, there is no such setting for this template."
But I do, see picture below - is this a problem for me that I have this setting?

Then you posted "Are you talking about the sideboxes are entire columns on either side? All of that can be done without editing a file"
You sent me a link https://docs.zen-cart.com/user/templ...right_columns/ entitled "Left and Right Columns - turning them off" which tells me to edit tpl_main_page.php to turn off columns which is exactly what I was planning to do.

Quote:

---

A couple of questions
You posted "If you are talking about the Layout Settings under the Configuration menu, there is no such setting for this template."
But I do, see picture below - is this a problem for me that I have this setting?

---

I can't tell you if there is a problem because you are not using the responsive_classic template. You are apparently trying to take portions of it into another template. The other template is what is causing the setting you see in Layout Settings. Stock responsive_classic does not have an "on/off switch" for the responsive portion of the template.
I'd be interested in knowing where the template came from that you are using.
Attachment 19116

Quote:

---

What do you mean by columns? Are you talking about the sideboxes are (or) entire columns on either side? All of that can be done without editing a file.

---

The global (complete) turn off of the left and right columns is done in the Layout Settings menu. That turns either column off throughout the site. So, if the goal is no left or right column on any page, the answer is not in a file but the Layout Settings.
Attachment 19117

The only time it is recommended to use the tpl_main_page.php method is if you need to turn them off on one or two pages.

You didn't make it clear if you wanted them gone completely or just on a few pages.

I recommend you read this about the template override system and making the required custom template.

I realize that no one has their particular skill level or knowledge level attached to their avatar, but you might want to look a little more at what I do in the override/template area.:P

What you are confusing here is the difference between an override of files and the combination of templates.

Files that perform the layout of a template (JavaScript, CSS, etc.) may thoroughly break another template if an attempt is made to simply combine parts. Even in the overriding of files, you would not take a directory from template_default and move it to responsive_classic UNLESS you were going to change every file in that directory. By the same token, moving the jscript folder from responsive_classic to anything other than a clone of responsive_classic could create a problem. Especially if it's a blanket copy. And, if the template is a clone, was it done with lat9's Clone a Template Mod.

Responsive_classic is done in one way, Bootstrap templates are done another. Disastrous to try and combine. Even between 1.5.6c and 1.5.7, there have been major changes in the jscript files for responsive_classic.

Often, a store-bought template will even change the major wrappers of Zen Cart. One assumes it's done mainly out of laziness when trying to make one template fit several platforms.

But, of course, you have yet to identify how your "new" template came about. Did you purchase, clone, or .... Inquiring minds want to know.

Here's a report on the 1.5.7 responsive_classic by lighthouse. The site is working on getting the pesky image sizes under control but, I think the other scores are pretty good.
Attachment 19118

And, for the first time, 1.5.7 passes accessibility testing.
Attachment 19119

Thanks for the info.
I created my CUSTOM template by following the zen cart instructions here.

Thanks for pointing that out. It is incorrect in recommending just the jscript folder be carried over.

The best method for basing a template on responsive_classic is to use Clone a Template and make a clone of the responsive_classic. Then you can "adjust" to your heart's content.

There are a lot of files in other responsive_classic folders that must be present for the template just to be responsive. There are also files that are modified from template_default to add layout tags for responsive manipulation.

Case in point - in the common folder is the file main_template_vars.php. It is changed in the responsive_classic template and therefore present in the responsive_classic/common folder. The changes in the file for responsive_classic are

Code:

---

if (!isset($max_display_page_links)) $max_display_page_links = ($layoutType == 'mobile' ? MAX_DISPLAY_PAGE_LINKS_MOBILE : MAX_DISPLAY_PAGE_LINKS);  if (!isset($paginateAsUL)) $paginateAsUL = $layoutType == 'mobile' || (isset($isMobile) && $isMobile) || (isset($isTablet) && $isTablet);
  if (!isset($flag_disable_left)) {
    $flag_disable_left = false;
  }
  if (!isset($flag_disable_right)) {
    $flag_disable_right = false;
  }


  if (!class_exists('Mobile_Detect')) {
    include_once(DIR_WS_CLASSES . 'Mobile_Detect.php');
  }
  if (!isset($detect)) $detect = new Mobile_Detect;
  if (!isset($_SESSION['layoutType'])) $_SESSION['layoutType'] = 'legacy';


  $display_as_mobile = ($detect->isMobile() || $detect->isTablet() || $_SESSION['layoutType'] == 'mobile' || $_SESSION['layoutType'] == 'tablet');

---

Look familiar? Those pesky columns again.

So, you can see, if you fail to take this file into your custom template; a major portion of the response to the environment (phone, tablet, desktop) is just not going to happen. The template will default to the template_default's file without the correct coding and not be responsive. There are a lot more like that.

I will be working on fixing the wording of these instructions as they have not been updated in the new Zen Cart Documentation. The wiki/faq of old is being replaced by the DOCS link you see at the top of this page. The page to be "fixed" is https://docs.zen-cart.com/user/templ...ting_template/

Important Links not showing on droid.

Important Links (easy pages) appear on desktop right column but do not appear on responsive android. Instead on droid it says "0" important links". HOWEVER, if I show ez pages on header as well as sidebar, then the important links will increase and appear on droid.

Quote:

---

Originally Posted by dbltoe

Thanks for pointing that out. It is incorrect in recommending just the jscript folder be carried over.

The best method for basing a template on responsive_classic is to use Clone a Template and make a clone of the responsive_classic. Then you can "adjust" to your heart's content.

There are a lot of files in other responsive_classic folders that must be present for the template just to be responsive. There are also files that are modified from template_default to add layout tags for responsive manipulation.

Case in point - in the common folder is the file main_template_vars.php. It is changed in the responsive_classic template and therefore present in the responsive_classic/common folder. The changes in the file for responsive_classic are

Code:

---

if (!isset($max_display_page_links)) $max_display_page_links = ($layoutType == 'mobile' ? MAX_DISPLAY_PAGE_LINKS_MOBILE : MAX_DISPLAY_PAGE_LINKS);  if (!isset($paginateAsUL)) $paginateAsUL = $layoutType == 'mobile' || (isset($isMobile) && $isMobile) || (isset($isTablet) && $isTablet);
  if (!isset($flag_disable_left)) {
    $flag_disable_left = false;
  }
  if (!isset($flag_disable_right)) {
    $flag_disable_right = false;
  }


  if (!class_exists('Mobile_Detect')) {
    include_once(DIR_WS_CLASSES . 'Mobile_Detect.php');
  }
  if (!isset($detect)) $detect = new Mobile_Detect;
  if (!isset($_SESSION['layoutType'])) $_SESSION['layoutType'] = 'legacy';


  $display_as_mobile = ($detect->isMobile() || $detect->isTablet() || $_SESSION['layoutType'] == 'mobile' || $_SESSION['layoutType'] == 'tablet');

---

Look familiar? Those pesky columns again.

So, you can see, if you fail to take this file into your custom template; a major portion of the response to the environment (phone, tablet, desktop) is just not going to happen. The template will default to the template_default's file without the correct coding and not be responsive. There are a lot more like that.

I will be working on fixing the wording of these instructions as they have not been updated in the new Zen Cart Documentation. The wiki/faq of old is being replaced by the DOCS link you see at the top of this page. The page to be "fixed" is https://docs.zen-cart.com/user/templ...ting_template/

---

Thanks

So if my custom template is a clone of, in this case, responsive_classic then the advice in the override description, see below, is no longer correct?

"Zen Cart® Upgrades

Using the override system means you don't have to worry about overwriting your custom files when an upgrade comes along, because they are all in custom directories."

Quote:

---

Originally Posted by dbltoe

Thanks for pointing that out. It is incorrect in recommending just the jscript folder be carried over.

---

Please make the changes you feel are required to

https://docs.zen-cart.com/user/templ...-your-template

Quote:

---

Originally Posted by marton_1

Thanks

So if my custom template is a clone of, in this case, responsive_classic then the advice in the override description, see below, is no longer correct?

"Zen Cart® Upgrades

Using the override system means you don't have to worry about overwriting your custom files when an upgrade comes along, because they are all in custom directories."

---

Currently, there are only three templates that would be overwritten with an upgrade. Classic, Template_Default, and Responsive_Classic. That's why we recommend to all that the first step they take in dealing with templates is to clone Responsive_Classic to their own.

Its color stylesheet is a bear to work with simply because it was taken one step to far in minimization. If you wanted to change a color in one of those dang column headers, you'd change colors all over the place. That's why we came up with the Color Change Mod. Even then, there are concerns with 1.5.7 that we are working on at the moment.

Quote:

---

Originally Posted by swguy

Please make the changes you feel are required to

https://docs.zen-cart.com/user/templ...-your-template

---

Already on it. But, in my head, I'm hearing Mark Twain talk about the pig.

Hello all,
I'm in the process of doing a dry run upgrade from my current store (1.5.5f) to the newer 1.5.6c version. I installed a fresh version of 1.5.6c using the webhost auto installer -- then created an empty database and imported all the data from my 1.5.5f system to that dB. I modified the 1.5.6c configure.php files to work with the new dB and used /zc_install to perform the dB upgrade. I changed to the responsive_classic template. How does the mobile menu choose the options when rendering the slide-out menu? Is there a way to choose what options are available for the mobile menu?? The development site can be seen at: tro jan boats dot net slash jingle

==================

Server Host: ns212.webmasters.com (51.81.138.96)
Database: bcushman_zen156c
Server OS: Linux 4.19.0-10-amd64
Server Date: 09/29/2020 16:28:01
Server Up Time: 16:28:01 up 47 days, 6:45, 1 user, load average: 0.28, 0.33, 0.43
HTTP Server: Apache/2.4.38 (Debian)
PHP Version: 7.3.19-1~deb10u1 (Zend: 3.3.19)
PHP File Uploads: On
Upload Max Size: 200M
PHP Memory Limit: 128M
POST Max Size: 200M
Database Engine: MySQL 5.5.5-10.3.23-MariaDB-0+deb10u1
Database Host: localhost (127.0.0.1)
Database Date: 09/29/2020 16:28:01
Database Data Size: 13,687 kB
Database Index Size: 1,705 kB
MySQL Slow Query Log Status: On
MySQL Slow Query Log File: ns212-slow.log
MySQL Mode: STRICT_TRANS_TABLES, ERROR_FOR_DIVISION_BY_ZERO, NO_AUTO_CREATE_USER, NO_ENGINE_SUBSTITUTION

Zen Cart 1.5.6c
Database Patch Level: 1.5.6
v1.5.6c [2020-09-26 11:48:55] (Version Update 1.5.5->1.5.6c)
v1.5.5f [2018-03-13 16:44:27] (Version Update 1.5.4->1.5.5f)
v1.5.4 [2018-03-13 16:44:01] (Version Update 1.5.3->1.5.4)
v1.5.3 [2018-03-13 16:44:01] (Version Update 1.5.2->1.5.3)
v1.5.2 [2018-03-13 16:44:01] (Version Update 1.5.1->1.5.2)
v1.5.1 [2018-03-13 16:44:00] (Version Update 1.5.0->1.5.1)
v1.5.0 [2012-06-28 15:56:29] (Version Update 1.3.9->1.5.0)
v1.3.9h [2012-06-28 15:56:28] (Version Update 1.3.8->1.3.9h)
v1.3.8 [2010-01-02 16:47:08] (Fresh Installation)
v1.3.8 [2010-01-02 16:47:08] (Fresh Installation)

Quote:

---

Originally Posted by TrojanDon

I installed a fresh version of 1.5.6c using the webhost auto installer

---

This is NOT the recommended method for doing this. First, you'll be behind on a lot of improvements in 1.5.7. Second, the "auto-installers" often have missing files. Especially those you'll need to upgrade your database.

This file controls what appears:
includes/templates/responsive_classic/templates/tpl_modules_mobile_menu.php

Quote:

---

Originally Posted by dbltoe

This is NOT the recommended method for doing this. First, you'll be behind on a lot of improvements in 1.5.7. Second, the "auto-installers" often have missing files. Especially those you'll need to upgrade your database.

---

True that 1.5.7 is the latest, but some plugins (even heavily used ones like COWOA, Dual pricing, etc.) have not yet been upgraded to 1.5.7.

Quote:

---

Originally Posted by marton_1

Thanks

So if my custom template is a clone of, in this case, responsive_classic then the advice in the override description, see below, is no longer correct?

"Zen Cart® Upgrades

Using the override system means you don't have to worry about overwriting your custom files when an upgrade comes along, because they are all in custom directories."

---

This is partially correct. Your customizations won't get overwritten, but as Zen-Cart upgrades your custom template might break due to changes in some of the default Zen-Cart functionality and/or changes in code that can be used for the upgraded versions of PHP,etc.

ZC 157b Mobile issues - Full version is fine, but finding the following in the mobile

1. I use the blank_sidebox mod in the left column on the full size version of our site. On the mobile, it appears at the top, just below the header along with the links in it. It doesn't belong there.

2. Pressing the Hamburger icon the menu appears (of course) and there are a few things undesirable or incorrect:
A. It's nice to have a count of the number of categories, subcategories and sub-sub categories, but not so nice not to have a count of the products in those categories, if for no other reason, to see that there are products in the category. It seems a numerical indication just of the categories isn't informative from a customers perspective, however if the last stage of sub categories indicted how many products were there the customer would know there are products and can select the category to view them. As it is, a customer needs to select the sub-sub category to find out if there's anything in it.

B. The Information sidebox is disable on our site and I have moved the links to the footer section. However, on the mobile the Information sidebox shows up, with the links not in the order in which they are organized should I enable the sidebox on the full page.

C. Also in the Information sidebox displayed on mobile, the Page 2, Page 3 and Page 4 links appear at the bottom of the box when they shouldn't - they're just blank, native pages as came in the package.

D. I use the Important Links sidebox on the right hand side of the full version and it has content links in it. On the mobile version, The Important Links sidebox appears at the bottom of the menu and there's no links in it.

I may be updating this post as the issues get ironed out for others that may arise.
https://www.thercrv.com

2.A - The categories_ul_generator doesn't build counts of products, so that number isn't available to the menu.
2. B,C,D - See /includes/templates/YOUR_VERSION_OF_responsive_classic/templates/tpl_modules_mobile_menu.php

Quote:

---

Originally Posted by DrByte

2.A - The categories_ul_generator doesn't build counts of products, so that number isn't available to the menu.
2. B,C,D - See /includes/templates/YOUR_VERSION_OF_responsive_classic/templates/tpl_modules_mobile_menu.php

---

Cool! Took care of B and C easy enough.

As for a, is there a way to just turn the numbers off? They have no real value or use except for the admin to have a quick look at how many categories there are so he/she can say "I have x amount of categories and .....well, I don't know how many products there are... But I have x amount of categories". Customers don't care about that, their interest, if any at all, would be more toward how many products there are and since that seems to be difficult to achieve they might as well just be taken off.

I still have an important tasks of getting that blank_sidebox (mine is the Rants and Raves if you look at it) off of the page and into the menu
and
Figuring out how to get the links to show up in the "Important Links" of the menu, can't seem to decipher how the (what I assume is) $var_linkslist works to do that. I guess my PHP for Dummy's reference books didn't count on such a dummy coming upon something like that.

Well, maybe for d there's a clue

echo '<li><a href="' . $var_linksList[$i]['link'] . '">' . $var_linksList[$i]['name'] . '</a></li>' . "\n"
Might I be off track in thinking perhaps I replace the ['link'] with whatever the link and ['name'] with that in the full version, then duplicate this for every link in it? Hummmmmm

Quote:

---

Originally Posted by DrByte

2.A - The categories_ul_generator doesn't build counts of products, so that number isn't available to the menu.
2. B,C,D - See /includes/templates/YOUR_VERSION_OF_responsive_classic/templates/tpl_modules_mobile_menu.php

---

It looks like I'm also off on an adventure to dissect the includes/classes/categories_ul_generator.php to figure out how to remove the numbers.