Como podemos ajudar?

FC 15061 :: Como exibir o frete na página do carrinho de compras?

Veja como calcular o valor do frete na página que contém os produtos adicionados ao carrinho.

O frete costuma ser um dos fatores determinantes para o fechamento de um pedido. Se este é um dos diferenciais de sua loja, ative este recurso de acordo com as instruções deste artigo.

Veja abaixo como o cliente poderá obter o valor do frete na página do carrinho, antes do checkout:

1º Passo

Inclua o código abaixo no fim do arquivo Rodape.htm:

<script>
if(FC$.Page=="Cart" && (FC$.TypeFrt==3 || FC$.TypeFrt==4)){
var iValorCesta=<ValorCesta>;
fnCustomizeCart();
}
</script>

2º Passo

Inclua o código abaixo no fim do arquivo LojaLib.js:

// ############# Cálculo de frete na cesta #######################
function fnCustomizeCart(){
//insere campo solicitando o CEP para cálculo do lado esquerdo
var oFCCartSubtotals=document.getElementById("FCCartSubtotals");
if(document.getElementById("idColPesoFC"))var sColspan=3; else var sColspan=2;
if(oFCCartSubtotals){
var oNewElement=document.createElement("tr");
oNewElement.setAttribute("id","FCCartFreightCalc");
oNewElement.setAttribute("class","not-on-small");
var oTRFreightCalc=oFCCartSubtotals.parentNode.insertBefore(oNewElement,oFCCartSubtotals);
oTRFreightCalc.innerHTML="<td>Digite o CEP para calcular o frete: <input type=text id=idZipC1 size=10 maxlength=9 class=InputText> <input type=button value='Calcular frete' class=idBut class=InputButton onclick='fnGetShippingValue(1)'></td><td align=right colspan="+ sColspan +"><span id=idShippingObs1></span></td><td align=right><span id=idShippingValue1></span><img src='/images/loading.gif' vspace=3 style='display:none' id=idImgLoadingCEP1></td>";
}
//insere campo solicitando o CEP para cálculo do lado direito
var oFCCartRight=document.getElementById("FCCartSmallSubtotalPrice");
if(!oFCCartRight)oFCCartRight=document.getElementById("FCCartSmallSubtotals");
if(oFCCartRight){
var oNewElement=document.createElement("div");
oNewElement.setAttribute("id","FCCartSmallFreightCalc");
var oTRFreightCalc=oFCCartRight.parentNode.insertBefore(oNewElement,oFCCartRight);
/* var sCEPCont="<div id='FCCartSmallFreight'>";
sCEPCont+=" <div class='FCCartFreightInfo'>";
sCEPCont+=" <span class='FCCartFreightLabel'>Digite o CEP para calcular o frete:</span>";
sCEPCont+=" <input type=number id=idZipC2 size=10 maxlength=9 class=InputText>";
sCEPCont+=" <div id='FCCartSmallFreightBut'>";
sCEPCont+=" <input type=button value='Calcular frete' class=idBut class=InputButton onclick='fnGetShippingValue(2)'>";
sCEPCont+=" </div>";
sCEPCont+=" <img src='/images/loading.gif' vspace=3 style='display:none' id=idImgLoadingCEP2>";
sCEPCont+=" </div>";
sCEPCont+="</div>";
sCEPCont+="<div id='FCCartSmallFreightPrice'>";
sCEPCont+=" <ul>";
sCEPCont+=" <li class='FCCartFreightPriceLabel' id=idShippingObs2>Frete:</li>";
sCEPCont+=" <li class='FCCartFreightPriceValue' id=idShippingValue2>Calcule acima</li>";
sCEPCont+=" </ul>";
sCEPCont+="</div>";*/
var sCEPCont="<div id='FCCartSmallFreight'>";
sCEPCont+=" <div id='FCCartSmallFreight-title'>";
sCEPCont+=" <span class='FCCartFreightLabel'>Digite o CEP para calcular o frete</span>";
sCEPCont+=" </div>";
sCEPCont+=" <div class='FCCartSmallFreight-field' id='FCCartSmallFreight-input'>";
sCEPCont+=" <input type=text id=idZipC2 size=10 maxlength=9 class=InputText>";
sCEPCont+=" <input type=button value='OK' class=idBut class=InputButton onclick='fnGetShippingValue(2)'>";
sCEPCont+=" </div>";
sCEPCont+=" <img src='/images/loading.gif' vspace=3 style='display:none' id=idImgLoadingCEP2>";
sCEPCont+=" </div>";
sCEPCont+="</div>";
sCEPCont+="<div id='FCCartSmallFreightPrice'>";
sCEPCont+=" <ul>";
sCEPCont+=" <li class='FCCartFreightPriceLabel' id=idShippingObs2>Frete:</li>";
sCEPCont+=" <li class='FCCartFreightPriceValue' id=idShippingValue2>Calcule acima</li>";
sCEPCont+=" </ul>";
sCEPCont+="</div>";
oTRFreightCalc.innerHTML=sCEPCont;
fnGetCEP();
}
}
function fnGetCEP(){
//se já tem CEP em cookie já mosta cálculo
var sNumCEP=FCLib$.GetCookie("CEP"+FC$.IDLoja);
if(sNumCEP && sNumCEP!=""){
document.getElementById("idZipC1").value=sNumCEP;
document.getElementById("idZipC2").value=sNumCEP;
fnGetShippingValue(0);
}
}
function fnGetShippingValue(iField){
if(iField==0){
var sCEP=document.getElementById("idZipC1").value;
if(sCEP=="")sCEP=document.getElementById("idZipC2").value;
}
else{
var sCEP=document.getElementById("idZipC"+iField).value;
}
document.getElementById("idZipC1").value=sCEP;
document.getElementById("idZipC2").value=sCEP;
FCLib$.SetCookie("CEP"+FC$.IDLoja,sCEP);
if(sCEP==""){
document.getElementById("idShippingValue1").innerHTML="<span style=color:#990000;>Informe o CEP</span>";
document.getElementById("idShippingValue2").innerHTML="<span style=color:#990000;>Informe o CEP</span>";
}
else{
document.getElementById("idShippingValue1").innerHTML="";
document.getElementById("idShippingValue2").innerHTML="";
var oImgLoadingCEP1=document.getElementById("idImgLoadingCEP1");
if(oImgLoadingCEP1){oImgLoadingCEP1.style.display="";}
var oImgLoadingCEP2=document.getElementById("idImgLoadingCEP2");
if(oImgLoadingCEP2){oImgLoadingCEP2.style.display="";}
AjaxExecFC("/xmlshippingcep.asp","idloja="+ FC$.IDLoja +"&cep="+ sCEP,false,fnprocessXMLCEPC);
}
}
function fnprocessXMLCEPC(obj){
var oShippingObs1=document.getElementById("idShippingObs1");
var oShippingObs2=document.getElementById("idShippingObs2");
var oShippingValue1=document.getElementById("idShippingValue1");
var oShippingValue2=document.getElementById("idShippingValue2");
var iErr=ReadXMLNode(obj,"err");if(iErr==null)return;
if(iErr!="0"){
var oImgLoadingCEP1=document.getElementById("idImgLoadingCEP1");
if(oImgLoadingCEP1){oImgLoadingCEP1.style.display="none";}
var oImgLoadingCEP2=document.getElementById("idImgLoadingCEP2");
if(oImgLoadingCEP2){oImgLoadingCEP2.style.display="none";}
oShippingValue1.innerHTML="<span id=idErrXMLCEPFC style=color:#990000;>"+ ReadXMLNode(obj,"msg") +"</span>";
oShippingValue2.innerHTML="<span id=idErrXMLCEPFC style=color:#990000;>"+ ReadXMLNode(obj,"msg") +"</span>";
return;
}
oShippingObs1.innerHTML="";oShippingObs2.innerHTML="";oShippingValue1.innerHTML="";oShippingValue2.innerHTML="";
var OptName=ReadXMLNode(obj,"Opt1Name");
var OptValue=ReadXMLNode(obj,"Opt1Value");
var OptObs=ReadXMLNode(obj,"Opt1Obs");
//oShippingObs1.innerHTML="<b>"+ OptName +"</b><br><span class=ObsFreightCalc>"+ OptObs +"</span>";
//oShippingObs2.innerHTML="<b>"+ OptName +"</b><br><span class=ObsFreightCalc>"+ OptObs +"</span>";
oShippingObs1.innerHTML="<b>Frete:</b>";
oShippingObs2.innerHTML="<b>Frete:</b>";
oShippingValue1.innerHTML=OptValue;oShippingValue1.style.display="block";
oShippingValue2.innerHTML=OptValue;oShippingValue2.style.display="block";
var oImgLoadingCEP1=document.getElementById("idImgLoadingCEP1");
if(oImgLoadingCEP1){oImgLoadingCEP1.style.display="none";}
var oImgLoadingCEP2=document.getElementById("idImgLoadingCEP2");
if(oImgLoadingCEP2){oImgLoadingCEP2.style.display="none";}
//remove elementos
var oFCCartTotalCalc=document.getElementById("FCCartTotalCalc");
if(oFCCartTotalCalc){oFCCartTotalCalc.parentNode.removeChild(oFCCartTotalCalc);}
var oFCCartSmallTotalPrice=document.getElementById("FCCartSmallTotalPrice");
if(oFCCartSmallTotalPrice){oFCCartSmallTotalPrice.parentNode.removeChild(oFCCartSmallTotalPrice);}
//exibe total com frete
var iValFrete=OptValue.replace("R$ ","").replace(",",".");
var iTotalCesta=parseFloat(iValorCesta)+parseFloat(iValFrete);
//insere totais na tabela principal
var oLocalInsert=document.getElementById("FCCartWrapTotal"); //se tem embalagem, tenta usar esta posição primeiro
if(!oLocalInsert)oLocalInsert=document.getElementById("FCCartSubtotalPrice");
if(!oLocalInsert)oLocalInsert=document.getElementById("FCCartSubtotals");
if(oLocalInsert){
var oNewElement=document.createElement("tr");
oNewElement.setAttribute("id","FCCartTotalCalc");
oNewElement.setAttribute("class","not-on-small");
if(document.getElementById("idColPesoFC"))var sColspan=" colspan=2"; else var sColspan="";
oNewElement.innerHTML="<td colspan=3 align=right><b>Total:</b></td><td align=right"+ sColspan +"><b>"+ FormatPrice(iTotalCesta,FC$.Currency) +"</b></td>";
fnInsertAfter(oNewElement,oLocalInsert);
}
//insere totais na tabela small
var oLocalInsert=document.getElementById("FCCartSmallWrapTotal");
if(!oLocalInsert)oLocalInsert=document.getElementById("FCCartSmallSubtotalPrice");
if(!oLocalInsert)oLocalInsert=document.getElementById("FCCartSmallSubtotals");
if(oLocalInsert){
var oNewElement=document.createElement("div");
oNewElement.setAttribute("id","FCCartSmallTotalPrice");
oNewElement.innerHTML="<ul><li class='FCCartSubtotalPriceLabel'>Total:</li><li class='FCCartSubtotalPriceValue'><b>"+ FormatPrice(iTotalCesta,FC$.Currency) +"</b></li></ul>";
fnInsertAfter(oNewElement,oLocalInsert);
}
}
function fnInsertAfter(newNode, referenceNode) {
referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
}
// ############# Cálculo de frete na cesta #######################

