下载文档原格式
Zen-cart网店后台操作教程一、商店基本设置 (2)二、网店首页导航栏和底部导航栏的设置 (4)三、网店首页左右布局栏设置 (6)四、如何添加广告图 (7)五、如何添加产品分类及产品 (9)六、如何上传产品多图 (14)七、如何设置推荐产品及特价产品 (15)八、如何添加批量价格折扣 (17)九、如何批量价格更新 (19)十、付款方式的设置1）PayPal IPN - PayPal即时付款通知 (20)2）PayPal checkout – PayPal 快速付款 (23)3）银行付款、西联付款 (27)十一、运输方式的设置1）免运费的设置 (29)2）多地区运费、DHL 、EMS 、UPS运费的设置 (31)3）4PX 物流运输模块设置 (33)十二、属性的设置 (35)十三、商品的评价管理 (42)十四、如何使用优惠券 (45)十五、如何管理订单 (49)十六、订单统计分析 (51)一、商店设置 Configuration1）商店基本设置 Configuration→My Store※选择基本设置进入商店管理页面网站前台及后台网页标签标题、及关键字定义，为客户做收藏方便及网站搜索优化。
注：在My Store这里，主要设置商店名称、店主、国家/地区及商店地址和电话，其它按默认设置即可。
2）网站logo自由更换功能网站logo图片替换及显示文本替换功能，前台的展示如下：后台修改位置：3）电子邮件的设置（ E-mail option）进入电子邮件管理页面:邮件发送方式：smtpauth二、网站的首页导航和底部导航而设置1） 进入后台 Tools →EZ-pages如果选用的是Google 邮箱， 请参考此设置。
如果是其它邮箱，可去google 中查询所得。
上图，Header表示网站顶部导航条，Footer表示网站底部导航条，绿色按钮表示已经开启，红色表示关闭，但是一定记得根据要排列先后顺序进行排序，前台才会显示。
javascript图⽚切换综合实例（循环切换、顺序切换）本⽂实例为⼤家介绍了javascript图⽚切换的两种⽅式，循环切换以及顺序切换的实例代码，分享给⼤家供⼤家参考，具体内容如下<html><head><meta charset="utf-8"><style>p{margin:0;}input{border:none;outline: none;margin:0;padding:0;}img{width:300px;height:300px;}#loop{margin-left:50px;background:#c80;width:60px;height:40px;font-size:14px;line-height:20px;text-align: center;}#order{margin-left:50px;background:#c80;width:60px;height:40px;font-size:14px;line-height:20px;text-align:center;}div{width:300px;height:300px;position:relative;}span{position:absolute;left:0;top:0;width:300px;height:20px;font-size:14px;line-height:20px;background:#000;opacity:0.5;color:#fff;text-align: center;}div p{position:absolute;left:0;bottom:0;width:300px;height:20px;font-size:14px;line-height:20px;text-align: center;color:#fff;background:#000;opacity:0.5;} div input{position:absolute;width:60px;height:60px;top:100px;background:pink;}#back{left:0;}#next{right:0;}</style><script type="text/javascript">window.onload=function(){//循环切换var oNext=document.getElementById("next");var oBack=document.getElementById("back");var oImg=document.getElementById("img");var oText=document.getElementById("text");var oSpan=document.getElementById("span");var oLoop=document.getElementById("loop");var Oorder=document.getElementById('order');var oText1=document.getElementById("text1");var aImg=["img/1.jpg","img/2.jpg","img/3.jpg","img/4.jpg"];var aText=["图⽚1","图⽚2","图⽚3","图⽚4"];var num=0;//点击下⼀张事件function next(){num=num+1; //每次加⼀//进⾏判断，如果num⼤于最后⼀张时,图⽚返回第⼀张//// 1 2 3 4if(num>aImg.length-1){num=0;}oImg.src=aImg[num];oText.innerHTML=aText[num];//图⽚信息变化，与数组关联oSpan.innerHTML=(num+1)+"/"+aImg.length;//数量变化，与数组关联//alert(num);}function back(){num=num-1;//进⾏判断，如果图⽚⼩于第⼀张时,图⽚返回最后⼀张if(num<0){num=aImg.length-1;}oImg.src=aImg[num];oText.innerHTML=aText[num];//图⽚信息变化，与数组关联oSpan.innerHTML=(num+1)+"/"+aImg.length;//数量变化，与数组关联}function next1(){num=num+1; //每次加⼀//进⾏判断，如果num⼤于最后⼀张时,弹出警告并把图⽚定在最后⼀张//// 1 2 3 4if(num>aImg.length-1){num=aImg.length-1;alert("最后⼀张了");}oImg.src=aImg[num];oText.innerHTML=aText[num];oSpan.innerHTML=num+1+"/"+aImg.length;//alert(num);function back1(){num=num-1;//进⾏判断，如果图⽚⼩于第⼀张时，弹出警告并把图⽚定在第⼀张if(num<0){num=0;alert("已经是第⼀张了");}oImg.src=aImg[num];oText.innerHTML=aText[num];oSpan.innerHTML=num+1+"/"+aImg.length;}oNext.onclick=next;oBack.onclick=back;oLoop.onclick=function(){oText1.innerHTML="图⽚可以从第⼀张到最后⼀张循环切换";oNext.onclick=next;oBack.onclick=back;}Oorder.onclick=function(){oText1.innerHTML="图⽚只能从第⼀张到最后⼀张顺序切换";oNext.onclick=next1;oBack.onclick=back1;}}</script></head><body><input id="loop" type="button" name="" value="循环切换"/><input id="order"type="button" name="" value="顺序切换"/><p id="text1">图⽚可以从第⼀张到最后⼀张循环切换</p><div><input id="back" type="button" name="" value="上⼀张"/><input id="next" type="button" name="" value="下⼀张"/><img id="img" src="img/1.jpg"/><span id="span">1/4</span><p id="text">图⽚1</p></div></body></html>图⽚切换即两张图⽚轮流切换代码：<html lang="en"><head><meta charset="utf-8"><style>#text{width:200px;height:200px;font-size:40px;line-height:40px;text-align: center;} img{width:200px;height:200px;}</style><script type="text/javascript">window.onload=function(){var oBtn=document.getElementById("btn");var oImg=document.getElementById("img");var oText=document.getElementById("text");var onOff=true;oBtn.onclick=function(){if(onOff){oImg.src="img/7.jpg";oText.innerHTML="图⽚2";onOff=false;}else{oImg.src="img/5.jpg";oText.innerHTML="图⽚1";onOff=true;}}</script></head><body><input id="btn" type="button" name="" value="切换图⽚"/><img id="img" src="img/5.jpg"/><p id="text">图⽚1</p></body></html>以上就是本⽂的全部内容，希望对⼤家的学习javascript程序设计有所帮助。
巧⽤数组制作图⽚切换js代码在前⾯的⽂章中，我们讲到了js中数组的具体操作，详见（），这⾥就不再做详细的讲解。
今天主要的⽬的是如何⽤数组进⾏图⽚的简单左右切换。
本⽂中的图⽚切换具体步骤如下：第1步：简单的布局并设计基本的显⽰样式；第2步：通过js获取相关元素；第3步：通过数组进⾏图⽚url和对应⽂字描述的存储；第4步：初始化：包括图⽚的初始化，显⽰图⽚数字以及对应⽂字的初始化等；第5步：点击按钮切换图⽚，编写对应的函数，其实就是数组的简单应⽤。
接下来先看看效果图，然后进⾏对应的代码讲解。
实现代码：<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>图⽚切换</title><style>.box{width: 600px;height:400px;border: 10px solid #ccc;position: relative;margin: 40px auto 0;}.box a{width: 30px;height: 30px;background-color: #000;border: 5px solid #fff;position: absolute;top:180px;text-align: center;font-size:25px;font-weight: bold;line-height: 30px;color:#fff;text-decoration: none;filter: alpha(opacity:40);opacity: 0.4;}.box a:hover{filter:alpha(opacity:80);opacity:0.8;}.box #prev{left: 10px;}.box #next{right: 10px;}#text,#num{height: 30px;line-height:30px;width: 600px;color:#fff;position: absolute;left: 0;background-color: #000;text-align: center;filter: alpha(opacity:80);opacity: 0.8;margin:0;}.box #text{bottom: 0;}.box #num{top:0;}.box #img1{width: 600px;height: 400px;}</style><script>window.onload = function () {var oPrev = document.getElementById("prev");var oNext = document.getElementById("next");var oText = document.getElementById("text");var oNum = document.getElementById("num");var oImg = document.getElementById("img1");var arrUrl = ['images/1.jpg','images/2.jpg','images/3.jpg','images/4.jpg'];var arrText = ['⽂字1','⽂字2','⽂字3','⽂字4'];//初始化var num = 0;function fnTab(){oNum.innerHTML = num + 1 + '/' + arrText.length;oImg.src = arrUrl[num];oText.innerHTML = arrText[num];};fnTab();oPrev.onclick = function(){num --;if( num == -1){num = arrUrl.length -1;}fnTab();};oNext.onclick = function(){num ++;if(num == arrUrl.length){num = 0;}fnTab();};};</script></head><body><div class="box"><a id="prev" href="javascript:;"> < </a><a id="next" href="javascript:;"> > </a><p id="text">图⽚正在加载中……</p><span id="num">数量正在统计中……</span><img id="img1" src="../images/1.jpg" alt=""></div></body></html>这个例⼦很简单，主要就是对数组的简单读写以及对html的属性内容读写操作。
Zencart首页导航栏修改图文教程-经验之谈大多数自建外贸zencart网站的朋友如果不知道PHP语言或者HTML 等一般都会有困扰，怎么去实现导航栏的修改！下面一起来学习下导航栏的修改：模板（比如Lite red之类)，显示的导航条上显示“HOME,NEW PRODUCTS,SPECIALS....."之类的格局，实际上这样的默认布局并不适合我们的需要，很多朋友都不知道怎么删除或者修改，其实你只要找对地方就修改起来很方便而且易懂!修改主要是两个地方tpl_top_nav.php和header.php。
有些人可能还不知道这写文件在哪，那我写下具体的路径：tpl_top_nav.php路径includes/templates/你的模版名称下/templates\tpl_top_nav.php；head.php路径：目录/includes/languages/english/lite_red/header.php；好找到了这两个PHP文件，下面就来修改下：比如说要在导航条的HOME和NEW PRODUCTS之间插入PRODUCTS，可以这样实现：打开"目录/includes/languages/english/lite_red/header.php",找到//top navigation menu textdefine('TOP_MENU_NEW_PRODUCTS','New Products');define('TOP_MENU_SPECIALS','Specials');define('TOP_MENU_FEATURED_PRODUCTS','Featured Products'); define('TOP_MENU_VIEW_CART','View Cart');define('TOP_MENU_MY_ACCOUNT','My Account');define('TOP_MENU_HOME','Home');define('TOP_MENU_PRODUCTS','Products');这里我们看到红色的部分是我写入的，不懂PHP的可以直接复制上面的类似的语句比如define('TOP_MENU_HOME','Home');然后改成自己想要定义的名字比如又改成define('TOP_MENU_SHABI','SHABI ');也可以随便的，这里只是定义要显示的名字，后面在获取代码时候只要同名都可以获取。
一、如何安装和修改zencart新模板１.下载ZenCart模板提示：比如下载的模板名为jinxu99mbcn,是中文语言下的套用的网店模板。
至于英语语言下用用哪个模板，调用方法是一样的。
２.备份好网店数据库和原来的模板文件个性化网页！二、安装ZenCart模板1.将下载后的模板包用winrar或7zip解压缩。
2.将模板目录整个复制到includes/templates/ 下三、选择新安装的模板1.进入ZenCart后台管理，工具(Tools) 模板选择(Template Selection)，可以看到右边已安装模板有模板名：【】2.选择要替换哪个现有模板（这里选的是ZCDemo Chinese），然后点击右边的编辑按钮，从现安装模板的下拉菜单中选择新模板，最后点击更新按钮。
3.此时Default(All)语言使用了：【】这个新模板。
但是还没有生效。
四、正式启用刚选择的模板1.转到工具(Tools) 外观设置(Layout Boxes Controller)，2. 在屏幕最下面，选择重置按钮。
五、最后检查查看中文语言下的zencart网页源代码，发现：href="/includes/templates/【】/css/style_imagehover.css" />，说明zencart网店调用新模板成功！七、开始个性化刚启用的模板提示:保护好下载的模板主题包，万一自己修改失误，还可以从头再来的。
开发Sidebox插件（两个变量：$title $content ）首先需要搞清楚什么是Sidebox，Sidebox是一个显示在左侧或者右侧的内容区域，当然你也可以将Sidebox的单栏状态打开，使其显示在网页的任何位置。
你可以通过进入后台的Tools/Layout Boxes Controller来进行Sidebox的设置。
注意的是如果开启了单栏Sidebox 的话，你必须通过一句代码手动将其显示到模板中去，否则你是看不到任何效果的。
zencart模板修改详细教程下面简单的介绍下zencart网站模板的修改。
修改较多的地方：(常用代码)一：头部文件为（例子）：D:\AppServ\www\zencart12698\includes\templates\theme3\common–tpl_header.php1.搜索模块功能：——————-标题：<?php echo BOX_HEADING_SEARCH;?>:先在后台将搜索开启‛单一显示‚再加上下面这段代码（搜索表单）<?php require(DIR_WS_MODULES . ‘sideboxes/search_header.php’); ?>2.购物车模块代码：———————-<strong><?php echo(BOX_HEADING_SHOPPING_CART);?></strong> <?php echo BOX_SHOPPING_CART_NOWYOU; ?> <a href=‛<?php echo (zen_href_link(FILENAME_SHOPPING_CART));?>‛><?php echo($_SESSION['cart']->count_contents()); ?> <?php echoBOX_SHOPPING_CART_ITEMS; ?></a>3.货币模块代码：—————-货币标题:<?php echo BOX_HEADING_CURRENCIES; ?>货币: <?php $column_box_default=‛tpl_box_header.php‛; require(DIR_WS_MODULES .‘sideboxes/currencies.php’);?>4.语言模块代码：—————语言标题:<?php echo BOX_HEADING_LANGUAGES ?>:语言: <?php $column_box_default=‛tpl_box_header.php‛; require(DIR_WS_MODULES .‘sideboxes/languages.php’); ?>5.注册模块登陆：———————<div><?php echo ‘<a href=‛‘ . HTTP_SERVER . DIR_WS_CATALOG . ‘‛>’; ?><?php echo HEADER_TITLE_CATALOG; ?></a> | <?php if ($_SESSION['customer_id']) { ?><a href=‛<?php echo zen_href_link(FILENAME_LOGOFF, ‛, ‘SSL’); ?>‛><?php echo HEADER_TITLE_LOGOFF; ?></a> | <a href=‛<?php echo zen_href_link(FILENAME_ACCOUNT, ‛,‘SSL’); ?>‛><?php echo HEADER_TITLE_MY_ACCOUNT; ?></a> | <?php } else {if (STORE_STATUS == ’0′) { ?><a href=‛<?php echo zen_href_link(FILENAME_LOGIN, ‛, ‘SSL’); ?>‛><?php echo HEADER_TITLE_LOGIN; ?></a> | <?php } } ?><?php if ($_SESSION['cart']->count_contents() != 0) { ?><a href=‛<?php echo zen_href_link(FILENAME_SHOPPING_CART, ‛,‘NONSSL’); ?>‛><?php echo HEADER_TITLE_CART_CONTENTS; ?></a> | <a href=‛<?php echo zen_href_link(FILENAME_CHECKOUT_SHIPPING, ‛,‘SSL’); ?>‛><?php echo HEADER_TITLE_CHECKOUT; ?></a><?php }?></div>6.、头部导航栏：—————————–<!–bof-header ezpage links–><?php if (EZPAGES_STATUS_HEADER == ’1′ or (EZPAGES_STATUS_HEADER == ’2′ and (strstr(EXCLUDE_ADMIN_IP_FOR_MAINTENANCE,$_SERVER['REMOTE_ADDR'])))) { ?><?phprequire($template->get_template_dir(‘tpl_ezpages_bar_header.php’,DIR_WS_TEMPLATE, $current_page_base,’templates’).‘/tpl_ezpages_bar_header.php’); ?><?php } ?><!–eof-header ezpage links–><div> <?php include(DIR_WS_MODULES .zen_get_module_directory(‘ezpages_bar_header.php’));?><?php if (sizeof($var_linksList) >= 1) { ?><div id=‛navEZPagesTop‛><ul><?php for ($i=1, $n=sizeof($var_linksList); $i<=$n; $i++){ if($i==1){ ?><li> <?php } else{?><li><?php }?><a href=‛<?php echo $var_linksList[$i]['link']; ?>‛><?php echo$var_linksList[$i]['name']; ?></a><?php echo ($i < $n ?EZPAGES_SEPARATOR_HEADER : ‛) . ‚\n‛; ?><?php } // end FOR loop ?></li></ul><?php } ?>7.logo调用:<?php echo ‘<a href=‛‘ . HTTP_SERVER . DIR_WS_CATALOG . ‘‛>’ . zen_image($template->get_template_dir(HEADER_LOGO_IMAGE,DIR_WS_TEMPLATE, $current_page_base,’images’). ‘/’ . HEADER_LOGO_IMAGE, HEADER_ALT_TEXT) . ‘</a>’; ?>二：底部：差不多都是一致的文件为(例子)：D:\AppServ\www\zencart12698\includes\templates\theme3\common–tpl_footer.phpPaypal：图标代码—————— <?php echozen_image(PAYPAL_LOGO,PAYPAL_BUTTON); ?>三：中间部分：左边：tpl_box_default_left.php（左栏公共部分）分类列表：tpl_categories.php右边: tpl_box_default_right.php（右栏公共部分）中间：tpl_main_page.php(整体文件包含头中尾三部分).1.导航栏这三个项的修改内容页为：(样式须一致须同时修改方便以后调用) new products/all products/featured productsD:\AppServ\www\zencart\includes\templates\zencart12998\templates\tpl_ modules_products_…_listing.php2.在主页中间部分显示的三个页面Special/new/featured/(样式一致)D:\AppServ\www\zencart\includes\modules3. 修改主分类下的子分类的页面：tpl_index_categories.php /zencart定义简易页面的方法：1. 在后台：TOOL->EZ-Pages 新建一个页面.2.在前function_general.php文件中加入下面这个方法：（注：表名的选择。
<script>var links = new Array(); //修改点1: 设置多少个链接与下面的图片个数对应links[1] = "index.php?main_page=index&cPath=65"; //广告图1 对应的超链接links[2] = "index.php?main_page=index&cPath=66"; //广告图2 对应的超链接links[3] = "index.php?main_page=index&cPath=67"; //广告图3 对应的超链接links[4] = "index.php?main_page=index&cPath=68"; //广告图4 对应的超链接var imgs = new Array(); //修改点2: 设置图片个数for(var n = 1; n <= 5; n++) imgs[n] = new Image();imgs[1].src = "includes/templates/classic/images/banner_mlb.gif"; //广告图片1imgs[2].src = "includes/templates/classic/images/banner_nba.gif"; //广告图片2imgs[3].src = "includes/templates/classic/images/banner_nfl.gif"; //广告图片3imgs[4].src = "includes/templates/classic/images/banner_nhl.gif"; //广告图片4var tits = new Array(); //修改点3: 设置标题的个数与上面的图片个数对应因扒丢了标题样式所以此处可忽略tits[1] = "广告图片1 标题"; //图片1 标题tits[2] = "广告图片2 标题"; //图片2 标题tits[3] = "广告图片3 标题"; //图片3 标题tits[4] = "广告图片4 标题"; //图片4 标题//修改点3: 设置图片显示的高度var imgwidth = 810; //图片宽度var imgheight = 330; //图片宽度var str = "<style type='text/css'>";str += "#imgnv{display:none;position:absolute;bottom:-1px;right:0;height:16px;}#imgnv div{float:left;margin-right:1px;}";str += "#imgnv div.on,#imgnv div.off{margin-bottom:1px;width:30px;height:15px;line-height:18px!important;line-height:15px;f ont-size:9px;text-align:center;cursor:pointer;cursor:hand}";str += "#imgnv div.on{background:#CE0609;color:#FFF;font-weight:bold}";str += "#imgnv div.off{background:#323232;color:#FFF;text-decoration:none}";str += "#titnv{margin-top:3px;color:#000;text-align:center;display:none;}";str += "</style>";str += "<div style='position:relative'>";str += "<div><a id='dlink' href='" + links[1] + "' target='_blank'><img id='dimg' src='" + imgs[1].src + "' border='0' width='" + imgwidth + "' height='"+imgheight+"' style='filter:Alpha(opacity=100)' onmouseover='Pause(true)' onmouseout='Pause(false)'></a></div>";//修改点4：循环添加内层div内容以增加个数与图片个数对应str += "<div id='imgnv'><div id='it1' class='on' onmouseover='ImgSwitch(1, true)'onmouseout='Pause(false)'>1</div><div id='it2' class='off' onmouseover='ImgSwitch(2, true)' onmouseout='Pause(false)'>2</div><div id='it3' class='on' onmouseover='ImgSwitch(3, true)' onmouseout='Pause(false)'>3</div><div id='it4' class='off' onmouseover='ImgSwitch(4, true)' onmouseout='Pause(false)'>4</div></div>";str += "<div id='titnv'><b>" + tits[1] + "</b></div>";str += "</div>";document.write(str);var oi = document.getElementById("dimg");var pause = false;var curid = 1;var lastid = 1;var sw = 1;var opacity = 100;var speed = 15;var delay = (document.all)? 400:700;function SetAlpha(){if(document.all){if(oi.filters && oi.filters.Alpha) oi.filters.Alpha.opacity = opacity;}else{oi.style.MozOpacity = ((opacity >= 100)? 99:opacity) / 100;}}function ImgSwitch(id, p){if(p){pause = true;opacity = 100;SetAlpha();}oi.src = imgs[id].src;document.getElementById("dlink").href = links[id];document.getElementById("it" + lastid).className = "off";document.getElementById("it" + id).className = "on";document.getElementById("titnv").innerHTML = "<b>" + tits[id] + "</b>";curid = lastid = id;}function ScrollImg(){if(pause && opacity >= 100) return;if(sw == 0){opacity += 2;if(opacity > delay){ opacity = 100; sw = 1; }}if(sw == 1){opacity -= 3;if(opacity < 10){ opacity = 10; sw = 3; }}SetAlpha();if(sw != 3) return;sw = 0;curid++;//修改点5：这里的4也是个数与图片个数对应if(curid > 4) curid = 1;ImgSwitch(curid, false);}function Pause(s){pause = s;}function StartScroll(){setInterval(ScrollImg, speed);}function CheckLoad(){if (imgs[1].complete == true && imgs[2].complete == true) { clearInterval(checkid);setTimeout(StartScroll, 2000);}}var checkid = setInterval(CheckLoad, 10);</script>。
