ECOS电商系统交流论坛-Shopex开源网站官方论坛's Archiver

91dfhy 发表于 2014-2-22 17:26

ECSHOP团购列表美化-最新流行横版团购商品排列

[color=#000][font=微软雅黑, 宋体, Arial]ECSHOP默认的团购列表奇丑无法,一流资源网最近利用ECSHOP制作商城网站时,将团购列表美化了下:[/font][/color][img]http://www.16css.com/d/file/ecshop/201402/16fa779ac951c8f2d9eb760592f14737.jpg[/img][color=#000][font=微软雅黑, 宋体, Arial]修改方法如下:[/font][/color]
[color=#000][font=微软雅黑, 宋体, Arial]第一步:打开 group_buy_list.dwt 文件,使用以下代码替换此文件中的所有代码:[/font][/color]
[font=微软雅黑, 宋体, Arial][color=#000000][code]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="Keywords" content="{$keywords}" />
<meta name="Description" content="{$description}" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>{$page_title}</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<link rel="shortcut icon" href="favicon.ico" />
<link rel="icon" href="animated_favicon.gif" type="image/gif" />
<link href="{$ecs_css_path}" rel="stylesheet" type="text/css" />
{* 包含脚本文件 *}
{insert_scripts files='common.js'}
<script type="text/javascript" src="js/action.js"></script>
   
</head>
<body>
<!-- #BeginLibraryItem "/library/page_header.lbi" --><!-- #EndLibraryItem -->
<div class="block1">
<!-- #BeginLibraryItem "/library/ur_here.lbi" --><!-- #EndLibraryItem -->
</div>
<div class="block1 clearfix">
  <div id="pageLeft" class="fl">
     <!-- TemplateBeginEditable name="左边区域" -->
     <!-- #BeginLibraryItem "/library/category_tree.lbi" --><!-- #EndLibraryItem -->
     <!-- #BeginLibraryItem "/library/promotion_info.lbi" --><!-- #EndLibraryItem -->
     <!-- #BeginLibraryItem "/library/history.lbi" --><!-- #EndLibraryItem -->
   <!-- TemplateEndEditable -->
    </div>
    <div id="pageRight" class="fr">
      
        <div class="goodsTitle">{$lang.group_buy_goods}</div>
        <div class="grouplist clearfix">
             <!-- {if $gb_list} 如果有团购活动 -->
                <!-- {foreach from=$gb_list item=group_buy} 循环团购活动开始 -->
                <div class="group_buy_listb clearfix">
<div class="title"><a href="{$group_buy.url}" target="_blank">{$group_buy.goods_name|escape:html}</a></div>
                    <div class="groupImg">
                        <a href="{$group_buy.url}" target="_blank"><img src="{$group_buy.goods_thumb}" border="0" alt="{$group_buy.goods_name|escape:html}" width="250" height="250" /></a>
                    </div>
    <div class="groucon">
    <div class="grouconl">
<div class="a">{$group_buy.formated_cur_price}</div>
   
    </div>
    <div class="grouconr">
        <p class="ckxq"><a href="{$group_buy.url}" target="_blank"></a></p>
    </div>
    </div>
                </div>
                <!--{/foreach}-->
                <!-- {else} -->
                 <div class="tips">{$lang.group_goods_empty}</div>
                <!-- {/if} -->   
    </div>
    <!-- #BeginLibraryItem "/library/pages.lbi" --><!-- #EndLibraryItem -->
    </div>
</div>
   
   
<!-- #BeginLibraryItem "/library/page_footer.lbi" --><!-- #EndLibraryItem -->
</body>
</html>[/code][/color][/font]
[color=#000][font=微软雅黑, 宋体, Arial]CSS代码:[/font][/color]
[font=微软雅黑, 宋体, Arial][color=#000000][code].group_buy_listb {width:250px; float:left; margin:10px; padding:10px 20px;_padding:10px 19px; border:solid 1px #ddd}
.group_buy_listb:hover {border:solid 1px #000}
.group_buy_listb .title {width:250px; height:50px; line-height:20px; overflow:hidden; font-weight:bold}
.group_buy_listb .title a {}
.group_buy_listb .groupImg { width:250px; height:250px; overflow:hidden}
.group_buy_listb .groupImg img {width:250px; height:250px}
.group_buy_listb .groucon {width:250px; overflow:hidden}
.group_buy_listb .grouconl {float:left; width:161px; height:60px; overflow:hidden}
.group_buy_listb .grouconl .a {font-size:28px;font-weight: 700;font-family: verdana; color:#E5383A; width:161px; height:60px; line-height:60px}
.group_buy_listb .grouconr {float:right; width:89px; height:60px; overflow:hidden}
.group_buy_listb .grouconr .ckxq {width:89px; height:30px; background:url(./images/xqannui.jpg) no-repeat left top; margin-top:15px}
.group_buy_listb .grouconr .ckxq a {display:block; width:89px; height:30px}
.grouplist {padding: 12px 7px 10px 7px; background: #FFFFFF;}[/code][/color][/font]
[color=#000][font=微软雅黑, 宋体, Arial]素材:[/font][/color]
[font=微软雅黑, 宋体, Arial][color=#000000][img]http://www.16css.com/d/file/ecshop/201402/xqannui.jpg[/img] [/color][/font]
[font=微软雅黑, 宋体, Arial][color=#000000]
[/color][/font]
[p=28, 2, left][color=#ff00]另外,我这里放弃了显示阶梯价格,而是直接调用了团购当前价格,所以还必须按修改一个文件,否则无法显示价格。[/color][/p][p=28, 2, left]ECSHOP团购列表页调用显示当前价格教程:[url=http://www.16css.com/ecshop/653.html]http://www.16css.com/ecshop/653.html[/url][/p]
[p=28, 2, left]AD:史上最全ECSHOP教程技巧:[url=http://www.16css.com/ecshop/]http://www.16css.com/ecshop/[/url][/p]

wobuka 发表于 2014-2-23 13:27

看着还不错的样子,顶一个

heoo 发表于 2014-3-10 18:08

感谢分享。。[url]http://www.m4a3.tk/mark/tg.php?u=7499[/url]

2253926165 发表于 2014-3-11 10:38

还行吧 :lol

vstarcam 发表于 2014-4-1 14:45

谢谢分享

白菜黄 发表于 2014-4-9 17:04

[i=s] 本帖最后由 白菜黄 于 2014-4-9 17:05 编辑 [/i]

[url=http://www.bb280.com]http://www.bb280.com[/url]中华养生网正需要这个呢

www.yantang.com 发表于 2014-4-9 19:03

[p=30, 2, center][url=http://www.yantom.com/brand-41.html]倍丽眼霜[/url]请问 我做过二次开发了。代码按你这样写行不行[/p]

[p=30, 2, center]会不会不行啊?[/p]


[p=30, 2, center]谢谢耐心指导[/p]

millou 发表于 2014-5-20 14:16

[url=http://www.millou.com.cn/?u=87][img]http://www.millou.com.cn/themes/orange5/images/logo.gif[/img][/url]

冰霜动力 发表于 2016-3-9 16:57

酷垦配件商城[url]http://www.coolcomp.cn[/url]支持!

gordonla 发表于 2017-3-23 15:08

非常不错的这个模版

页: [1]

Powered by Discuz! Archiver 7.2  © 2001-2009 Comsenz Inc.