Octopus系列之各个页面调用示例
调用首页产品
可选参数如下
New = 1,
Hot = 2,
Best = 3,
Special = 4,
Featured = 5,
Other = 6
#foreach($item in $oct.GetProductstList(${currency},6,$ptype.Best)) <dl class="indexlist"> <dt class="proimg"> <a href="${item.url}" title=""> <img src="${item.images.smallimg}" title="" alt="" /> </a> </dt> <dd class="prodName"> <a href="${item.url}" title="">${item.name}</a> </dd> <dd class="prodPrice"> <span class="oldPrice">${item.NormalPrice}</span> <span class="price">${item.SalePrice}</span> <span class="discount">Save:${item.Saveoff} off</span> </dd> </dl> #end
列表页 调用面包屑导航
<div id="breadcrumb" class="breadcrumbs"> <ul> #foreach($item in $category.Breadcrumb) #beforeall <li class="home"><a title="${Oct_Home}" href="${siteurl}">${Oct_Home}</a><span>/ </span></li> #each <li class=""> <a href="${item.url}">${item.name}</a> #if(${category.ClassLayer}!=1) <span>/</span> #end </li> #afterall #if(${category.ClassLayer}!=1) <li class="">${category.name}</li> #end #end </ul> </div>
调用全部分类【支持无限级的调用,根据需要自己编写】 下面展示4级分类的调用
<div> <dl> #foreach($item in $categorylist) <dd> <a href="${item.url}">${item.name}</a> #foreach($s in $item.SubClass) #beforeall <ul> #each <li> <a href="${s.url}">${s.name}</a> #foreach($o in $s.SubClass) #beforeall <ul> #each <li> <a href="${o.url}">${o.name}</a> #foreach($p in $o.SubClass) #beforeall <ul> #each <li><a href="${p.url}">${p.name}</a></li> #afterall </ul> #end </li> #afterall </ul> #end </li> #afterall </ul> #nodata #end </dd> #end </dl> </div>
很长看不懂吗?很简单 自己运行一下
调用产品列表
<div id="gridInner"> #set($count=0) #foreach($item in $productlist) #set($count=$count+1) <div class="plist"> <div class="proimg"> <a href="${item.url}" title=""> <img class="proimgitem" src="${item.images.smallimg}" title="${item.name}" alt="${item.name}" /> <span class="span_box"></span> </a> </div> <div class="description"> <a href="${item.url}" title="${item.name}"> ${item.name} </a> </div> <div class="prodesprice"> <span class="retail-price"> <span class="set-currency">${item.NormalPrice}</span> </span> <span class="price">${item.SalePrice}</span> <span class="discount">Save:${item.Saveoff} off</span> </div> </div> #if($count%3==0) <div class="clear separator"></div> #end #end <div style="clear:both;height:5px"></div> <div class="default"> ${pager} </div> </div>
关于分页的样式,已经内置几种样式可以自己定义
调用详情页面包屑【和分页的有点细微差别】
<div id="breadcrumb" class="breadcrumbs"> <ul> #foreach($item in ${product.category.breadcrumb}) #beforeall <li class="home"><a title="${Oct_Home}" href="${siteurl}">${Oct_Home}</a><span>/</span></li> #each <li class=""> <a href="${item.url}">${item.name}</a> #if(${product.category.classlayer}!=1) <span>/</span> #end </li> #afterall #if(${product.category.classlayer}!=1) <li class=""><a href="${item.url}">${product.category.name}</a></li> #end #end </ul> </div>
【通过产品的category对象来调用】
调用产品的多选属性
<div class="box"> #foreach($item in $product.Attributes) #if($item.type=="attr_radio") <div class="$item.type"> <input type="hidden" name="attr_${item.name}" value="" /> <b>$item.Name</b> <div style="clear:both"></div> #foreach($a in $item.values) <span class="unchecked" title="$a.value" data-val="$a.value"> $a.value $oct.CheckValue($a.Pricefix) $a.DVPrice </span> #end <div style="clear:both"></div> </div> #end #if($item.type=="attr_dropdown") <div class="$item.type"> <b>$item.Name</b> <select name="attr_$item.Name" onchange="CheckInput(this);"> <option value="" selected="selected">${Oct_Please_Select}</option> #foreach($a in $item.values) <option value="$a.value">$a.value $oct.CheckValue($a.Pricefix) $a.DVPrice</option> #end </select> <div style="clear:both"></div> </div> #end #if($item.type=="attr_color_radio") <div class="$item.type"> <input type="hidden" name="attr_${item.name}" value="" /> <b>$item.Name</b> <div style="clear:both"></div> #foreach($a in $item.values) <span class="unchecked" data-val="$a.value"> <img src="${themeurl}images/color/$a.Icon" title="$a.value $oct.CheckValue($a.Pricefix) $a.DVPrice" width="32" /> </span> #end <div style="clear:both"></div> </div> #end #if($item.type=="attr_text") <div class="$item.type"> #foreach($a in $item.values) <b>$item.Name:</b> <input type="text" name="attr_${item.name}" value="" onchange="CheckInput(this)" /> <br /> #end <div style="clear:both"></div> </div> #end #end </div>
这个大家还是自己看吧 【懒得口舌了,想要之后可以私下联系我,如果更新了 我会在上面更新的】
其实之所以这样贴出来是为了大家方便,其实Octopus完全支持自定义的模板开发的 不过你要完全熟悉我的对象实体 才行
调用关联产品
<div class="box"> #foreach($rp in $product.Related) <a href="$rp.url" title="$rp.name"> <img src="$rp.images.smallimg" width="85" style="border:1px solid #EEEEEE" /> </a> #end </div>
调用上一个产品下一个产品
<div class="box" style="font-weight: bold; font-size: 14px; color: #990000;"> <a class="cor990000" href="$product.PreviousUrl"><< ${Oct_Prev}</a> <a class="cor990000" href="$product.category.URL">${Oct_Listing}</a> <a class="cor990000" href="$product.NextUrl">${Oct_Next} >></a> </div>
调用收藏夹
#if(${islogin}) #if(${iswishlist}) <a name="btnAddToWishList" class="litb-btn-small" id="favorite" href="javascript:void(0)" data-pid="${product.productid}" data-login="${islogin}" data-iswishlist="${iswishlist}" onclick="AddToWish(this)"> <i class="litb-icon-prod-heart litb-icon-prod-heart-active"></i> ${Oct_Favorite} </a> #else <a name="btnAddToWishList" class="litb-btn-small" id="favorite" href="javascript:void(0)" data-pid="${product.productid}" data-login="${islogin}" data-iswishlist="${iswishlist}" onclick="AddToWish(this)"> <i class="litb-icon-prod-heart"></i> ${Oct_Favorite} </a> #end #else <a name="btnAddToWishList" class="litb-btn-small" id="favorite" href="javascript:void(0)" data-login="${islogin}" onclick="AddToWish(this)"> <i class="litb-icon-prod-heart"></i>Favorite </a> #end
调用产品放大镜
<div class="zoom-section"> <div class="zoom-small-image"> <a id="zoom1" class="cloud-zoom" href="${product.images.bigimg}" rel="position:'inside',showTitle: false,adjustX:0,adjustY:0"> <img src="${product.images.middleimg}" /> </a> </div> </div> <div class="zoom-desc"> #foreach($img in $product.images.imagelist) <a class="cloud-zoom-gallery" title="" href="$img.bigimg" rel="useZoom: 'zoom1', smallImage: '$img.middleimg' "> <img class="zoom-tiny-image" alt="Thumbnail 0" src="$img.smallimg" /> </a> #end </div>
调用随机产品
#foreach($item in $oct.GetRandomProductList(${currency},3)) <dl> <dt> <a href="$item.url" title="$item.name"> <img src="$item.images.smallimg" title="$item.name" alt="$item.name" width="189" /> </a> </dt> <dd class="prodName"> <a href="$item.url" title="$item.name">$item.name</a> </dd> <dd class="prodPrice"> <span class="oldPrice">${item.NormalPrice}</span> <span class="price">${item.SalePrice}</span> <span class="discount">Save:${item.Saveoff} off</span> </dd> </dl> #end
调用函数
字符截取
$oct.CutString("${item.ProductID}+${item.name}",45)
$oct.CutUrl(${siteurl})
Octopus系列之各个页面调用示例的更多相关文章
- Octopus系列之各个页面调用示例2
判断登陆的调用 #if(${islogin}) <span> ${Oct_Welcome} or <a href="${siteurl}customer/logout/&q ...
- 利用JavaScriptSOAPClient直接调用webService --完整的前后台配置与调用示例
JavaScriptSoapClient下载地址:https://archive.codeplex.com/?p=javascriptsoapclient JavaScriptSoapClient的D ...
- ADO.NET系列之事务和调用存储过程
ADO.NET系列之Connection对象 ADO.NET系列之Command对象 ADO.NET系列之DataAdapter对象 ADO.NET系列之事务和调用存储过程 前几篇我们介绍了Conne ...
- 股票数据调用示例代码php
<!--?php // +---------------------------------------------------------------------- // | JuhePHP ...
- iframe父子页面调用小结
子页面调用父页面 $('#Id', window.parent.document); //调用父页面元素 window.parent.func1(); //调用父页面方法 (子页面同理,需将js方 ...
- WebService核心文件【server-config.wsdd】详解及调用示例
WebService核心文件[server-config.wsdd]详解及调用示例 作者:Vashon 一.准备工作 导入需要的jar包: 二.配置web.xml 在web工程的web.xml中添加如 ...
- iframe页面调用父窗口JS函数
A页面iframe 页面B, 此时 如果要在B页面调用父页面A的函数 B页面写法 parent.functionName(); 错误1: 解决办法 var js_domain_async = 'bai ...
- JS 的子父级页面调用
window.frames["iframevehquery"].add(); // 父页面调用嵌套子页面的js函数, iframevehquery 为 iframe 的name值, ...
- Octopus系列之如何让前台的js脚本变得灵活重用
Octopus系列如何让前台的js脚本变得灵活,重用 方式1:ajax方式 方式2:form表单方式 面向对象的脚本封装 jQuery的封装 做Web开发的少不了前台Ajax的使用, 返回true:f ...
随机推荐
- c/c++ 指针理解(1)
指针是一个变量,存放变量的地址
- 移动端开发tips
为什么使用touch click有300sm的延迟 touch支持多点触摸 手势操作
- paper 94:视觉领域博客资源1之中国部分
这是收录的图像视觉领域的博客资源的第一部分,包含:中国内地.香港.台湾 这些名人大家一般都熟悉,本文仅收录了包含较多资料的个人博客,并且有不少更新,还有些名人由于分享的paper.code或者数据集不 ...
- Boadload和Image$$??$$Limit含义
Bootloader 即引导加载程序,是系统加电后运行的第一段软件代码.简单的说它们都是bootloader,所完成的任务也大同小异. 熟悉x86体系结构的朋友肯定知道,x86平台上bootloade ...
- [3]R语言在数据处理上的禀赋——par参数详解(一)
本文目录 公共参数列表 par 颜色相关 字体相关 字体大小相关 线条相关 符号相关 线条和符号大小相关 结束 本文首发:program-dog.blogspot.com 注1:本文也曾在csdn发布 ...
- 关于SSIS中解密数据库字符串的方法
此文章适合于SSIS新手,我是个小白,在繁复查阅资料后仍无果到最后解决问题,走了很多弯路,现在讲其中一些关于SSIS的理解写出来,供大家参考,在正文之前,我就我自己的理解,阐明一些概念. 什么是SSI ...
- wex5 教程 之 图文讲解 考题模块框架设计
前几天帮人设计了一个手机版(做了屏幕适配,电脑使用也正常)的考题框架,供学习交流使用,今天把设计思路与技巧命整理一下. 一 效果演示: 1 登陆后台 题库管理 试卷管理 考生管理 科目管理 2 考生注 ...
- POJ 3436:ACM Computer Factory(最大流记录路径)
http://poj.org/problem?id=3436 题意:题意很难懂.给出P N.接下来N行代表N个机器,每一行有2*P+1个数字 第一个数代表容量,第2~P+1个数代表输入,第P+2到2* ...
- Java 多线程处理[全]
http://blog.csdn.net/ghsau/article/details/7421217 Java线程(一):线程安全与不安全 http://blog.csdn.net/ghsau/art ...
- MyBatis简介