Winchester Responsive

Quote:

---

Originally Posted by DivaVocals

I concur, the update function does not work when adding or removing items on the CART page..

---

After further testing I noticed this only happens when the screen gets resized below the 768px width, at full width, it seems to function correctly.

Quote:

---

Originally Posted by rbarbour

After further testing I noticed this only happens when the screen gets resized below the 768px width, at full width, it seems to function correctly.

---

Not in my findings.. and I have this installed on two dev sites.. I see the same behavior on the demo site for this template as well..

Quote:

---

Originally Posted by SPH

but if it is a commercial template then I think I know of it. Thanks.

---

It is indeed a commercial template.. available on Theme Forrest

Quote:

---

Originally Posted by rbarbour

After further testing I noticed this only happens when the screen gets resized below the 768px width, at full width, it seems to function correctly.

---

25" monitor (1920 x 1080), desktop, windows7, firefox29.0.1

Cannot update product quantity in CART screen. Items can be deleted.

If you "view-source", is the issue related to 2 instances of the cart being in the code but only one instance actually visible on the screen?

HTML Code:

---

<!--eof handheld menu display-->

<div id="mobile-nav1">

<a href="http://sandbox.info/index.php?main_page=account"><i class="fa fa-user"></i></a>

<a href="http://sandbox.info/index.php?main_page=advanced_search"><i class="fa fa-search"></i></a>

<div id="header-cart">
  <a href="http://sandbox.info/index.php?main_page=shopping_cart">0.3  - $8.35</a>
      </div>
</div>


<!--bof-navigation display-->
<div id="navMainWrapper">
<div id="navMain">
    <ul class="back">
    <li class="h-login"><a href="http://sandbox.info/index.php?main_page=login">Log In / Register</a></li>
</ul>
</div>
<br class="clearBoth" />
<div id="header-cart">
    <a href="http://sandbox.info/index.php?main_page=shopping_cart">0.3  - $8.35</a>
  </div>
<!--eof-navigation display-->

---

One of the edits that Anne gave me last week actually caused BOTH instances to be visible.

Quote:

---

Originally Posted by yaritai

Hi rbarbour,

I will give my input as I looked into your code for 2.1 a while back to do a small task for a friend. From what I did, the issue is not with the call to mobile detect as it is working. What his site is doing was to revert back to your older code without the session switch display and it does call the correct css responsive files. This is what I did to his:

PHP Code:

---

if ($detect->isMobile() && !$detect->isTablet()) {

    echo mobile.css;
} else if ($detect->isTablet()){
    echo tablet.css;
} else {
    echo default.css;
  } 


---

When taking away the session display it works fine. It was a workaround as the switch was not important to him. So I guess for now, this may be the best alternative for those who want to use the winchester template and still have the capabilities of calling certain specific files.

I was looking at the session switch to see if that was causing the issue but didn't go further since it was not important to him.

---

Yes, you are correct! The above code from 2.0 will suffice for those not looking to use the template display_mode switch.

For those of you that want to use or was expecting to use the core template display_mode switch functions included in my 2.1 framework that I forgot to copy over before submitting, Anne is now and always accepting donations to RESTORE this function. LOL, just kidding, no really. (Made me laugh! :laugh:, my own personal inside joke)

In: \includes\templates\winchester_responsive\common\html_header.php

find:

Code:

---

if ($detect->isMobile() && !$detect->isTablet() && $_SESSION['display_mode']=='isMobile' or $detect->isTablet() && $_SESSION['display_mode']=='isMobile' or $_SESSION['display_mode']=='isMobile'){

    echo $responsive_mobile;

} else if ($detect->isMobile() && $_SESSION['display_mode']=='isTablet' or $detect->isTablet() && $_SESSION['display_mode']=='isTablet' or $_SESSION['display_mode']=='isTablet'){

    echo $responsive_tablet;

} else if ($detect->isMobile() && !$detect->isTablet() && $_SESSION['display_mode']=='isDesktop' or $detect->isTablet() && $_SESSION['display_mode']=='isDesktop' or $_SESSION['display_mode']=='isNonResponsive'){

    echo '';

} else {

    echo $responsive_default;

  }
}

---

and replace with:

Code:

---

if ($detect->isMobile() && !$detect->isTablet() or $detect->isMobile() && !$detect->isTablet() && $_SESSION['display_mode']=='isMobile' or $detect->isTablet() && $_SESSION['display_mode']=='isMobile' or $_SESSION['display_mode']=='isMobile') {

    echo $responsive_mobile;

} else if ($detect->isTablet() or $detect->isMobile() && $_SESSION['display_mode']=='isTablet' or $detect->isTablet() && $_SESSION['display_mode']=='isTablet' or $_SESSION['display_mode']=='isTablet'){

    echo $responsive_tablet;

} else if ($detect->isMobile() && !$detect->isTablet() && $_SESSION['display_mode']=='isDesktop' or $detect->isTablet() && $_SESSION['display_mode']=='isDesktop' or $_SESSION['display_mode']=='isNonResponsive'){

    echo '';

} else {

    echo $responsive_default;

  } 
}

