Responsive Classic Redesign Support thread

to add the X to the navigation

.stylesheet_zcsutom.css

line 266 you will see style
.btn-outline-primary

Just add this to show the X
```
z-index:4;

if you want to resize the navbar width

stylesheet_custom_navigatoion.css
line:12
change the width to the desired size 

.sidebar {
position: fixed;
top: 0;
bottom: 0;
right: 0;
width: 300px;
background-color: #fff;

chadlly2003:

to add the X to the navigation

.stylesheet_zcsutom.css

line 266 you will see style
.btn-outline-primary

Just add this to show the X
```
z-index:4;

> 
> 
> if you want to resize the navbar width
> 
> stylesheet_custom_navigatoion.css
> line:12
> change the width to the desired size 
> 
> ```
.sidebar {
	position: fixed;
	top: 0;
	bottom: 0;
	right: 0;
	width: 300px;  
	background-color: #fff;

Not sure about the z-index helping in any ways.

Resizing the menu to 250 px helps a bit but I think having a button to close the menu would be easier. Just my opinion

nicksab:

Not sure about the z-index helping in any ways.

Resizing the menu to 250 px helps a bit but I think having a button to close the menu would be easier. Just my opinion

line 266 you will see style
.btn-outline-primary
ADD THIS AND YOU WILL SEE THE X

z-index:4;
position:relative;

chadlly2003:

line 266 you will see style
.btn-outline-primary
ADD THIS AND YOU WILL SEE THE X

z-index:4;
position:relative;

thank you very much. It worked

I was missing the position relative on my previous attempt

Fresh install of 2.10. RC Redesign installed.
How do I turn off the stupid Welcome note?

The quickest is to insert

display: none:

after ```
.welcome_note {

around line 3108 of the stylesheet_zcustom.css

Template has been updated.
View Live: https://www.zencartdemo.com/
Download: https://github.com/chadlly2003/zencart_responsive_classic_redesign

The new Version(V3) update includes:

Improved checkout pages and forms – now consistent across all devices for a smoother user experience.

Cleaner, faster performance – unnecessary elements have been removed for better usability and load times.

Enhanced overall design consistency – ensuring a unified look and feel throughout the site.

These updates are focused on providing a more positive and seamless experience for all users moving forward.

dbltoe:

The quickest is to insert

display: none:

> 
> after ```
.welcome_note {

around line 3108 of the stylesheet_zcustom.css

Thanks.

chadlly2003:

Template has been updated.
View Live: https://www.zencartdemo.com/
Download: https://github.com/chadlly2003/zencart_responsive_classic_redesign

The new Version(V3) update includes:

Improved checkout pages and forms – now consistent across all devices for a smoother user experience.

Cleaner, faster performance – unnecessary elements have been removed for better usability and load times.

Enhanced overall design consistency – ensuring a unified look and feel throughout the site.

These updates are focused on providing a more positive and seamless experience for all users moving forward.

Where do I find the version for the template I downloaded a couple of hours ago?

pegasuspublishing:

Where do I find the version for the template I downloaded a couple of hours ago?

you can download it here
https://github.com/chadlly2003/zencart_responsive_classic_redesign/tree/v3

I want to verify which version I downloaded at 12:10pm yesterday (to make certain it's the 3.0 version which is showing a later upload time). I presume one of the files has a version number in it (commented)?

pegasuspublishing:

I want to verify which version I downloaded at 12:10pm yesterday (to make certain it's the 3.0 version which is showing a later upload time). I presume one of the files has a version number in it (commented)?

i am sorry i am still getting used to working with github. I think i removed that version you are looking for. I do apologize for that beginners mistake. If you grab the latest version which is on github i don't anticipate any more changes until the next version upgrade.

I did make a few verson upgrades yesterday because I rushed it. The final version was completed at 11:50pm yesterday. Now feeling confident that the template itself is ready to rock. I really focused on making things easier for the users.

There may be one minor change to the opc checkout file which i will let you know once completed. Shoud have it completed by tomorrow ill send you over the file

chadlly2003:

i am sorry i am still getting used to working with github. I think i removed that version you are looking for. I do apologize for that beginners mistake. If you grab the latest version which is on github i don't anticipate any more changes until the next version upgrade.

I did make a few verson upgrades yesterday because I rushed it. The final version was completed at 11:50pm yesterday. Now feeling confident that the template itself is ready to rock. I really focused on making things easier for the users.

There may be one minor change to the opc checkout file which i will let you know once completed. Shoud have it completed by tomorrow ill send you over the file

I made one minor change to the CSS For One-Page Checkout - Optional file. No other changes were made...

How do I display the link for special product in the category sideboxe?

I can see new product and featured product but the specials product is missing.

How do I get all 3 of these link to display in the hamburger menu as well?

The php code is there but it is not showing. I went thru the css but I was not able to find it unfortunatelylike i did for the centerboxes.

Thank you

nicksab:

How do I display the link for special product in the category sideboxe?

I can see new product and featured product but the specials product is missing.

How do I get all 3 of these link to display in the hamburger menu as well?

The php code is there but it is not showing. I went thru the css but I was not able to find it unfortunatelylike i did for the centerboxes.

Thank you

How do I get all 3 of these link to display in the hamburger menu as well?
PATH: includes\templates\responsive_classic\common\tpl_header.php

add this to line 74. You can create whatever links you need. Use what i gave you as a guide to create the other links

<li><?php echo '<a href="' . zen_href_link(FILENAME_SPECIALS) . '">'; ?> <i class="fa fa-xl fa-fw fa-sack-dollar" aria-hidden="true"> </i> Specials</a></li>

chadlly2003:

How do I get all 3 of these link to display in the hamburger menu as well?
PATH: includes\templates\responsive_classic\common\tpl_header.php

add this to line 74. You can create whatever links you need. Use what i gave you as a guide to create the other links

thank you

nicksab:

thank you

Nick do this instead. its a better solution.
path: includes\templates\responsive_classic\sideboxes\tpl_categories.php
line 62

find

if (SHOW_CATEGORIES_BOX_SPECIALS === 'true' || SHOW_CATEGORIES_BOX_PRODUCTS_NEW === 'true' || SHOW_CATEGORIES_BOX_FEATURED_PRODUCTS === 'true' || SHOW_CATEGORIES_BOX_PRODUCTS_ALL === 'true' || SHOW_CATEGORIES_BOX_FEATURED_CATEGORIES === 'true') {
    // display a separator between categories and links
    if (SHOW_CATEGORIES_SEPARATOR_LINK === '1') {
        $content .= '' . "\n";
    }
    if (SHOW_CATEGORIES_BOX_SPECIALS === 'true') {
        $show_this = $db->Execute("SELECT products_id FROM " . TABLE_SPECIALS . " WHERE status= 1 limit 1");
        if ($show_this->EOF) {
            $content .= '<li><a class="category-links" href="' . zen_href_link(FILENAME_SPECIALS) . '">' . CATEGORIES_BOX_HEADING_SPECIALS . '</a></li>' . "\n";
        }
    }

replace with

 if (SHOW_CATEGORIES_BOX_SPECIALS == 'true' or SHOW_CATEGORIES_BOX_PRODUCTS_NEW == 'true' or SHOW_CATEGORIES_BOX_FEATURED_PRODUCTS == 'true' or SHOW_CATEGORIES_BOX_PRODUCTS_ALL == 'true') {
// display a separator between categories and links
    if (SHOW_CATEGORIES_SEPARATOR_LINK == '1') {
      $content .= '<hr id="catBoxDivider">' . "\n";
    }
    if (SHOW_CATEGORIES_BOX_SPECIALS == 'true') {
      $show_this = $db->Execute("select s.products_id from " . TABLE_SPECIALS . " s where s.status= 1 limit 1");
      if ($show_this->RecordCount() > 0) {
        $content .= '<a class="category-links" href="' . zen_href_link(FILENAME_SPECIALS) . '">' . CATEGORIES_BOX_HEADING_SPECIALS . '</a>' . '<br>' . "\n";
      }
    }

chadlly2003:

Nick do this instead. its a better solution.
path: includes\templates\responsive_classic\sideboxes\tpl_categories.php
line 62

find

if (SHOW_CATEGORIES_BOX_SPECIALS === 'true' || SHOW_CATEGORIES_BOX_PRODUCTS_NEW === 'true' || SHOW_CATEGORIES_BOX_FEATURED_PRODUCTS === 'true' || SHOW_CATEGORIES_BOX_PRODUCTS_ALL === 'true' || SHOW_CATEGORIES_BOX_FEATURED_CATEGORIES === 'true') {
// display a separator between categories and links
if (SHOW_CATEGORIES_SEPARATOR_LINK === '1') {
$content .= '' . "\n";
}
if (SHOW_CATEGORIES_BOX_SPECIALS === 'true') {
$show_this = $db->Execute("SELECT products_id FROM " . TABLE_SPECIALS . " WHERE status= 1 limit 1");
if ($show_this->EOF) {
$content .= '<li><a class="category-links" href="' . zen_href_link(FILENAME_SPECIALS) . '">' . CATEGORIES_BOX_HEADING_SPECIALS . '</a></li>' . "\n";
}
}

> 
> 
> replace with
> 
> ```
 if (SHOW_CATEGORIES_BOX_SPECIALS == 'true' or SHOW_CATEGORIES_BOX_PRODUCTS_NEW == 'true' or SHOW_CATEGORIES_BOX_FEATURED_PRODUCTS == 'true' or SHOW_CATEGORIES_BOX_PRODUCTS_ALL == 'true') {
// display a separator between categories and links
    if (SHOW_CATEGORIES_SEPARATOR_LINK == '1') {
      $content .= '<hr id="catBoxDivider">' . "\n";
    }
    if (SHOW_CATEGORIES_BOX_SPECIALS == 'true') {
      $show_this = $db->Execute("select s.products_id from " . TABLE_SPECIALS . " s where s.status= 1 limit 1");
      if ([B]$show_this->RecordCount() > 0)[/B] {
        $content .= '<a class="category-links" href="' . zen_href_link(FILENAME_SPECIALS) . '">' . CATEGORIES_BOX_HEADING_SPECIALS . '</a>' . '<br>' . "\n";
      }
    }

Just a note for your future development efforts: It's more performant to use !$show_this->EOF instead of the highlighted clause above.

I created a product image gallery with thumbnails, drag/swipe scrolling, arrows optional infinite scroll, and a modal lightbox.

This will be a simple drag and drop right into the template. Would love some feedback before i submit to GitHub and zencart.......

This is example of Inifinite scroll
https://www.zencartdemo.com/index.php?main_page=product_info&cPath=22&products_id=34

this is a without infinite scroll
https://www.zencartdemo.com/index.php?main_page=product_info&cPath=3_11&products_id=5

Just the lightbox
https://www.zencartdemo.com/index.php?main_page=product_info&cPath=24&products_id=52

Arrows are optional
Infinite scroll optional
Thumb Scroll optional

This is simply GREAT!
My first reaction was 'Wooah...'
I tested the demo site on a smart phone and a big screen PC, everything looks great and works great! On big screen, where thumbnails are on the left, I did not see at first that I could scroll up and down and thought there were only 5 images for Bugs' Life DVD. After watching the gallery, I realized there were more and found out I can scroll through thumbnails even on a big screen PC, which I think is still a rare functionality at this size of screen. Perhaps a visual indicator that scrolling is possible would be nice.
I really hope that this will become a ZC core functionnality.