momentary $0 shows on reload

hi there.
I'm setting up foxycart, and notice that when I reload the page or navigate, the minicart on my site will show $0 in the cart before reloading the correct amount. a 1 or 2 second delay. Its not major, just seems odd, but I've never seen this on websites before, and am wondering if I'm doing something wrong.
FYI, I am on the free test version now.
Is this normal for the test version?
Will this go away once I get it properly set up with a subscription?
Thx in advance.
Comments
  • fc_adamfc_adam FoxyCart Team
    @purpleontime,

    What you're seeing there is related to our javascript loading on the page. The total value of the current cart is reliant on our javascript loading and fetching the current customers session. This will be the same no matter if you have a paid subscription or not.

    You could set the mini-cart to be initially hidden, and then it will display once our javascript has loaded. Assuming you're on version 2.0 - if you set up your minicart's parent element to have the data-fc-id="minicart" data attribute, and also give it an initial style of display:none, the minicart should then display once our javascript is loaded. That way - you won't see the initial flash of $0 - but it will just appear once our javascript is good to go.
  • I am on the 2.0 version. Would you mind showing me where to place the display-none?
  • fc_adamfc_adam FoxyCart Team
    @purpleontime,

    You could place it directly on that same element as an inline style like style="display:none;" or you could add it to your site's CSS stylesheet and connect it with that element by way of a class.
  • purpleontimepurpleontime Member
    edited September 2015
    still lost. Can't figure out where to put it. Very limited coding skills, so maybe this is too advanced for me unless you can baby-step me through...

    Here is what I got:

    <p style="color: #000000; background-color: #ffffff" align="right" data-fc-id="minicart">
    <a href="https://wrenandcuff.foxycart.com/cart?cart=view">
    <i class="fa fa-shopping-cart">&nbsp;&nbsp;&nbsp;</i>
    <span data-fc-id="minicart-quantity">0</span>
    <span data-fc-id="minicart-singular"> item </span>
    <span data-fc-id="minicart-plural"> items </span>
    <b> $
    <span data-fc-id="minicart-order-total">0</span>
    </b>
    </a>
    </p>
  • purpleontimepurpleontime Member
    edited September 2015
    arrg. my comment keeps displaying the result of the code. trying to show you the raw code
    Hopefully you can see the code somehow in my previous post
  • fc_adamfc_adam FoxyCart Team
    edited September 2015
    @purpleontime - I've just fixed up the code in your previous post.

    For where to place what I mentioned - you do that like this:
    <p style="color: #000000; background-color: #ffffff" align="right" data-fc-id="minicart" style="display:none;"> 
    <a href="https://wrenandcuff.foxycart.com/cart?cart=view">;
    <i class="fa fa-shopping-cart">&nbsp;&nbsp;&nbsp;</i>
    <span data-fc-id="minicart-quantity">0</span>
    <span data-fc-id="minicart-singular"> item </span>
    <span data-fc-id="minicart-plural"> items </span>
    <b> $
    <span data-fc-id="minicart-order-total">0</span>
    </b>
    </a>
    </p>
    See it included in the p element, right after data-fc-id="minicart"
  • Thx. Still not working tho. I had actually tried that already, but just to be sure I copy pasted all of your code. Same thing, still get the momentary $0.
    Any other ideas as to what the prob is?
    thx so much
  • purpleontimepurpleontime Member
    edited September 2015
    got it. there were two styles. I grabbed yours, and put it into the first style, then deleted the second. fixed it.

    <p style="color: #000000; background-color: #ffffff; display:none" align="right" data-fc-id="minicart">
    <a href="https://wrenandcuff.foxycart.com/cart?cart=view">
    <i class="fa fa-shopping-cart">&nbsp;&nbsp;&nbsp;</i>
    <span data-fc-id="minicart-quantity">0</span>
    <span data-fc-id="minicart-singular"> item </span>
    <span data-fc-id="minicart-plural"> items </span>
    <b> $
    <span data-fc-id="minicart-order-total">0</span>
    </b>
    </a>
    </p>
  • fc_jedfc_jed FoxyCart Team
    @purpleontime

    We're glad you found out what's wrong and resolved the issue. If you have additional concerns, please let us know. We're happy to help.
  • fc_adamfc_adam FoxyCart Team
    @purpleontime - oh great catch, sorry for missing that myself
  • Hi again. Can you tell me a way to change the color of all the text? using the paragrap font color doesn't work on the span, or anything. I'd like to change the cart, and all text in minicart.
    thank you
  • fc_adamfc_adam FoxyCart Team
    @purpleontime,

    I think what you're running into is that the link is overwriting the paragraph colouring with the link styles. You could apply a style attribute to the <a> element to add the text colour there.
Sign In or Register to comment.