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

I downloaded v155 responsive classic. I have everything working well (https://gybproducts.com/almacenar/) except getting the Language icon buttons to show on my mobile site. They work find on the desk top both English and Spanish. Can someone help me or point me to information on how to fix this. Thank You, larry
Thank You

I found it and fixed it.

I removed display:none on line 58 of jscript_responsive_framework.php
https://github.com/zencart/zencart/blob/v155/includes/templates/responsive_classic/jscript/jscript_responsive_framework.php#L58

dbltoe:

No particular laid out steps. It is a golden opportunity to learn using web developer extensions for your browser to experiment with your stylesheet(s).
A couple of things I would do first before diving in. Get the mod that better facilitates color changes for responsive_classic and install it. https://www.zen-cart.com/downloads.php?do=file&id=2088.
After it's installed and before you make any other changes, use the clone template mod to clone it to a new name for your store. Try to pick a clone name without the underscore. https://www.zen-cart.com/downloads.php?do=file&id=2087
Now, any changes to the new template can easily be found/removed/repaired using the old template and its clone.

For those of you wondering about underscores in URLs, Google, WooRank, and StackOverFlow all suggest dashes versus underscores.

1. You wrote: > Try to pick a clone name without the underscore.

When we try it there is an error:

! The Target Template must contain only alphanumeric (a-z, A-Z, 0-9) characters or underscores (_); please re-enter.
[Attachment no longer available]

Is your suggestion misunderstood?

Also, your links suggest to use hyphen in all URLs.
**
2.** Is it possible to configure Zen Cart with responsive template to do it? Now all URLs are like this:

//www.website.com/store/index.php?main_page=product_info&cPath=21&products_id=276

Thank you for your comment in advance

idtags:

1. You wrote:

When we try it there is an error:

! The Target Template must contain only alphanumeric (a-z, A-Z, 0-9) characters or underscores (_); please re-enter.
[Attachment no longer available]

Is your suggestion misunderstood?

Also, your links suggest to use hyphen in all URLs.
**
2.** Is it possible to configure Zen Cart with responsive template to do it? Now all URLs are like this:

//www.website.com/store/index.php?main_page=product_info&cPath=21&products_id=276

Thank you for your comment in advance

I am not sure what you mean for point #2, but for the first one, you should not use a space in your template folder name.

To understand my question, please read previous page (38) post #378 by dbltoe.

Person suggests for SEO purposes instead of URLs like this:

//www.website.com/store/index.php?main_page=product_info&cPath=21&products_id=276

to use like this:

//www.website.com/store/books/books-about-aviation

It looks all modern e-shops generate URLs with hyphen and combine name of category and name of product.

Is there configuration in admin for it in new responsive templates?

Or I misunderstood the point completely?

picaflor-azul:

Yes, natively, the grid layout does not come with zen cart v1.x. You will need to add a plugin like snaf or column layout grid for the grid layout. There may be versions of those plugins on github that are responsive.

Thanks,

Anne

On the home page, though, the Featured and Specials are gridded (at least to the point of being 3x3) - is it not possible to have the subcategory pictures (for example, here) grid themselves the same way? If not, can you recommend a plugin or module that will do that - I want to say it was working before we moved over to 1.5.5 (from 1.3.8a), but I can't confirm that for sure.

idtags:

To understand my question, please read previous page (38) post #378 by dbltoe.

Person suggests for SEO purposes instead of URLs like this:

//www.website.com/store/index.php?main_page=product_info&cPath=21&products_id=276

to use like this:

//www.website.com/store/books/books-about-aviation

It looks all modern e-shops generate URLs with hyphen and combine name of category and name of product.

Is there configuration in admin for it in new responsive templates?

Or I misunderstood the point completely?

idtags,
Did you see my post following the one you chose to act on?
Here it is again:

DrByte:

Um ... the name of the template directory never appears in the URL for SEO purposes. So using an underscore in the name of your template folder is unrelated to SEO.

Also, the format of the URLs your site generates has nothing to do with using a "responsive template". That's a completely separate discussion, best had in the "Search Engines" section of the forum. And again, it has nothing to do with configuration settings of the responsive classic template.

Additionally, no, (by default) there are admin settings for controlling the URL format. You can add a plugin to do that if you wish. Discuss it in the Search Engines section.

Hello

I am uploading photos to a new site. I noticed that there are no scroll bars in the photos making it very difficult to view a larger image. I read the tut on images but it was referring to ZC 1.2.1. None the less I did what it said (create a jscript_main.php file). I placed it in a new directory includes/modules/classic responsive/pages/product_info. Refreshed the website and no change.

Any ideas? No scroll bars means trouble viewing the image unless you have a very large monitor.

pixelpadre:

Hello

I am uploading photos to a new site. I noticed that there are no scroll bars in the photos making it very difficult to view a larger image. I read the tut on images but it was referring to ZC 1.2.1. None the less I did what it said (create a jscript_main.php file). I placed it in a new directory includes/modules/classic responsive/pages/product_info. Refreshed the website and no change.

Any ideas? No scroll bars means trouble viewing the image unless you have a very large monitor.

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/'

davewest:

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/'

The ZC tutorial that I read indicated that this change should be made using overides as I described above.

davewest:

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.

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

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

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

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.

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..

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

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.

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

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.

https://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 ?

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 no longer available]