Fashion模版如何让商品名称分二行显示

2016-07-07 16:08 来源：www.chinab4c.com 作者：ecshop专家



大家好，我用的是Fashion模版V2.7.2，
用的是官方这个模版，
http://bbs.ecshop.com/viewthread.php?tid=124492
官方模版演示地址是这个
http://www.ecshop.cn/?theme=Fashion
现在商品名称只是一行显示多出的用...
因为我的商品名称都很长，超过一行显示的字数，所以我现在想让他分二行显示。应该如何改。
商品显示长度我知道可以在后台设置，但后台设置的是多少个字都只是一行显示。
因为我标题比较长所以想改成两行显示，第一行显示完然后换行显示第二行。
要是后台设置商品显示的长度过大，现在是一行显示的话就会把页面撑开的。所以想改成二行显示。
现在是这样：
1.jpg
我想改成这样：

2.jpg
请问应该在哪里改呢？是在CSS里改吗？

这里是style.css
/*精品推荐，新品上市，热卖商品*/
.centerPadd{padding:5px 0; overflow:hidden;}
.itemNewTit{height:27px;background:url(images/B_NewBg.gif) repeat-x;}
.itemNewTit .left_new{background:url(images/B_TitleBg03.gif) no-repeat 0 0; width:151px; height:27px;}
.itemNewTit .right_new h2 a,.itemBestTit .right_best h2 a,.itemHotTit .right_hot h2 a{color:#fff; text-decoration:none;}
.itemNewTit .right_new .h2bg,.itemBestTit .right_best .h2bg,.itemHotTit .right_hot .h2bg{height:27px; line-height:27px; border:none; background:none;
font-size:12px; text-align:center; color:#fff; font-weight:100; padding:0px 10px;
display:inline; white-space:nowrap;}
.itemNewTit .right_new .h2bg a,.itemBestTit .right_best .h2bg a,.itemHotTit .right_hot .h2bg a{color:#fff; text-decoration:none;}
.centerPadd .content{margin:2px 10px;}

刚刚看了下首页显示商品名称那里是这句代码：
<div id="show_best_area" class="content">
<!-- {/if} -->
<!--{foreach from=$best_goods item=goods}-->
<div class="GoodsBox">
<div class="photo"><a href="{$goods.url}"><img src="{$goods.thumb}" alt="{$goods.name|escape:html}"/></a></div>
<p><a href="{$goods.url}" title="{$goods.name|escape:html}">{$goods.short_style_name}</a></p>
<font class="shop">
<!-- {if $goods.promote_price neq ""} -->
{$lang.promote_price}{$goods.promote_price}
<!-- {else}-->
{$lang.shop_price}{$goods.shop_price}
<!--{/if}-->
</font>
</div>
<!--{/foreach}-->
红色那句为商品名称显示的代码，请问在哪里改呢？
知道的麻烦告诉一下谢谢。

回答：
在style.css里面改，找到商品名称项，把宽和高的PX数调整一下，宽改为跟图片宽一样，高加多一倍。加一个溢出部分隐藏，就不会撑开了。

在style.css里面改，找到商品名称项，把宽和高的PX数调整一下，宽改为跟图片宽一样，高加多一倍。加一个溢出部分隐藏，就不会撑开了。
空白2006 发表于 2010-5-29 22:34

能说详细一点吗？
这个是单个商品的CSS，是在单个商品的CSS里改吗？
/*单个商品*/
.GoodsBox{
min-height:150px;
display: -moz-inline-stack;
display: inline-block;
text-align:center;
vertical-align: top;
margin:8px 1px 0 1px;
*margin:8px 3px 0 3px;
padding:5px;
zoom:1;
*display:inline;
_height:150px;
}

怎么没有人帮忙解答一下啊，谢谢了

感觉这里有时候一个贴子发了很久也没有人回复啊，人气是够了，但是愿意帮忙解决问题的人太少了

可以用火狐的firebug 调试下。
这个工具还是比较方便的

可以用火狐的firebug 调试下。
这个工具还是比较方便的
晓天 发表于 2010-5-31 13:20

我改过几次都不行，所以在这里求助大家。

贴下网站看下

贴下网站看下
晓天 发表于 2010-6-1 14:31

就是想象上面图所示，原来商品名称是一行显示的，现在想改成二行显示商品名称。

哎，感觉官方免费发布模版后，对于模版的一些问题却一直没有人能够下面解答或者帮忙一下。

哎，感觉官方免费发布模版后，对于模版的一些问题却一直没有人能够下面解答或者帮忙一下。
dream200829 发表于 2010-6-3 08:39


好似每个模板的css有些不同的，有时候大家只能给您一个方法，需要自己去学习修改，这样，以后你改起东西来，也方便。偶也是从一点不懂慢慢学习中……。
另外，每个人上线的时间也不同。至少管理员晓天，帖子回复率还是非常高的，EC为什么不弄多几个管理员……汗。
PM联系，我试一下看能不能帮到你吧……

{$goods.short_style_name} 改为{$goods.name|escape:html}

{$goods.short_style_name} 改为{$goods.name|escape:html}
176542304 发表于 2010-6-4 09:34


你好，这个我刚刚试过了，还是不行。还是和原来一样，没有分行。

你好，这个我刚刚试过了，还是不行。还是和原来一样，没有分行。
dream200829 发表于 2010-6-4 10:57


{$goods.short_style_name}改为{$goods.short_style_name|truncate 100}试试


{$goods.short_style_name}改为{$goods.short_style_name|truncate 100}试试
空白2006 发表于 2010-6-4 14:12

刚刚试过了，不行，这个是截取长度为100