MiniCart - How do I set up the script as a function to call?

Questions and answers about ShopSite Custom Templates

MiniCart - How do I set up the script as a function to call?

Postby OnScreenSupply » Thu Feb 21, 2013 12:46 pm

Good afternoon,

I'm in the process of setting up my store using ShopSite Pro 11.2. I set up the mini cart script to work with my site, www.onscreensupply.com and it appears to be working correctly. However I'm not using the WYSIWYG editor that comes with the office back-end and instead I'm using my own HTML pages. I don't have the actual shopping cart portion live yet on the web since we don't expect our products to arrive until possibly early next week. I'm not very well versed in Javascript and jQuery but I'm learning. Now, the script I got and tweaked from this tutorial here (http://www.shopsite.com/templates/cookbook/tips-minicart-outsideshopsite.shtml) is quite long and would crowd up my HTML, not to mention make it harder to format. I already saved it to it's own .js file, but the question is how would I call this script into action in my header on my site? Any help would be appreciated :)
OnScreenSupply
 
Posts: 3
Joined: Thu Feb 21, 2013 12:37 pm

Re: MiniCart - How do I set up the script as a function to c

Postby OnScreenSupply » Mon Feb 25, 2013 6:32 am

I still need help with this. I've tried to figure it out myself with no avail.

Here is the code I have for OSSMiniCart.js:
Code: Select all
/**** Mini Cart Subtotal Display ****/

/**** REPLACE THE VALUES IN THESE LINES ****/
var serialnum="0001455521";
var cartURL="http://shopsite.fatcow.com/ss11.2/sc/order.cgi?storeid=*2616dbafe496f840a34abfc04ab620713948bdfee2&function=show";
var textColor="white";
var backgroundColor="transparent";
var showCart="yes";       // only "yes" or "no"
var cartColor="white";    // only "black" or "white"
var textAlign="right";     // only "left" "right" or "center"

/**** DON'T CHANGE ANYTHING BELOW HERE ****/

var linkColor=textColor;
var cookies=document.cookie;  //read in all cookies
var start = cookies.indexOf("ss_cart_" + serialnum + "=");
var cartvalues = "";
var linecount = 0;
var start1;
var end1;
var tmp;

function displayMiniCart();
{
// Start Output
document.write("<div style=\"color:" + textColor + ";");
document.write("background-color:" + backgroundColor + ";");
document.write("text-align:" + textAlign + ";");
document.write("font-family: Verdana, Arial, Helvetica, sans-serif;");
document.write("font-size: 8pt;");
document.write("\">\n");
if (showCart == "yes")
{
  document.write("<a href=\"");
  document.write(cartURL + "\"");
  document.write(">");
  document.write("<img src=\"store/media/themesmedia/cart-" + cartColor + ".gif\" border=\"0\" align=\"top\">");
  document.write("</a> ");
}

if (start == -1)  //No cart cookie
{
  document.write("<a href=\"" + cartURL + "\" style=\"color:" + linkColor + "\">");
  document.write("0 Items");
  document.write("</a> ");
  document.write("</div>\n");
}
else   //cart cookie is present
{
  start = cookies.indexOf("=", start) +1; 
  var end = cookies.indexOf(";", start); 

  if (end == -1)
  {
    end = cookies.length;
  }

  cartvalues = unescape(cookies.substring(start,end)); //read in just the cookie data

  start = 0;
  while ((start = cartvalues.indexOf("|", start)) != -1)
  {
    start++;
    end = cartvalues.indexOf("|", start);
    if (end != -1)
    {
      linecount++;

      if (linecount == 2) // Total Quantity of Items
      {
        tmp = cartvalues.substring(start,end);
        colon = tmp.indexOf(":", 0);
        document.write("<a href=\"" + cartURL + "\" style=\"color:" + linkColor + "\">");
        document.write(tmp.substring(colon+1,end - start));
        if ((tmp.substring(colon+1,end - start)) == 1 )
        {
          document.write(" Item");
        }
        else
        {
          document.write(" Items");
        }
        document.write(": ");
      }

      if (linecount == 3)  // Product Subtotal
      {
        tmp = cartvalues.substring(start,end);
        colon = tmp.indexOf(":", 0);
        document.write(tmp.substring(colon+1,end - start));
        document.write("</a>");
      }

      start = end;
    }
    else
      break;
    }
  } // end while loop

  //close minicart HTML
  document.write("</div>\n");
}


And here's what I have in my HTML document. In the head tags I put:
Code: Select all
<script src="js/OSSMiniCart.js" type="text/javascript"></script>


And in the body where I want it to display I put this:
Code: Select all
<div><script>displayMiniCart();</script></div>


What am I doing wrong or what do I need to change? Nothing shows up right now.
OnScreenSupply
 
Posts: 3
Joined: Thu Feb 21, 2013 12:37 pm

Re: MiniCart - How do I set up the script as a function to c

Postby Jim » Mon Feb 25, 2013 7:58 am

Because the mini cart relies on cookies, which must be read by the domain they are written by, the mini cart cannot be used on sites where the cart domain name and the store pages domain name are not the same.

You have the cartURL value set with the domain name http://shopsite.fatcow.com I really doubt that your store pages are at that domain.

The only way to get it to work is to have your store installed with the pages and the shopping cart urls being the same. I don't know if fatcow will allow that kind of configuration so you will need to check with them and find out. Basically this means that you will either have to have your on install area for the shopping cart cgis, instead of a shared area like they typically do. I know that at one of the other hosting companies owned by the same owners they will install stores on a different server so that this can be accomplished, but I don't know if Fatcow does that.

This still doesn't answer your direct question but there is no sense in spending more time trying to get it to work when there is no way possible under your current setup.

I don' know much about javascript so can't give you an exact answer as to how to accomplish what you are trying to do but you might look at the files used in the Stained Glass theme sg_page_template which has this code for displaying the minicart
Code: Select all
 <script type="text/javascript" language="JavaScript">
            DisplayMiniCart("ss_cart_[-- STORE_Serial_Number --]","Subtotal");
          </script>

The sg_page_template includes the file Page-Head include file which loads the minicart javascript with this line
Code: Select all
[-- IF MiniCart --][-- INCLUDE MiniCart.js PROCESS --][-- END_IF --]

You will want to compare the MiniCart.js file with the minicart javascript code you are trying to use to see how the function is implemented.
Jim
Site Admin
 
Posts: 4953
Joined: Fri Aug 04, 2006 1:42 pm
Location: Utah

Re: MiniCart - How do I set up the script as a function to c

Postby OnScreenSupply » Mon Feb 25, 2013 9:34 am

I see. Fatcow appears to host the actual shopping cart on their secure server. Upon further testing you appear to be right. It displays the widget, but it doesn't update the price or quantity. I'm just going to go with my fallback plan of simply linking the cart at the top of the page. Thank you for your help!
OnScreenSupply
 
Posts: 3
Joined: Thu Feb 21, 2013 12:37 pm


Return to Custom Template Questions

Who is online

Users browsing this forum: No registered users and 23 guests

cron