---

I am sure Anne will update promptly!

@DivaVocals, Crystal

The above should work now with the scroller as well.

Code:

---

<?php if ($detect->isMobile() && !$detect->isTablet() or $detect->isMobile() && !$detect->isTablet() && $_SESSION['display_mode']=='isMobile' or $detect->isTablet() && $_SESSION['display_mode']=='isMobile' or $_SESSION['display_mode']=='isMobile') { ?>

<script type="text/javascript"><!--
      $(document).ready(function() {
          $("#foo1").carouFredSel({
     
      auto: false,
                align: "center",
                padding: [0, 25, 0, 20],
                width: "100%",
                height: "auto",
                items: {
          },
                scroll: 1, <!--SHOW 1 ON PHONES-->
                prev    : {
              button  : "#foo1_prev",
                  },
                next    : {
              button  : "#foo1_next",
                  }
            });
        });
      --></script>

<?php } else if ($detect->isTablet() or $detect->isMobile() && $_SESSION['display_mode']=='isTablet' or $detect->isTablet() && $_SESSION['display_mode']=='isTablet' or $_SESSION['display_mode']=='isTablet'){ ?>

<script type="text/javascript"><!--
      $(document).ready(function() {
          $("#foo1").carouFredSel({
     
      auto: false,
                align: "center",
                padding: [0, 25, 0, 20],
                width: "100%",
                height: "auto",
                items: {
          },
                scroll: 3, <!--SHOW 3 ON TABLETS-->
                prev    : {
              button  : "#foo1_prev",
                  },
                next    : {
              button  : "#foo1_next",
                  }
            });
        });
      --></script>

<?php } else if ($detect->isMobile() && !$detect->isTablet() && $_SESSION['display_mode']=='isDesktop' or $detect->isTablet() && $_SESSION['display_mode']=='isDesktop' or $_SESSION['display_mode']=='isNonResponsive'){ ?>

<script type="text/javascript"><!--
      $(document).ready(function() {
          $("#foo1").carouFredSel({
     
      auto: false,
                align: "center",
                padding: [0, 25, 0, 20],
                width: "100%",
                height: "auto",
                items: {
          },
                scroll: 5, <!--SHOW 5 ON NON-RESPONSIVE DESKTOPS-->
                prev    : {
              button  : "#foo1_prev",
                  },
                next    : {
              button  : "#foo1_next",
                  }
            });
        });
      --></script>

<?php } else { ?>

<script type="text/javascript"><!--
      $(document).ready(function() {
          $("#foo1").carouFredSel({
     
      auto: false,
                align: "center",
                padding: [0, 25, 0, 20],
                width: "100%",
                height: "auto",
                items: {
          },
                scroll: 4, <!--SHOW 4 ON RESPONSIVE DESKTOPS-->
                prev    : {
              button  : "#foo1_prev",
                  },
                next    : {
              button  : "#foo1_next",
                  }
            });
        });
      --></script>

<?php }  ?>

---

Quote:

---

Originally Posted by rbarbour

Yes, you are correct! The above code from 2.0 will suffice for those not looking to use the template display_mode switch.

For those of you that want to use or was expecting to use the core template display_mode switch functions included in my 2.1 framework that I forgot to copy over before submitting, Anne is now and always accepting donations to RESTORE this function. LOL, just kidding, no really. (Made me laugh! :laugh:, my own personal inside joke)

In: \includes\templates\winchester_responsive\common\html_header.php

find:

Code:

---

if ($detect->isMobile() && !$detect->isTablet() && $_SESSION['display_mode']=='isMobile' or $detect->isTablet() && $_SESSION['display_mode']=='isMobile' or $_SESSION['display_mode']=='isMobile'){

    echo $responsive_mobile;

} else if ($detect->isMobile() && $_SESSION['display_mode']=='isTablet' or $detect->isTablet() && $_SESSION['display_mode']=='isTablet' or $_SESSION['display_mode']=='isTablet'){

    echo $responsive_tablet;

} else if ($detect->isMobile() && !$detect->isTablet() && $_SESSION['display_mode']=='isDesktop' or $detect->isTablet() && $_SESSION['display_mode']=='isDesktop' or $_SESSION['display_mode']=='isNonResponsive'){

    echo '';

} else {

    echo $responsive_default;

  }
}

---

and replace with:

Code:

---

if ($detect->isMobile() && !$detect->isTablet() or $detect->isMobile() && !$detect->isTablet() && $_SESSION['display_mode']=='isMobile' or $detect->isTablet() && $_SESSION['display_mode']=='isMobile' or $_SESSION['display_mode']=='isMobile') {

    echo $responsive_mobile;

} else if ($detect->isTablet() or $detect->isMobile() && $_SESSION['display_mode']=='isTablet' or $detect->isTablet() && $_SESSION['display_mode']=='isTablet' or $_SESSION['display_mode']=='isTablet'){

    echo $responsive_tablet;

} else if ($detect->isMobile() && !$detect->isTablet() && $_SESSION['display_mode']=='isDesktop' or $detect->isTablet() && $_SESSION['display_mode']=='isDesktop' or $_SESSION['display_mode']=='isNonResponsive'){

    echo '';

} else {

    echo $responsive_default;

  } 
}

