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

This is a support thread for the Responsive Classic template built-in to Zen Cart v1.5.5

Anne

HI Anne:

I really like the 155 Responsive Classic template because I use the Winchester Responsive on another site for now until it is upgraded to 155.

Aside from customizing colors I have a couple requests.

I would like to streamline the Header and Search side box to match the Winchester, including the Cart Total on both the mobile and desktop templates.

For the mobile, I will just use the Header Search.

See the attached pics. Where would I find the code and can I simply copy/paste from the Winchester code?

I would also like to use css buttons on the mobile side because the buttons are too small to read.

Which choice do I use to prevent a double search box on the mobile. Thanks!

If I add sideboxes how do I get them to change in the mobile version like the standard ones do?

The side-boxes for specific devices in v1.5.5 Responsive Classic are controlled by CSS.

Open these 3 files:
/includes/templates/responsive_classic/css/responsive_default.css
/includes/templates/responsive_classic/css/responsive_mobile.css
/includes/templates/responsive_classic/css/responsive_tablet.css

The responsive_default.css file manipulates the side-boxes for all devices if a UA (User-Agent) is not detected.

The responsive_mobile.css & responsive_tablet.css files manipulates the side-boxes for specific devices if a UA (User-Agent) is detected

Each file will have code that starts with:

/*bof side-boxes*/
/* ADD { display:none;visibility:hidden; } to Hide Side-Box */
/* LEAVE BLANK {  } to Show Side-Box */

Take a look at the CSS and how the stock side-boxes are handled.

robbie269:

If I add sideboxes how do I get them to change in the mobile version like the standard ones do?

Thank you. Worked perfectly! Simple when you know where to look...

rbarbour:

The side-boxes for specific devices in v1.5.5 Responsive Classic are controlled by CSS.

Open these 3 files:
/includes/templates/responsive_classic/css/responsive_default.css
/includes/templates/responsive_classic/css/responsive_mobile.css
/includes/templates/responsive_classic/css/responsive_tablet.css

The responsive_default.css file manipulates the side-boxes for all devices if a UA (User-Agent) is not detected.

The responsive_mobile.css & responsive_tablet.css files manipulates the side-boxes for specific devices if a UA (User-Agent) is detected

Each file will have code that starts with:

/bof side-boxes/
/* ADD { display:none;visibility:hidden; } to Hide Side-Box /
/ LEAVE BLANK { } to Show Side-Box */

> 
> Take a look at the CSS and how the stock side-boxes are handled.

Just installed 1.5.5 and trying to work the style sheet for responsive classic. I just need the logo to center. Spent all afternoon with trial and error and no luck. Any insights appreciated. Edited this to reflect some fixes i found but still the logo needs centering.

Did you try just deleting the css pages you modified and reloading the originals and clearing the cache in your browser?

athena:

Just installed 1.5.5 and trying to work the style sheet for responsive classic. I just need the logo to center. Spent all afternoon with trial and error and no luck. Any insights appreciated. Edited this to reflect some fixes i found but still the logo needs centering.
When asking for help with templates and CSS, it's important to provide a link to the site (even a specific page, if relevant) so we can provide a useful answer. Otherwise you force us to guess or give extremely generic answers which are often things you've already tried. If you don't tell us what you tried, then we're probably going to tell you those basics.

Issue: State Dropdown not displaying properly

Solution: See this (https://www.zen-cart.com/showthread.php?219812-State-Province-dropdown-is-not-displayed-the-same-as-other-fields) posting, with solution provided.

webskipper:

HI Anne:

I really like the 155 Responsive Classic template because I use the Winchester Responsive on another site for now until it is upgraded to 155.

Aside from customizing colors I have a couple requests.

I would like to streamline the Header and Search side box to match the Winchester, including the Cart Total on both the mobile and desktop templates.

For the mobile, I will just use the Header Search.

See the attached pics. Where would I find the code and can I simply copy/paste from the Winchester code?

I would also like to use css buttons on the mobile side because the buttons are too small to read.

Which choice do I use to prevent a double search box on the mobile. Thanks!

So, no advice for these? The Mobile buttons are small and look washed out. Hard to read.

webskipper:

The Mobile buttons are small and look washed out. Hard to read.
The Responsive Classic template, expects to use CSS buttons ... which it appears you already have turned on.
And I can't see any issues with mobile buttons currently on rc101dotcom

I want to add more contrast and just kill the pill buttons all together.

I like the buttons of the desktop site better.

webskipper:

and just kill the pill buttons all together.
Hmmm ... it appears that all the desktop-based "mobile emulators" do show the CSS buttons in mobile mode, but some of the actual mobile devices are still rendering them shaped as lighter-colored pill buttons.

I imagine Anne has a quicker fix for that than I do.

Team, is the guidance to modify responsive_classic directly, or to template off it? If the latter, please see my notes in the thread
https://www.zen-cart.com/showthread.php?219882-Creating-a-new-template-based-on-responsive_classic-%28Built-into-1-5-5%29

Might also be time to update
https://www.zen-cart.com/content.php?180-how-do-i-create-a-new-custom-template

How do I remove the category count on the mobile menu?

robbie269:

How do I remove the category count on the mobile menu?
I realize you asked specifically about the Mobile Menu, so I will assume that you've already turned off Category Counts here: https://www.zen-cart.com/content.php?198

And, doing that DOES turn off the Category Counts, even in the mobile menu.
But you're probably referring to the "sub-menu counter" that gives an indicator about how many sub-links are available in each sub-level in the mobile-specific menu.

So, to turn off the counts of how many sub-levels are available in the whole mobile-menu, edit /includes/templates/YOUR_RESPONSIVE_TEMPLATE/templates/tpl_modules_mobile_menu.php:
Line 159:

        counters: true
``` ... change that to false, and ALL sub-level indicators will no longer have ANY counters. Be sure you assess whether you really want that turned off.

DrByte:

... change that to false, and ALL sub-level indicators will no longer have ANY counters. Be sure you assess whether you really want that turned off.

Yes the sub-menu counters are what I meant. What is the benefit of having them?

robbie269:

Yes the sub-menu counters are what I meant. What is the benefit of having them?
Just information for your users. Not saying it's right or wrong.
I'll answer your question with a question: Why do you feel the need to turn them off?

DrByte:

Why do you feel the need to turn them off?
I know, I asked for that! Just a personal preference.

robbie269:

I know, I asked for that! Just a personal preference.
Haha!
Nothing wrong with having a personal preference.
My point earlier was just to consider whether it matches the preference for the majority of your specific customers.