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

That worked! Thanks!

Hi, Question on specs here.
ZC 1.5.6c, PHP 7.3.10, responsive classic.

Silly me, I had posted in the wrong thread previously:
https://www.zen-cart.com/showthread.php?224984-ZCA-Responsive-Classic-Template-for-1-5-6-Support-Thread&p=1363327#post1363327

While testing, my partner noticed that when checking out an order, in the initial main_page=shopping_cart screen, there appears to be a drop-down box to change address. I'd never had a separate address before, but she does, and now the issue has come up.
In Chrome, this is simple drop-down, no title or anything, and it confused her.

If one continues by pressing the "Checkout" button and continues to Step 1 of 3 (main_page=checkout_shipping ) there is an explicit "Change Address" button in the style matching the rest of the page.

So I wonder, is the drop-down seen in the shopping cart page a bug? I can try to style it somehow to match the style seen on Step 1 of 3, or simply remove the logic that puts in this code when (I assume) an address book for a customer has more than one address in it.

Any advice or comments most appreciated, I fully understand this is a free (and very useful and appreciated) template, and time is money, etc.

I managed to figure this out, not the greatest solution perhaps, but it certainly works for me. Turns out the select address from pulldown section was mixed up horizontally with the currently set address display, so I had to separate them as well as style them properly, as follows.

includes/templates/gernotshop/templates/tpl_modules_shipping_estimator.php

<?php
    // only display addresses if more than 1
      if ($addresses->RecordCount() > 1){
?>
<label class="bold back inputLabel" for="seAddressPulldown"><?php echo CART_SHIPPING_METHOD_ADDRESS; ?></label>
<?php echo zen_draw_pull_down_menu('address_id', $addresses_array, $selected_address, 'onchange="return shipincart_submit();" id="seAddressPulldown"'); ?>
<?php
      }
?>
<br class="clearBoth" />

I also found I had to put the first name, last name and street address into the addresses array in my override shipping_estimator.php module file in order to help tell the various addresses apart.

Hope that helps someone.

Hi all,
ZC 1.5.6c with built-in responsive classic, overridden as recommended.
URL: https://www.proteawines.jp/shop/
I've found that I would like to have some sideboxes in single column layout, but cannot figure out the correct approach.

First, the reasons:

For small mobile screens I still want to have the information (and possible extra information) sidebox visible above the footer, rather than only available through the off-screen pull-down/out menu. This is partly for clarity and partly to satisfy regulations that certain links should be available on each page. These sideboxes are in the lower col150 div (below the main col670 div and above the footer), and this entire div is hidden in small mobile screen CSS.

Additionally, I want to have the language selection sidebox available in single column as well, it does not seem to be visible anywhere by default, not even in the pull-down menu. Ideally I would like it at the top of the page. This sidebox is in the upper col150 div (above the main col670 div), and this entire div is hidden in small mobile screen CSS.

So, how to go about this?

I tried to set the sideboxes themselves to unhidden in responsive.css and responsive_default.css, and added the languages sidebox to the list there too. This would work I assume, except for the issue that the containing divs (with class col150) are hidden, so everything inside them too is hidden.

I am happy if I can at least get the languages sidebox into the pull-down menu, but this too I cannot figure out yet how best to do this.

I wonder what approach should be taken to make sideboxes visible that are inside the col150 id? Can I control this using only CSS, or would I need to add some logic to the PHP template files to make a different containing div (e.g., a class col670 one) under certain circumstances?

Obviously I will look further on my own, as well as checking this thread in more detail (Google searches did not help in that regard) but I haven't been able, through inspection, to find any example of including a sidebox in single column mobile mode using this default template.

Any advice or comments most welcome.

After looking at the CSS and template code, and searching more on the forums, I found mention of a plugin that puts languages and currency in the header:
https://www.zen-cart.com/downloads.php?do=file&id=30
Support thread:
https://www.zen-cart.com/showthread.php?37229-Language-Currency-Links-in-Header

Based on that, and my own suspicions, I guess the simplest way forward is to create new divs with id's, write these into the templates/<CUSTOM>/common/tpl_{header,footer}.php as appropriate using logic to only write them when mobile and/or tablet mode is detected, and then control their display with responsive_default.css (make hidden by default), and responsive_{mobile,table}.css (make visible here).

