• 注册
  • 交流 交流 关注:1 内容:9

    得推企业网站模板开发教程之产品信息

  • 查看作者
  • 打赏作者
  • 当前位置: 站长社区 > deituicms > 交流 > 正文
    • 交流
    • 产品信息有两个文件:

         product/list.html 列表页

         product/show.html 详情页

          得推企业网站模板开发教程之产品信息

       

      一、list.html 列表页

      相关标签:

      1
      2
      3
      4
      5
      6
      7
      8
      $cat 当前分类
      {$cat.cname}
      $children 分类列表
      {foreach item=c from=$children}  
      $list 文章列表
      {foreach item=c from=$list}
      分页数据 只有大于1页的时候显示
      {$pagelist}

      Tabs制作

      1
      2
      3
      4
      5
      <div class="tabs-border">
      {foreach item=c from=$children}  
          <a href="/index.php?m=article&a=list&catid={$c.catid}" class="tabs-border-item {if get('catid') eq $c.catid}tabs-border-active{/if}">{$c.cname}</a>
      {/foreach}
      </div>

      二、show.html  详情页

      相关标签

      1
      2
      3
      4
      5
      6
      7
      8
      $data 文章详情
      $data 结构
          id
          title
          imgurl
          description
          price
          content

      相关源码:

      list.html

      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      15
      16
      17
      18
      19
      20
      21
      22
      23
      24
      25
      26
      27
      28
      29
      30
      31
      32
      33
      34
      35
      36
      37
      38
      39
      40
      <!DOCTYPE html>
      <html>
          {include file="head.html"}
          <body>
              <div class="header">
                  <div class="header-back"></div>
                  <div class="header-title">{$cat.cname}</div>
              </div>
              <div class="header-row"></div>
              <div class="main-body">
                  {if $children}
                  <div class="tabs-border">
                           
                          {foreach item=c from=$children}  
                          <a href="/index.php?m=article&a=list&catid={$c.catid}" class="tabs-border-item {if get('catid') eq $c.catid}tabs-border-active{/if}">{$c.cname}</a>
                          {/foreach}
                      </div>
                  {/if}  
                  <div class="pd-10 bg-fff">
                      {foreach item=c from=$list}
                      <a href="/index.php?m=article&a=show&id={$c.id}" class="flexlist-item pointer">
                          <img class="flexlist-img" src="{$c.imgurl}.100x100.jpg" />
                          <div class="flex-1">
                               
                              <div class="flexlist-title">{$c.title}</div>
                              <div class="cl-money">¥{$c.price}</div>
                              <div class="flexlist-desc">{$c.description}</div>
                          </div>
                           
                      </a>
                      {/foreach}
                  </div>
                  {$pagelist}
              </div>
              {assign var="ftnav" value="product"}  
              {include file="ftnav.html"}
              {include file="footer.html"}
               
          </body>
      </html>

      show.html

      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      15
      16
      17
      18
      19
      20
      21
      22
      23
      24
      25
      26
      27
      28
      29
      30
      31
      32
      33
      34
      35
      36
      37
      38
      39
      40
      41
      42
      43
      44
      45
      46
      47
      48
      49
      50
      51
      52
      53
      54
      55
      56
      57
      58
      59
      60
      61
      62
      63
      64
      65
      66
      67
      68
      69
      70
      71
      72
      73
      74
      <!DOCTYPE html>
      <html>
          {include file="head.html"}
          <link href="/plugin/swiper/css/swiper.min.css" rel="stylesheet" />
          <body>
              <div class="header">
                  <div class="header-back"></div>
                  <div class="header-title">产品详情</div>
              </div>
              <div class="header-row"></div>
              <div class="main-body mgb-10">
                  {if !$imgsata}
                  <img src="{$data.imgurl}" class="d-img" />
                  {else}
                  <div class="swiper-container" style="width: 100%;" id="indexFlash">
                      <div class="swiper-wrapper" >
                          {foreach item=c from=$imgsdata}
                          <div class="swiper-slide">
                              <img class="imgWidth" src="{$c.trueimgurl}" />
                          </div>
                          {/foreach}
                      </div>
                        
                      <div class="swiper-pagination flex flex-jc-center"></div>
                    
                  </div>
                  {/if}
                  <div class="row-box mgb-5">
                      <div class="d-title">{$data.title}</div>
                      <div class="flex">
                          <div class="cl2 mgr-5">价格</div>
                          <div class="cl-money">{$data.price}</div>
                      </div>
                  </div>
                   
                  <div class="pd-10 bg-fff">
                      <div class="d-content"> {$data.content} </div>
                  </div>
              </div>
                
              {include file="footer.html"}
                
              <?php wx_jssdk();?>
              <script type="text/javascript">
                  wxshare_title="{$data.title}";
                  {if $data.imgurl} 
                   wxshare_imgUrl="{$data.imgurl|images_site}.100x100.jpg";
                   {/if}
              </script>
              <script>
                  setTimeout(function(){
                      $.get("/index.php?m=article&a=addclick&id={$data.id}&ajax=1")
                  },3000);
                   
              </script>
              <script src="/plugin/swiper/js/swiper.min.js"></script>
              <script>
                  $(function(){
                      if($("#indexFlash .swiper-slide").length>0){
                          var flash = new Swiper("#indexFlash", {
                              pagination: {
                                  el: '.swiper-pagination',
                              }
                          });
                      }else{
                          $("#indexFlash").hide();
                      }
                       
                  })
                   
              </script>
          </body>
           
      </html>

      擅长SEOSEM网站诊断、方案编写、优化运维

      请登录之后再进行评论

      登录

      分享有礼

    • 发表内容
    • 做任务
    • 实时动态