蟬知系統如何修改調整文章列表頁圖文顯示效果

2016-07-20 16:39:00
GavinHsueh
原創
5034

蟬知系統的文章列表頁面是支持圖文并茂的,包括標題、簡介、封面圖片等。但有時并不能滿足客戶實際的期望需求,需要我們自定義修改調整顯示樣式,如果大家有其他好的解決方案,歡迎和大家一起分享交流,下面我介紹下個人在調整時用的方法。

我直接修改的 模板文件,找到源文件目錄\template\default\article中的browse.html.php文件,找到里面的第38-45行代碼,即:


            <?php if(!empty($article->image)):?>
            <div class='media pull-right'>
              <?php
              $title = $article->image->primary->title ? $article->image->primary->title : $article->title;
              echo html::a($url, html::image($article->image->primary->smallURL, "title='{$title}' class='thumbnail'" ));
              ?>
            </div>
            <?php endif;?>
將這段代碼剪貼到底25行的下面,即:



        <div class='item' id="article<?php echo $article->id?>" data-ve='article'>
            <?php if(!empty($article->image)):?>
            <div class='media pull-left'>
              <?php
              $title = $article->image->primary->title ? $article->image->primary->title : $article->title;
              echo html::a($url, html::image($article->image->primary->smallURL, "title='{$title}' class='thumbnail'" ));
              ?>
            </div>
            <?php endif;?>

然后將<div class='media pull-right'>中的pull-right 改為pull-left。保持即可。

注:修改文件之前最好做下備份。


上面是將圖片的展示位置移到左側顯示。下面我們調節樣式來控制圖片顯示大小。

進入后臺--設計--代碼管理--文章列表頁面:在CSS中輸入下面代碼


.thumbnail{
    width:150px;
    height:100px;
}
具體大小可以自行調整,保持即可,回到前臺,查看效果。

聯系我們

聯系人:ZSITE交流群

電話/微信:

Email:

QQ:

地址:青島市黃島區井岡山路157號中南金石國際廣場A座3205室

亚洲午夜精品A片一区二区无码l