Whether I can merely include the language sidebox there remains to be seen, but I guess not if it contains mention of divs which will be hidden in mobile and/or tablet mode. In that case, I can either change the sidebox code to be more flexible, or simply write the relevant language code into the above header/footer templates.

I could also of course install the plugin mentioned, and use that, if it proves to be a better overall solution.

Hello,
Please advise:
I am trying to reduce spacing between lines: **at this site** see image below

I am using "Inspect" option and change

.wrapperAttribsOptions {margin: 20px 0;} to .wrapperAttribsOptions {margin: -15px 0;}

It resolves situation for mobile phone ()

but destroys formation of Desktop Display:

I guess there should be separate ccs files for desktop and mobile, but they are not presented in Inspect elements.

What is appropriate direction to solve this?

Check your responsive_classic clone's /css directory. You should see responsive_mobile.css and responsive_tablet.css.

I'm guessing that the change you identified should be put into both the portrait and landscape portions of each of those stylesheets.

lat9:

Check your responsive_classic clone's /css directory. You should see responsive_mobile.css and responsive_tablet.css.

I'm guessing that the change you identified should be put into both the portrait and landscape portions of each of those stylesheets.

It sounds logical, thank you for quick reply.
But than it should be shown in Inspect Element screen files which are responsible for the formatting. Shouldn't it?

Or I misunderstand how Inspect Element works?

Are you saying that .wrapperAttribsOptions {margin: -15px 0;} has to be copied in respective areas of responsive_mobile.css and responsive_tablet.css.?

That's what I'm suggesting, i.e. I think that *should *work.

As an alternative, you might use the responsive_default.css as the changes are needed more on screen width and not necessarily on screen orientation.