---

I am sure Anne will update promptly!

@DivaVocals, Crystal

The above should work now with the scroller as well.

Code:

---

<?php if ($detect->isMobile() && !$detect->isTablet() or $detect->isMobile() && !$detect->isTablet() && $_SESSION['display_mode']=='isMobile' or $detect->isTablet() && $_SESSION['display_mode']=='isMobile' or $_SESSION['display_mode']=='isMobile') { ?>

<script type="text/javascript"><!--
      $(document).ready(function() {
          $("#foo1").carouFredSel({
     
      auto: false,
                align: "center",
                padding: [0, 25, 0, 20],
                width: "100%",
                height: "auto",
                items: {
          },
                scroll: 1, <!--SHOW 1 ON PHONES-->
                prev    : {
              button  : "#foo1_prev",
                  },
                next    : {
              button  : "#foo1_next",
                  }
            });
        });
      --></script>

<?php } else if ($detect->isTablet() or $detect->isMobile() && $_SESSION['display_mode']=='isTablet' or $detect->isTablet() && $_SESSION['display_mode']=='isTablet' or $_SESSION['display_mode']=='isTablet'){ ?>

<script type="text/javascript"><!--
      $(document).ready(function() {
          $("#foo1").carouFredSel({
     
      auto: false,
                align: "center",
                padding: [0, 25, 0, 20],
                width: "100%",
                height: "auto",
                items: {
          },
                scroll: 3, <!--SHOW 3 ON TABLETS-->
                prev    : {
              button  : "#foo1_prev",
                  },
                next    : {
              button  : "#foo1_next",
                  }
            });
        });
      --></script>

<?php } else if ($detect->isMobile() && !$detect->isTablet() && $_SESSION['display_mode']=='isDesktop' or $detect->isTablet() && $_SESSION['display_mode']=='isDesktop' or $_SESSION['display_mode']=='isNonResponsive'){ ?>

<script type="text/javascript"><!--
      $(document).ready(function() {
          $("#foo1").carouFredSel({
     
      auto: false,
                align: "center",
                padding: [0, 25, 0, 20],
                width: "100%",
                height: "auto",
                items: {
          },
                scroll: 5, <!--SHOW 5 ON NON-RESPONSIVE DESKTOPS-->
                prev    : {
              button  : "#foo1_prev",
                  },
                next    : {
              button  : "#foo1_next",
                  }
            });
        });
      --></script>

<?php } else { ?>

<script type="text/javascript"><!--
      $(document).ready(function() {
          $("#foo1").carouFredSel({
     
      auto: false,
                align: "center",
                padding: [0, 25, 0, 20],
                width: "100%",
                height: "auto",
                items: {
          },
                scroll: 4, <!--SHOW 4 ON RESPONSIVE DESKTOPS-->
                prev    : {
              button  : "#foo1_prev",
                  },
                next    : {
              button  : "#foo1_next",
                  }
            });
        });
      --></script>

<?php }  ?>

---

---

I can not thank you enough for working on the fix and posting it :hug: I am working on all of the fixes included so far in this thread and will be submitting an update asap!

Thanks,

Anne

The Demo Site was updated with new php-mobile-detect code as well, please report any errors or findings. Remember not 100% of all devices will be detected and most tablets are now using mobile browsers.

Quote:

---

Originally Posted by DivaVocals

Sooo how do I change the width of the slideshow. I tried modifying this part of the flexible slider stylesheet

Code:

---

.flexslider .slides img {width: 100%;height: auto !important;max-height: 300px;display: block;min-height: 300px;}

---

but I end up with slides the size I want but floated ALL the way to the left instead of centered.. :shocking:

---

If you put a width on the .content-slider, the slide show will expand to fit the width you have specified.

Thanks,

Anne

Quote:

---

Originally Posted by DivaVocals

Not in my findings.. and I have this installed on two dev sites.. I see the same behavior on the demo site for this template as well..

---

Quote:

---

Originally Posted by RixStix

25" monitor (1920 x 1080), desktop, windows7, firefox29.0.1

Cannot update product quantity in CART screen. Items can be deleted.

If you "view-source", is the issue related to 2 instances of the cart being in the code but only one instance actually visible on the screen?

One of the edits that Anne gave me last week actually caused BOTH instances to be visible.

---

I will take a look at this today and post the corrective actions.

Quote:

---

Originally Posted by rbarbour

I will take a look at this today and post the corrective actions.

---

Thank you for your help, rbarbour. I will take a look also ;)

Thanks,

Anne