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

[Design75]

I use colorbox for images along with wheelzoom.. the resizing is done to match screen width, zooming in with the mouse wheel... but to answer your question, in the modules/pages/product_info/jscript_main.php find or add this function within the script tags, Change the no to yes for scrollbars...

function popupWindow(url) { 
  window.open(url,'popupWindow','toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,copyhistory=no,width=100,height=100,screenX=150,screenY=150,top=150,left=150') 
}

I don't think you can use the template system for pages!! '/modules/classic responsive/pages/' should be '/modules/pages/'

You are right. The files in "includes/modules" can de overridden with "includes/modules/YOUR_TEMPLATE" , but includes/modules/pages" can not. The files inside that folder tree can only be overridden by editing the files themselves.

[jasonshanks]

Hello,

I plan on upgrading to zencart 5.5.5e and responsive classic. I am currently using 1.5.4 and I am getting penalized by google for not being mobile friendly in search results. My site is missingcord.com. My plan is to rebuild a light (not all products or images added) version of my site on salvagecrate.com So i can get a good idea of how to get everything back and running when i try it on my main site domain. So far everything is running smooth. I really like how responsive classic looks. My problem is , i am trying to change the color of the menu button ( icon that looks like a stack of papers) in the mobile version to red like my top bar.

I noticed that when i changed line 3 in includes/templates/responsive_classic/css/stylesheet_colors.css to the hex color for black , i was able to get the default text color in the catalog how i wanted it. But the menu button in mobile also changed to black from that teal color you guys had.

How would i go about changing just that button to red like my top bar ? Do I need to make a new line with one of the options in line 3 ? Just cut and past it , while adding its on hex code ?

update: I just noticed the nav buttons on the top also turn teal when i mouse over them. Now i need to figure out how to fix that too lol

[dbltoe]

This is the very reason we came up with the color change mod. Take a look at https://www.zen-cart.com/downloads.php?do=file&id=2088

[Ted Grapler]

Hi,

I've been using Zen Cart for about 5 years now and it's been a great experience. Current live version is 1.5.4 upgraded from 1.5.0.

Am looking to do a clean install of 1.55e and transfer my customer and product info over. I'd like to do this mainly because a year or two ago I installed a third party template I found on the web to get my site to be responsive for mobile users. I tried some of the responsive templates in Plugin sections but was never able to get them to work correctly for me. Lots of trial and error but got it working and it's served me well, but there is mixed content and get errors when enabling SSL. I want to use https. Also just need to clean everything out because am sure there is stuff in there that causes errors. Still overall the site works OK for me currently.

Used Softaculous and and created a new install on a subdomain. The first issue I encountered with using Responsive Classic Template is that the sideboxes just disappear when I make the desktop window smaller or use mobile mode. I do see the menu button on top but I want the sideboxes to still show up, just lower down the page. I tried enabling under Tools>Layout Boxes Controller but nothing makes any difference.

On my live site currently if I make the desktop window narrower or go into tablet or mobile mode the sideboxes from the left and right sides of my page are automatically moved to the bottom. So you can just scroll down to see them. Had thought this was called "single column" mode but may be mistaken.

Apologize if this has been covered already but I spent about 45 minutes searching forum and didn't find an answer. Is there a simple way to enable this feature or is it working like it should and is just different than the responsive template that's installed on my live site? Am no tech guru or very knowledgeable about CSS, HTML etc. but am willing to learn and would appreciate any info or suggestions.

Thanks, Ted

[DrByte]

I can't teach all about "responsive design" and css "media queries" here, but here's the jist:

In the stylesheets you'll see a media query which specifies the screen orientation or size to be described. For example:

@media (min-width:0px) and (max-width:480px){
...
div#categories { display:none;visibility:hidden; }
...
}

The above example says "for media (ie: screen-sizes, whether mobile, or resized-desktops) from 0px-to-480px, the <div> whose id="categories" should have its display property set to "none" (ie: hidden), and its visibility set to 'hidden'. ie: on small screens, don't show the categories sidebox.

The various stylesheets have various different screen-sizes (media queries) specified, followed by a brace: { and a bunch of rules, and then a closing brace: }

If you wanna force certain sideboxes to always display, you can fiddle with some of these display properties. Keep a backup in case you fiddle too much ;)


In the cases where columns drop down to the bottom and show below other content, that could just be a sizing issue, whether intentional or not. That may require a different set of skills to adjust.


Additionally, you may want to consider that you do NOT want to actually display those sideboxes at all. Often in mobile views things are shoved into a separate menu which only shows in mobile mode. Accessing this menu is typically done by clicking the "hamburger icon" (three horizontal rows in a square box).
In this template, the contents of the menu shown for mobile is in /includes/templates/responsive_classic/templates/tpl_modules_mobile_menu.php ... granted, 99% of the stuff in there is configurable from settings in your Admin->Configuration menu.

[Ted Grapler]

Thanks for the fast response Dr. Byte.

I tried editing the /includes/templates/responsive_classic/css/responsive_mobile.css and /includes/templates/responsive_classic/jscript/jscript_responsive_framework.php as described early in this thread but couldn't replicate the way my site currently works.

The best I could do was get (for example) the Categories box to show up in Mobile mode but it was above the page content not below.

So looks like most Responsive templates don't work like what I am using. Makes sense I guess not to have the same content you can access by the "hamburger icon menu" always displayed towards the bottom of page but I had gotten used to it

On the bright side at least I don't have to waste any more time on this particular issue..

[pixelpadre]

We want to know what happened to the old DrByte. The one that was more abrupt and intolerant.

[dbltoe]

In the cases where columns drop down to the bottom and show below other content, that could just be a sizing issue, whether intentional or not. That may require a different set of skills to adjust.

This happens when a setting other than those in the responsive.css file (around line 21) are used. If you have to have something specific, you may need to clone one of those lines and change the settings accordingly.

[jasonshanks]

This is the very reason we came up with the color change mod. Take a look at https://www.zen-cart.com/downloads.php?do=file&id=2088

thank you so much again for showing me this. So far the mod has worked wonders for me. I have a few new problems. If i use the regular search in layout box it doesn't show up in the mobile or tablet version of the site.

www.salvagecrate.com

And if I use search_header it shows up in nice spot under the logo and again on the menu drop down options for mobile and tablet. But, The text that's in it is a ugly pink shade. The " enter search keywords here" text. Is there anyway to change that to just black color text ?

or is there a add on / plugin to have a search button in the header kind like the login, cart etc ones for the mobile version. To me that would be a whole lot cleaner.

kinda like the ups.com mobile site. They have exactly what i want as far as mobile search . Is there anything like that in zencart ?

[IATIA]

ZenCart v1.5.5e
About_us page
dbio 1.3.0
MainImageReplacer-v1.0
Image_Handler4_v4.3.2

Can this be fixed? --> Yes, no, maybe?

Attachment 17198