You'll find the responsive_default.css starts with@media (min-width:0px) and (max-width:480px){then@media (min-width:481px) and (max-width:767px){then@media (min-width:768px) and (max-width:1500px) {then@media (min-width:1500px) and (max-width:1800px) {and finally```
@media (min-width:1500px) {

Just determine the screen width where you want the change and place it in the proper section.

Also, you might want to consider percentages instead of a fixed width to change the setting.

For instance, let's say a margin is set to 30 px for an item on a screen width of 1500 px.  If we were to change that margin to 2%, would it look the same on a 980px screen?  It would now be 20 px versus 30px.  The advantage is, if you have two side by side divs, setting their width to 50% ensures they will be equal regardless of screen width or orientation.

I hope this doesn't "muddle the puddle", but it's another option to address your situation.  Percentages make it easier for a template to be responsive.

Hi All,

I was just checking the mobile version of our web site and have found that the drop-down menu is not working (the 3 blue bars top-left of the screen). I admit to not having checked this for a while so do not know when it stopped, although I recently updraded to 1.5.6c from b and also re-upgraded the database due to a couple of issues. As an addition to the above, eveything below the main header section (i.e. the editable Main Page) is offset to the right-hand side of the screen. The PC version of the site is running perfectly. Any suggestions as to where to look please?

I am using the in-built Responsive Classic template
Zen Version 1.5.6c
My SQL 5.6.44
PHP 7.2.20
https://www.dracocrafts.co.uk

Michael

Hi Guys , A few questions

I want to remove "units in Stock" . I tried Admin->Catalog->Product Types->Product General->Edit Layout ... "Show Quantity in Stock" and setting it to False. But this hasn't worked. Can I edit in source somewhere ?

Also I tried changed image sizes in the admin with out luck . Can I edit it in source somewhere . For [New Products For January] , [Product Listings] and [New Products].

Thanks in advance !

Mikeondraco:

Hi All,

I was just checking the mobile version of our web site and have found that the drop-down menu is not working (the 3 blue bars top-left of the screen). I admit to not having checked this for a while so do not know when it stopped, although I recently updraded to 1.5.6c from b and also re-upgraded the database due to a couple of issues. As an addition to the above, eveything below the main header section (i.e. the editable Main Page) is offset to the right-hand side of the screen. The PC version of the site is running perfectly. Any suggestions as to where to look please?

I am using the in-built Responsive Classic template
Zen Version 1.5.6c
My SQL 5.6.44
PHP 7.2.20
https://www.dracocrafts.co.uk

Michael

I guess no suggestions on this then?

Michael

Mikeondraco:

I guess no suggestions on this then?

Michael

On first glance it is working (loading for display) then being overwritten. Likely a java conflict.

Hasher:

Hi Guys , A few questions

I want to remove "units in Stock" . I tried Admin->Catalog->Product Types->Product General->Edit Layout ... "Show Quantity in Stock" and setting it to False. But this hasn't worked. Can I edit in source somewhere ?

Also I tried changed image sizes in the admin with out luck . Can I edit it in source somewhere . For [New Products For January] , [Product Listings] and [New Products].

Thanks in advance !

If that switch isn't working, someone has removed it or there's a connection to it missing in your template files. It works in a bone stock 1.56c and 1.55f on all pages tested.

Also...

New Products Listing Code:
if (PRODUCT_NEW_LIST_QUANTITY != '0' and zen_get_show_product_switch($products_new->fields['products_id'], 'quantity')) {
if ($products_new->fields['products_quantity'] <= 0) {
$display_products_quantity = TEXT_OUT_OF_STOCK . str_repeat('<br />', substr(PRODUCT_NEW_LIST_QUANTITY, 3, 1));
} else {
$display_products_quantity = '<b>' . TEXT_PRODUCTS_QUANTITY . '</b>' . $products_new->fields['products_quantity'] . str_repeat('<br />', substr(PRODUCT_NEW_LIST_QUANTITY, 3, 1));
}
} else {
$display_products_quantity = '';
}

This code is looking at the settings in** Admin > Configuration > New Listing > Display Product Quantity AND** the switch position in product type layout mentioned above.

twitchtoo:

On first glance it is working (loading for display) then being overwritten. Likely a java conflict.

Thank you for your response. Any suggestions as to where I should look?

I have also noticed that it works correctly on my Samsung tablet in landscape mode. I guess that should point me somewhere...

Michael

Mikeondraco:

Thank you for your response. Any suggestions as to where I should look?

I have also noticed that it works correctly on my Samsung tablet in landscape mode. I guess that should point me somewhere...

Michael

When I use the developer tools in FireFox (right click - inspect element) there is a list of 'failed java' and you can hover over the three bars in mobile view to see what else is running and interfering - live.

McAfee, geopLugin and jQuery may not be playing nice together from what I can see.

twitchtoo:

When I use the developer tools in FireFox (right click - inspect element) there is a list of 'failed java' and you can hover over the three bars in mobile view to see what else is running and interfering - live.

McAfee, geopLugin and jQuery may not be playing nice together from what I can see.

Thanks again, gives me something to go on.

Michael

Ok, sinking here somewhat. I have disabled geopLugin and McAfee, but still have the same problem. Not sure I understand what I am seeing in Firefox developer mode, somewaht beyond me to be honest. I still do not understand why the main page content is shifted to the right-hand side of the screen, which is obviously part of the ame problem I assume. Only happening on mobile screens and some tablet screens.

Michael

Mikeondraco:

Ok, sinking here somewhat. I have disabled geopLugin and McAfee, but still have the same problem. Not sure I understand what I am seeing in Firefox developer mode, somewaht beyond me to be honest. I still do not understand why the main page content is shifted to the right-hand side of the screen, which is obviously part of the ame problem I assume. Only happening on mobile screens and some tablet screens.

Michael

Your jquery.mmenu.min.all.js and jquery.mmenu.fixedelements.min.js are not loading.

The FireFox developer Debugger tab has the view you're looking for.

I compared with 1.55f - http://germanwholesaleparts.ca/ and a bone stock 1.56c install using the responsive template I pm'd you the link.

Something has knocked those out or they aren't available in the java folder for the browser to load.

twitchtoo:

Your jquery.mmenu.min.all.js and jquery.mmenu.fixedelements.min.js are not loading.

The FireFox developer Debugger tab has the view you're looking for.

I compared with 1.55f - http://germanwholesaleparts.ca/ and a bone stock 1.56c install using the responsive template I pm'd you the link.

Something has knocked those out or they aren't available in the java folder for the browser to load.

Ok many many thanks, I will look into this later and try and find what happened to them.

Michael