ASPCMS产品展示栏自定义显示内容

宣传产品或案例为主的企业网站的首页都会布置有一个产品展示区块,常常在没有特殊要求的时候往往会设计成只显示最新的几个产品图片或文章,但这样突出不了主打产品。周末帮朋友修改了一两个产品展示栏目自定义显示内容案例,方法不难,关键点在于掌握ASPCMS文章显示排序规则。

案例一:网站首页完全自定义上下排显示不同产品

ASPCMS 列表排序默认写法是order = order ,这是文章类别的显示顺序为IsHeadline(头条)>>IsTop(置顶)>>IsFeatured(特别推荐)>>isrecommend(推荐)>>ContentOrder(推荐和置顶同时选择)>>a.AddTime desc(更新时间) 。根据这个规则写两个类似区块内容,顶部区块放置顶产品,下部区块放推荐产品,信息发布者根据需要在文章高级选项中勾选置顶或推荐就可以分配产品在首页显示的位置。代码示例如下:

<div id="product_cont">
    <UL class="bxslider">
        <!--产品置顶内容-->
        {aspcms:content sort=5 num=4 order=IsTop}
        <li>
            <a href="[content:link]">
                <img alt="[content:title len=60]" src="[content:pic]" width="146" height="109"
                />
            </a>
            <span>
                <a href="[content:link]" title="[content:title len=60]">
                    [content:title len=10]
                </a>
            </span>
        </li>
        {/aspcms:content}
    </UL>
    <UL class="bxslider">
        <!--产品推荐内容-->
        {aspcms:content sort=5 num=4 order=isrecommend}
        <li>
            <a href="[content:link]">
                <img alt="[content:title len=60]" src="[content:pic]" width="146" height="109"
                />
            </a>
            <span>
                <a href="[content:link]" title="[content:title len=60]">
                    [content:title len=10]
                </a>
            </span>
        </li>
        {/aspcms:content}
    </UL>
</div>

案例二:在“产品列表”主界面同时平均显示每一个小分类产品内容

在“产品列表”主界面,未选择小分类时,第一列的图片应该取自第一个小分类的图,第二列图片应该取自第二个小分类的图,以此类推;只有在小分类栏目列表界面显示该小分类下每个产品。

碰到这种需求只能说苦逼体力劳动来啦,新建一个单独的productbiglist.html模板给产品列表主界面使用,其他的小分类继续使用原来的productlist.html模板。两个模板不同的地方在于productbiglist.html显示内容处改成了按显示需求顺序的批量重复代码。

<ul class='list-none metlist'>
    <!--某小分类4个排在最前面的产品-->
    {aspcms:content sort=7 num=4 order=order}
    <!-- sort=某小分类ID num=需要显示的产品数量-->
    <li class='list' style='width:152px; margin-left:14px;
     margin-right:14px;'>
        <a href='[content:link]' title='[content:title]' 
        target='_self' class='img'>
            <img src='[content:pic]' alt='[content:title]'
             title='[content:title]'
            width='150' height='120' />
        </a>
        <h3>
            <a href='[content:link]' title='[content:title]'
             target='_self'>
                [content:title]
            </a>
        </h3>
    </li>
    {/aspcms:content}
</ul>
......重复下一段,直到小分类结束......

您可以选择一种方式赞助本站

支付宝转账赞助

支付宝扫一扫赞助

微信钱包扫描赞助

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

图片 表情