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

When you take the text beyond or below 100% of what is set in the body tag, it's often not automatically adjusted in all aspects.

Your taking the #tagline (again, used twice) to 1.3em requires an appropriate change in linespacing so that the lines of text do not run together.

Do you actually have two HEADER_SALES_TEXT defines in your includes/languages/english/responsive_classic/header.php?

You can combine the text to look like```
define('HEADER_SALES_TEXT', 'Going beyond your expectations...NOT your budget!<br><br><strong>Need Help? Call (678) 561-8151<br>8 AM till 10 PM Eastern Standard Time - 7 DAYS A WEEK!</strong><br><br>Email your quote requests to <a href="mailto:[email protected]&subject=Sales%20Quote&body=I%20would%20like%20a%20quote%20for...">Sales</a>');

There are two schools of thought on the spaces (%20) in the mailto link.  You *could* just use regular spaces but, to be on the safe side.....

Hello,
I spent a lot of time trying to realize how the layout recognizion mechanism is working
(Actually, the most important question was why $_SESSION['layoutType'] varable is always set to 'legacy')

So...

The file 'zca_responsive_functions.php' contains the following code:

function layoutTypes()
{
    return array('default', 'mobile', 'tablet', 'full');
}

function initLayoutType()
{
    // Safety check.
    if (!class_exists('Mobile_Detect')) { return 'default'; }

    $detect = new Mobile_Detect;
    $isMobile = $detect->isMobile();
    $isTablet = $detect->isTablet();

    $layoutTypes = layoutTypes();

    if ( isset($_GET['layoutType']) ) {
        $layoutType = $_GET['layoutType'];
    } else {
        if (empty($_SESSION['layoutType'])) {
            $layoutType = ($isMobile ? ($isTablet ? 'tablet' : 'mobile') : 'default');
        } else {
            $layoutType =  $_SESSION['layoutType'];
        }
    }

    if ( !in_array($layoutType, $layoutTypes) ) { 
        $layoutType = 'default'; 
    }

    $_SESSION['layoutType'] = $layoutType;

    return $layoutType;
}

$layoutType = initLayoutType();

But this code is executed at the moment, when session is not started yet ($_SESSION array is still undefined)

(containing all functions files is being loaded before 'init_sessions.php' - see Breakpoint 60 and Breakpoint 70 in 'config.core.php' file)

Thus, any manipulations with $_SESSION in above mentioned code seem not only as exotical way, but fully incorrect.

It seems strange to me, I am the first who noticed this, but brief search over this forum gave no relevalt results.
Sorry, if I do understand something wrong

And also, should the following line be added in the beginning of function initLayoutType() ?

if (!class_exists('Mobile_Detect')) include_once DIR_WS_CLASSES . 'Mobile_Detect.php';

yesaul:

Hello,
I spent a lot of time trying to realize how the layout recognizion mechanism is working
(Actually, the most important question was why $_SESSION['layoutType'] varable is always set to 'legacy')

So...

The file 'zca_responsive_functions.php' contains the following code:

function layoutTypes()
{
return array('default', 'mobile', 'tablet', 'full');
}

function initLayoutType()
{
// Safety check.
if (!class_exists('Mobile_Detect')) { return 'default'; }

$detect = new Mobile_Detect;
$isMobile = $detect->isMobile();
$isTablet = $detect->isTablet();

$layoutTypes = layoutTypes();

if ( isset($_GET['layoutType']) ) {
    $layoutType = $_GET['layoutType'];
} else {
    if (empty($_SESSION['layoutType'])) {
        $layoutType = ($isMobile ? ($isTablet ? 'tablet' : 'mobile') : 'default');
    } else {
        $layoutType =  $_SESSION['layoutType'];
    }
}

if ( !in_array($layoutType, $layoutTypes) ) { 
    $layoutType = 'default'; 
}

$_SESSION['layoutType'] = $layoutType;

return $layoutType;

}

$layoutType = initLayoutType();

> 
> But this code is executed at the moment, when session is not started yet ($_SESSION array is still undefined)
> 
> (containing all functions files is being loaded before 'init_sessions.php' - see *Breakpoint 60* and *Breakpoint 70* in 'config.core.php' file)
> 
> Thus, any manipulations with $_SESSION in above mentioned code seem not only as exotical way, but fully incorrect.
> 
> It seems strange to me, I am the first who noticed this, but brief search over this forum gave no relevalt results.
> Sorry, if I do understand something wrong

IMO, you are correct.  extra_functions seem to be loaded PRIOR to session vars getting set up as well as before the loading of this class file.

HOWEVER, if one looks here:

<https://github.com/zencart/zencart/blob/58593e53d5d03fca3933a85e70ca00bd336abcc6/includes/templates/responsive_classic/common/html_header.php#L32-L40>

i think this is where the mobile detection gets used.

you are getting set to legacy because you are using the template default.  if you set your template to responsive classic, you will then see changes to your  layout_type.

to me this function can be safely deleted from the zc core.

best.

carlwhat:

IMO, you are correct. extra_functions seem to be loaded PRIOR to session vars getting set up as well as before the loading of this class file.

to me this function can be safely deleted from the zc core.

best.

Sure, it can. But this makes using $_SESSION['layoutType'] completely useless

• no relevant info will be kept within session in $_SESSION['layoutType']

• mobile detection will be being done for every next page again

• the only way to change $_SESSION['layoutType'] will be $_GET (see init_includes/init_zca_layout.php)

As addition to deleting of 'zca_responsive_functions.php' file (containing code, which is non-functional anyway), here is my suggestion for code in 'init_zca_layout.php' file:

if (!defined('IS_ADMIN_FLAG')) {
  die('Illegal Access');
}

include_once DIR_WS_CLASSES . 'Mobile_Detect.php';

if (isset($_GET['layoutType'])) $layoutType = preg_replace('/[^a-z0-9_-]/i', '', $_GET['layoutType']);
elseif (!empty($_SESSION['layoutType'])) $layoutType =  $_SESSION['layoutType'];
elseif (!class_exists('Mobile_Detect'))  $layoutType = 'default';
else {
  $detect = new Mobile_Detect;	
  $layoutType = ($detect->isMobile() ? ($detect->isTablet() ? 'tablet' : 'mobile') : 'default');	
}
	      
if (!in_array($layoutType, array('mobile', 'tablet', 'full'))) $layoutType = 'default'; 
	
$_SESSION['layoutType'] = $layoutType;

This handle $_SESSION['layoutType'] in correct way and correct place and makes any further mobile detection within (any) template unnecessary

Hi. I have recently upgraded to v1.57 and switched to this template. I have a photo showing up at the top of a product category. It is above the list of products and below the category name. It only happens in one category. Any idea why this is showing up and how I can get rid of it? Thanks

Edit: I just uploaded a thin white rectangle as a bandaid. Here a more useful question:

On the front page, there is one large image front and center. I have this linked to a particular category. Is there a way to duplicate this, so I can have a list of 3 or 4 of these, so one for each category type of thing?

Thanks

I'm guessing (without a link to the site in question), that the upper image you're referring to is the associated category's image; it must be the only category where an image is provided.

To remove that display, you'll set Configuration :: Product Listing :: Include Product Listing Top Categories Image to false.

Again, without the site link, the question about the front-and-center image is "difficult" to answer.

Thanks, that fixed the image thing.

The front page image is specified in this file:

includes/languages/english/html_includes/responsive_classic/define_main_page.php

this file is just a couple lines of code. Maybe it's a banner? I wonder if I could just copy and paste those two lines a couple times to get more of them. Thanks! Sorry, don't want to post actual site in case Russian hackers are hanging out looking for easy prey. That would be me ;) I'm probably paranoid.

Send me a link via PM (Private Message).

CosmosK:

Sorry, don't want to post actual site in case Russian hackers are hanging out looking for easy prey. That would be me ;) I'm probably paranoid.

You can always do something like mysiteDOTcom or mysiiteCOMdot. We can figure it out while the bots won't wasgte their time. Gets more folks involved on the help wagon.:P

Hello members,

I'm using v1.5.7d with an older template (cherry_zen), but now I'm going to go straight-up responsive templates. I tried to load the default template (Responsive Classic), but it won't load in. I also have Responsive All Business templates installed but they won't load either.

On the center page of the Admin, it shows 2 templates, but on the right side box, it shows I have 4 templates. I switch to different templates but nothing changes on the front end.

My goal is to get the Responsive Classic template to load up. Currently the site is live.

Is there a way I can test the template being changed without visitors seeing it? If so, what do I need to do?

Thanks for your valued time!
TesterServers

https://docs.zen-cart.com/user/template/private_testing/

I need to set a global min-width for Zencart so that icon images are displayed no fewer than four to a line (except for mobile devices). I am using the Responsive Classic and presumed the entry for this would be in the mainWrapper line of stylesheet.css . Setting a pixel width there has no effect on the main site. Resizing the browser to a narrow width creates odd overlaps and white space - which is why I wish to restrict this width for the client. So where should the min-width for the page be set

SPython:

I need to set a global min-width for Zencart so that icon images are displayed no fewer than four to a line (except for mobile devices). I am using the Responsive Classic and presumed the entry for this would be in the mainWrapper line of stylesheet.css . Setting a pixel width there has no effect on the main site. Resizing the browser to a narrow width creates odd overlaps and white space - which is why I wish to restrict this width for the client. So where should the min-width for the page be set
I should add that I am using Zencart 1.5.7d

We are using ZenCart 1.5.7d with the built in Responsive Classic template. Our product images with description and purchase button are displayed in columns four to a row. The problem is that when the browser window is resized to a narrow width the columns overlap causing a haphazard rendering of the information and unwanted white space. Any suggestions on how to remedy this in the Admin configuration? Please see attached image.

SPython:

I need to set a global min-width for Zencart so that icon images are displayed no fewer than four to a line (except for mobile devices). I am using the Responsive Classic and presumed the entry for this would be in the mainWrapper line of stylesheet.css . Setting a pixel width there has no effect on the main site. Resizing the browser to a narrow width creates odd overlaps and white space - which is why I wish to restrict this width for the client. So where should the min-width for the page be set

I always work towards fluid rather than fixed website designs, which usually means specifying % values for divs and em's for text rather than pixels or other units in css. As a result, my responsive design tends to be somewhat different to the Responsive Classic, as it allows negative margins and other amazing trickery.

I tend to construct multi-tiered divs to put things into, beginning with a div 100% width of the parent div, which is then subdivided into smaller divs of equal width 1/2 = 50%, 1/3 = 33%, 1/4 = 25%, 1/5 = 20% etc width of their parent div, which is usually controlled by a particular media css attribute that can also specify a minimum and/or maximum pixel width of the div. Float left or right controls the packing or pushing of the divs. Such design provides the basis for centrally placing an image within a div of variable % width of the parent div and then stacking one or more captions beneath the image in separate divs, all controlled by css.

The body css attribute is also used to specify the minimum and/or maximum pixel widths of the overall website.

Hope this helps.

Hi Anne,

I just wanted to ask about a weird thing happing with my web site.

When i enable the header serach box I also get a small search box displayed in the top right column as well.

When I turn off the header search box, both the header search and RHS search box dissapears.

Any idea of how to fix the issue to stop the little search box appearing?

This is independant of the "real" column search box. :)

Many Thanks,
Les :)

I'm new to the responsive classic template. In the desktop view, I'd like to switch to the mobile view if the browser window is smaller than say 750 px. Any suggestions on how to accomplish this?
Thank you.
zc1.5.8a

Many people are using scaling. Some use 125% (Win10 default), others even 175% at their little tiny 4K screens.

The problem I have with responsive_classic is the proportions become all wrong as soon scaling is used. The main container width remains while inner content is being scaled.
I'm styling at a large FHD screen with 100% scaling.

When using my Win 10 17" Workstation with 4K screen the default scaling is set to 250%

I compared to other shops which behave different. They scale everything (not only the inner content) and keep the content 1:1.