3º Passo

Inclua o código abaixo no fim do arquivo LojaSite.css:

/* Para cálculo de frete no carrinho */
.FCCartRightCol{display:none}
.FCCartLeftCol{width:100%}
.ObsFreightCalc{font-size:11px}
#FCCartFreightSimulation,#FCCartSmallFreightSimulationBut{display:none}
#FCCartFreightCalc .idBut{margin-left:3px;transition:background-color .3s ease;background-color:#424242;border-radius:2px;-webkit-border-radius:2px;-moz-border-border-radius:2px;border:none;padding:11px 25px;color:#ffffff;cursor:pointer;font-weight:bold;font-size:0.9rem}
#FCCartSmallFreightCalc .idBut{margin-left:3px;transition:background-color .3s ease;background-color:#424242;border:none;padding:11px 25px;color:#ffffff;cursor:pointer;font-weight:bold;font-size:0.9rem}
#FCCartSmallFreight{margin-top:13px}
#FCCartSmallFreightCalc .idBut{margin:6px 0}
#idZipC1,#idZipC2{height:25px;font-size:0.8rem}
#FCCartSmallFreightPrice{float:right;text-align:right;max-width:500px;height:100%;border-radius:2px;white-space:nowrap}
#FCCartSmallFreightPrice ul{margin:0px;padding:0}
#FCCartSmallFreightPrice ul li{list-style:none;float:left}
#FCCartSmallFreightPrice .FCCartFreightPriceLabel{width:200px;padding:5px 2px;height:40px}
#FCCartSmallFreightPrice .FCCartFreightPriceValue{width:80px;padding:5px 2px;font-weight:bold;height:40px;display:flex;display:-webkit-flex;align-items:center;-webkit-align-items:center;justify-content:flex-end;-webkit-justify-content:flex-end}
#FCCartSmallTotalPrice{float:right;text-align:right;max-width:500px;height:100%;border-radius:2px;white-space:nowrap}
#FCCartSmallTotalPrice ul{margin:0px;padding:0}
#FCCartSmallTotalPrice ul li{list-style:none;float:left}
#FCCartSmallTotalPrice .FCCartSubtotalPriceLabel{width:200px;padding:5px 2px}
#FCCartSmallTotalPrice .FCCartSubtotalPriceValue{width:80px;padding:5px 2px;font-weight:bold}
#FCCartSmallFreightPrice ul li{width:50%!important;float:left;border:1px solid #e8e8e8;padding:8px 10px!important;box-sizing:border-box;list-style:none}
#FCCartSmallFreightPrice ul li:first-child{border-right:0}
#FCCartSmallFreightPrice ul li:last-child{font-weight:bold}
#FCCartSmallFreightPrice{width:100%}
#FCCartSmallTotalPrice ul li{width:50%!important;float:left;border:1px solid #e8e8e8;padding:8px 10px!important;box-sizing:border-box;list-style:none}
#FCCartSmallTotalPrice ul li:first-child{border-right:0}
#FCCartSmallTotalPrice ul li:last-child{font-weight:bold}
#FCCartSmallTotalPrice{width:100%}
/* Para cálculo de frete no carrinho */