phpcmsV9靜態頁面替換動態步驟

本文轉載自查看原文 2017-02-21 04:07 1355

1.先在www目錄下找到 phpcms + install_package + phpcms + templates在templates 文件夾里創建個自己的文件夾我弄得是 ceshi 文件夾，在 ceshi 文件夾里在創建 content 在 content 里面新建文本 index，

2.把要套的靜態網頁復制到剛建好的 index 文本里

3.替換

把文本里的css,js還有img樣式替換成模板里的類型

"css替換成"{CSS_PATH}css

"ji替換成"{JS_PATH}js

"images替換成"{IMG_PATH}images

4.把靜態網頁分成3部分

（1）頭部，導航

（2）內容【除了頭和底部剩下的都是屬於內容】

（3）底部，導航

5.把頭部導航，內容和底部導航分別以html文本形式保存在content文件夾里

（1底部）footer

（3中間）index

（3頭部）header

6.切完的代碼及效果

 <!--導航 結束 絕對定位-->

        <!--大圖 開始-->
        <div class="bigimg">
            <img src="{IMG_PATH}images/bigimg1.png" />
        </div>
        <!--大圖 結束-->

        <!--三項 開始-->
        <div style="width: 100%; height: 30px;"></div>
        <div class="three">
            <div class="three-item">
                <a href="#">
                    <img src="{IMG_PATH}images/three1.png" /></a>
            </div>
            <div class="three-item">
                <a href="#">
                    <img src="{IMG_PATH}images/three2.png" /></a>
            </div>
            <div class="three-item">
                <a href="#">
                    <img src="{IMG_PATH}images/three3.png" /></a>
            </div>
            <!--占位勿刪-->
            <div style="clear: both"></div>
        </div>
        <div style="width: 100%; height: 30px;"></div>
        <!--三項 結束-->

        <!--行業動態 資料庫 開始-->
        <div class="dt-zlk">
            <!--行業動態-->
            <div class="dt-double" style="left: 18.5%;">
                <!--標題-->
                <div class="dt-title">
                    <span class="dt-sp1">行業動態</span>
                    <a href="#"><span class="dt-sp2" style="color: white;">更多>></span></a>
                </div>
                <!--展示項-->
                <div class="dt-item">
                    <a href="#">
                        <div class="dt-item-title">漢企天啟網絡實訓員工啟動第一階段小組項目</div>
                    </a>
                    <div class="dt-item-context">
                        2016年12月12日上午，湊點字數看起來不那么少湊點字數看起來不那么少湊點字數看起來不那么少湊點字數看起來不那么少湊點字數看起來不那么少。
                    </div>
                </div>

                <div class="dt-item">
                    <a href="#">
                        <div class="dt-item-title">漢企天啟網絡實訓員工啟動第一階段小組項目</div>
                    </a>
                    <div class="dt-item-context">
                        2016年12月12日上午，湊點字數看起來不那么少。
                    </div>
                </div>

                <div class="dt-item">
                    <a href="#">
                        <div class="dt-item-title">漢企天啟網絡實訓員工啟動第一階段小組項目</div>
                    </a>
                    <div class="dt-item-context">
                        2016年12月12日上午，湊點字數看起來不那么少湊點字數看起來不那么少。
                    </div>
                </div>

                <div class="dt-item">
                    <a href="#">
                        <div class="dt-item-title">漢企天啟網絡實訓員工啟動第一階段小組項目</div>
                    </a>
                    <div class="dt-item-context">
                        2016年12月12日上午，湊點字數看起來不那么少湊點字數看起來不那么少湊點字數看起來不那么少。
                    </div>
                </div>


            </div>
            <!--資料庫-->
            <div class="dt-double" style="right: 18.5%;">

                <!--標題-->
                <div class="dt-title">
                    <span class="dt-sp1">漢企一一資料庫</span>
                    <a href="#"><span class="dt-sp2" style="color: white;">更多>></span></a>
                </div>
                <!--展示項-->
                <div class="dt-item">
                    <a href="#">
                        <div class="dt-item-title">漢企天啟網絡實訓員工啟動第一階段小組項目</div>
                    </a>
                    <div class="dt-item-context">
                        2016年12月12日上午，湊點字數看起來不那么少湊點字數看起來不那么少湊點字數看起來不那么少湊點字數看起來不那么少湊點字數看起來不那么少。
                    </div>
                </div>

                <div class="dt-item">
                    <a href="#">
                        <div class="dt-item-title">漢企天啟網絡實訓員工啟動第一階段小組項目</div>
                    </a>
                    <div class="dt-item-context">
                        2016年12月12日上午，湊點字數看起來不那么少。
                    </div>
                </div>

                <div class="dt-item">
                    <a href="#">
                        <div class="dt-item-title">漢企天啟網絡實訓員工啟動第一階段小組項目</div>
                    </a>
                    <div class="dt-item-context">
                        2016年12月12日上午，湊點字數看起來不那么少湊點字數看起來不那么少。
                    </div>
                </div>

                <div class="dt-item">
                    <a href="#">
                        <div class="dt-item-title">漢企天啟網絡實訓員工啟動第一階段小組項目</div>
                    </a>
                    <div class="dt-item-context">
                        2016年12月12日上午，湊點字數看起來不那么少湊點字數看起來不那么少湊點字數看起來不那么少。
                    </div>
                </div>
            </div>
            <img src="{IMG_PATH}images/bk1.png" />
        </div>
        <!--行業動態 資料庫 結束-->

        <!--優秀產品展示  開始-->
        <div class="yxxm">
            <div class="yxxm-title">優秀產品展示</div>
            <!--展示項-->
            <div class="yxxm-item">
                <a href="#">
                    <img src="{IMG_PATH}images/sss.png" /></a>
                <div class="yxxm-name">
                    項目名稱：
                    <span>《圖書管理系統》</span>
                </div>
                <div class="yxxm-user">
                    客　　戶：
                    <span>地方</span>
                </div>
                <div class="yxxm-context">
                    功　　能：
                    <span style="width: 77%;">好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊</span>
                </div>
                <div class="yxxm-context">
                    開發人員：
                    <span>天啟超人工作室</span>
                </div>
            </div>



            <div class="yxxm-item">
                <a href="#">
                    <img src="{IMG_PATH}images/sss.png" /></a>
                <div class="yxxm-name">
                    項目名稱：
                    <span>《圖書管理系統》</span>
                </div>
                <div class="yxxm-user">
                    客　　戶：
                    <span>地方</span>
                </div>
                <div class="yxxm-context">
                    功　　能：
                    <span style="width: 77%;">好多功能好厲害啊好多功能好厲害啊好多功能好厲害</span>
                </div>
                <div class="yxxm-context">
                    開發人員：
                    <span>天啟超人工作室</span>
                </div>
            </div>


            <div class="yxxm-item">
                <a href="#">
                    <img src="{IMG_PATH}images/sss.png" /></a>
                <div class="yxxm-name">
                    項目名稱：
                    <span>《圖書管理系統》</span>
                </div>
                <div class="yxxm-user">
                    客　　戶：
                    <span>地方</span>
                </div>
                <div class="yxxm-context">
                    功　　能：
                    <span style="width: 77%;">好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊</span>
                </div>
                <div class="yxxm-context">
                    開發人員：
                    <span>天啟超人工作室</span>
                </div>
            </div>


            <div class="yxxm-item">
                <a href="#">
                    <img src="{IMG_PATH}images/sss.png" /></a>
                <div class="yxxm-name">
                    項目名稱：
                    <span>《圖書管理系統》</span>
                </div>
                <div class="yxxm-user">
                    客　　戶：
                    <span>地方</span>
                </div>
                <div class="yxxm-context">
                    功　　能：
                    <span style="width: 77%;">好多功能好厲害啊</span>
                </div>
                <div class="yxxm-context">
                    開發人員：
                    <span>天啟超人工作室</span>
                </div>
            </div>


            <div class="yxxm-item">
                <a href="#">
                    <img src="{IMG_PATH}images/sss.png" /></a>
                <div class="yxxm-name">
                    項目名稱：
                    <span>《圖書管理系統》</span>
                </div>
                <div class="yxxm-user">
                    客　　戶：
                    <span>地方</span>
                </div>
                <div class="yxxm-context">
                    功　　能：
                    <span style="width: 77%;">好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊</span>
                </div>
                <div class="yxxm-context">
                    開發人員：
                    <span>天啟超人工作室</span>
                </div>
            </div>


            <div class="yxxm-item">
                <a href="#">
                    <img src="{IMG_PATH}images/sss.png" /></a>
                <div class="yxxm-name">
                    項目名稱：
                    <span>《圖書管理系統》</span>
                </div>
                <div class="yxxm-user">
                    客　　戶：
                    <span>地方</span>
                </div>
                <div class="yxxm-context">
                    功　　能：
                    <span style="width: 77%;">好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊</span>
                </div>
                <div class="yxxm-context">
                    開發人員：
                    <span>天啟超人工作室</span>
                </div>
            </div>

            <!--占位勿刪-->
            <div style="clear: both"></div>
        </div>
        <!--優秀產品展示  結束-->

        <!--公司業務承接 開始-->
        <div class="yw">
            <div class="yw-title">公司業務承接</div>
            <div class="yw-items">
                <div class="yw-item">
                    <img src="{IMG_PATH}images/ffff.png" />
                    <div class="yw-item-title">
                        日月潭紅茶
                        <span>www.rythc.com.cn</span>
                    </div>
                    <div class="yw-item-context">
                        紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹
                    </div>
                    <div class="yw-item-price">
                        <span class="price-sp">全能網站建設套餐</span>
                        <span class="price-sp1">價格：
                            <span class="price-sp2">1~500</span>
                            元</span>
                    </div>
                    <input class="btn_buy" type="button" value="點擊訂購" />
                </div>

                <div class="yw-item">
                    <img src="{IMG_PATH}images/ffff.png" />
                    <div class="yw-item-title">
                        日月潭紅茶
                        <span>www.rythc.com.cn</span>
                    </div>
                    <div class="yw-item-context">
                        紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹
                    </div>
                    <div class="yw-item-price">
                        <span class="price-sp">全能網站建設套餐</span>
                        <span class="price-sp1">價格：
                            <span class="price-sp2">500~1000</span>
                            元</span>
                    </div>
                    <input class="btn_buy" type="button" value="點擊訂購" />
                </div>

                <div class="yw-item">
                    <img src="{IMG_PATH}images/ffff.png" />
                    <div class="yw-item-title">
                        日月潭紅茶
                        <span>www.rythc.com.cn</span>
                    </div>
                    <div class="yw-item-context">
                        紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹
                    </div>
                    <div class="yw-item-price">
                        <span class="price-sp">全能網站建設套餐</span>
                        <span class="price-sp1">價格：
                            <span class="price-sp2">2000~5000</span>
                            元</span>
                    </div>
                    <input class="btn_buy" type="button" value="點擊訂購" />
                </div>

                <div class="yw-item">
                    <img src="{IMG_PATH}images/ffff.png" />
                    <div class="yw-item-title">
                        日月潭紅茶
                        <span>www.rythc.com.cn</span>
                    </div>
                    <div class="yw-item-context">
                        紅茶介紹紅茶介紹紅茶介紹
                    </div>
                    <div class="yw-item-price">
                        <span class="price-sp">全能網站建設套餐</span>
                        <span class="price-sp1">價格：
                            <span class="price-sp2">1~10000</span>
                            元</span>
                    </div>
                    <input class="btn_buy" type="button" value="點擊訂購" />
                </div>

                <div class="yw-item">
                    <img src="{IMG_PATH}images/ffff.png" />
                    <div class="yw-item-title">
                        日月潭紅茶
                        <span>www.rythc.com.cn</span>
                    </div>
                    <div class="yw-item-context">
                        紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹
                    </div>
                    <div class="yw-item-price">
                        <span class="price-sp">全能網站建設套餐</span>
                        <span class="price-sp1">價格：
                            <span class="price-sp2">1980</span>
                            元</span>
                    </div>
                    <input class="btn_buy" type="button" value="點擊訂購" />
                </div>

                <div class="yw-item">
                    <img src="{IMG_PATH}images/ffff.png" />
                    <div class="yw-item-title">
                        日月潭紅茶
                        <span>www.rythc.com.cn</span>
                    </div>
                    <div class="yw-item-context">
                        紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹
                    </div>
                    <div class="yw-item-price">
                        <span class="price-sp">全能網站建設套餐</span>
                        <span class="price-sp1">價格：
                            <span class="price-sp2">2980</span>
                            元</span>
                    </div>
                    <input class="btn_buy" type="button" value="點擊訂購" />
                </div>

                <div class="yw-item">
                    <img src="{IMG_PATH}images/ffff.png" />
                    <div class="yw-item-title">
                        日月潭紅茶
                        <span>www.rythc.com.cn</span>
                    </div>
                    <div class="yw-item-context">
                        紅茶介紹紅茶介紹紅茶介紹紅 紅茶介紹紅茶介紹紅茶介紹紅 紅茶介紹紅茶介紹紅茶介紹紅 紅茶介紹紅茶介紹紅茶介紹紅 紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹
                    </div>
                    <div class="yw-item-price">
                        <span class="price-sp">全能網站建設套餐</span>
                        <span class="price-sp1">價格：
                            <span class="price-sp2">5980</span>
                            元</span>
                    </div>
                    <input class="btn_buy" type="button" value="點擊訂購" />
                </div>

                <div class="yw-item">
                    <img src="{IMG_PATH}images/ffff.png" />
                    <div class="yw-item-title">
                        日月潭紅茶
                        <span>www.rythc.com.cn</span>
                    </div>
                    <div class="yw-item-context">
                        紅茶介紹紅茶介紹紅茶介紹
                    </div>
                    <div class="yw-item-price">
                        <span class="price-sp">全能網站建設套餐</span>
                        <span class="price-sp1">價格：
                            <span class="price-sp2">12980</span>
                            元</span>
                    </div>
                    <input class="btn_buy" type="button" value="點擊訂購" />
                </div>

            </div>
            <img src="{IMG_PATH}images/bk2.png" />
        </div>
        <!--公司業務承接 結束-->

        <!--優秀人才推薦 開始-->
        <div class="rc">
            <div class="rc-title">優秀人才推薦</div>

            <div class="rc-items">
                <!--人才項-->
                <div class="rc-item">
                    <a href="#">
                        <img src="{IMG_PATH}images/mv.png" />
                        <div class="rc-item-title">孟艷茹/創意設計師</div>
                    </a>
                    <div class="rc-item-context">服務眾多品牌，擔任多家公司顧問</div>
                </div>


                <div class="rc-item">
                    <a href="#">
                        <img src="{IMG_PATH}images/mv.png" />
                        <div class="rc-item-title">孟艷茹/創意設計師</div>
                    </a>
                    <div class="rc-item-context">服務眾多品牌，擔任多家公司顧問</div>
                </div>

                <div class="rc-item">
                    <a href="#">
                        <img src="{IMG_PATH}images/mv.png" />
                        <div class="rc-item-title">孟艷茹/創意設計師</div>
                    </a>
                    <div class="rc-item-context">服務眾多品牌，擔任多家公司顧問</div>
                </div>

                <div class="rc-item">
                    <a href="#">
                        <img src="{IMG_PATH}images/mv.png" />
                        <div class="rc-item-title">孟艷茹/創意設計師</div>
                    </a>
                    <div class="rc-item-context">服務眾多品牌，擔任多家公司顧問</div>
                </div>

                <div class="rc-item">
                    <a href="#">
                        <img src="{IMG_PATH}images/mv.png" />
                        <div class="rc-item-title">孟艷茹/創意設計師</div>
                    </a>
                    <div class="rc-item-context">服務眾多品牌，擔任多家公司顧問</div>
                </div>

                <div class="rc-item">
                    <a href="#">
                        <img src="{IMG_PATH}images/mv.png" />
                        <div class="rc-item-title">孟艷茹/創意設計師</div>
                    </a>
                    <div class="rc-item-context">服務眾多品牌，擔任多家公司顧問</div>
                </div>

                <div class="rc-item">
                    <a href="#">
                        <img src="{IMG_PATH}images/mv.png" />
                        <div class="rc-item-title">孟艷茹/創意設計師</div>
                    </a>
                    <div class="rc-item-context">服務眾多品牌，擔任多家公司顧問</div>
                </div>

                <div class="rc-item">
                    <a href="#">
                        <img src="{IMG_PATH}images/mv.png" />
                        <div class="rc-item-title">孟艷茹/創意設計師</div>
                    </a>
                    <div class="rc-item-context">服務眾多品牌，擔任多家公司顧問</div>
                </div>

                <!--占位勿刪-->
                <div style="clear: both"></div>
            </div>
        </div>
        <!--優秀人才推薦 結束-->

        <!--聯系我們 開始-->
        <div class="lx-context1">聯系我們</div>
        <div class="lx-context2">如有任何疑問請聯系我們，我們7*24小時竭誠為您服務</div>
        <div class="lx-context1">400-0533-575</div>

        <div class="lx-items">
            <div class="lx-item">
                <div class="lx-item-child">
                    <img src="{IMG_PATH}images/lx1.png" />
                    <div class="lx-item-context">
                        <a href="#"><span class="lx-item-sp1">在線QQ客服</span><br />
                        </a>
                        <span class="lx-item-sp2">周一至周六 8:30-17:30</span>
                    </div>
                </div>
            </div>

            <div class="lx-item">
                <div class="lx-item-child">
                    <img src="{IMG_PATH}images/lx2.png" />
                    <div class="lx-item-context">
                        <a href="#"><span class="lx-item-sp1">郵箱</span><br />
                        </a>
                        <span class="lx-item-sp2">關注企業郵箱</span>
                    </div>
                </div>
            </div>


            <div class="lx-item" style="border-right: 1px solid #828282;">
                <div class="lx-item-child">
                    <img src="{IMG_PATH}images/lx3.png" />
                    <div class="lx-item-context">
                        <a href="#"><span class="lx-item-sp1">網站</span><br />
                        </a>
                        <span class="lx-item-sp2">瀏覽網站動態</span>
                    </div>
                </div>
            </div>
        </div>

        <div style="width: 100%; height: 50px;"></div>
        <!--聯系我們 結束-->

        <!--底部 開始-->

<script src="{JS_PATH}JS/HeaderAndFooter.js"></script>
<script src="{JS_PATH}JS/index.js"></script>
<script>
    $("#btn1").click(function () {
        $("#li").fadeIn();
    });
    $("#btn2").click(function () {
        $("#li").fadeOut();
    });

</script>

7.頁面都亂了，少頭部導航

加句話{template "content","header"}就有頭部導航了。template是引入模板的標簽。content文件夾。引入的是他header頭部導航

如圖

8.{template "content","footer"}

9.把頭里面靜態內容替換成動態的

（1）把寫死的站點標題讓他不要寫死復制一句代碼

{if isset($SEO['title']) && !empty($SEO['title'])}{$SEO['title']}{/if}{$SEO['site_title']}

10.在<head>下面加上下面2句話，（1）keywords等於網站關鍵字，為了百度能搜到做網頁用（2）description網站描述，為了做網絡優化用

    
<meta name="keywords" content="{$SEO['keyword']}">　　<!--keywords等於網站關鍵字，為了百度能搜到做網頁用-->
<meta name="description" content="{$SEO['description']}">　　<!--description網站描述，為了做網絡優化用-->

11.logo是寫死的，沒換

12.導航欄，把欄目替換掉搞成活的

<div class="header-items">
                <a href="#">
                    <div class="h-item select">首頁</div>
                </a>
                <div class="h-item2">/</div>
                <a href="#">
                    <div class="h-item">產品</div>
                </a>
                <div class="h-item2">/</div>
                <a href="#">
                    <div class="h-item">人才</div>
                </a>
                <div class="h-item2">/</div>
                <a href="#">
                    <div class="h-item">資源</div>
                </a>
                <div class="h-item2">/</div>
                <a href="#">
                    <div class="h-item">承接</div>
                </a>
                <div class="h-item2">/</div>
                <a href="#">
                    <div class="h-item">動態</div>
                </a>
                <div class="h-item2">/</div>
                <a href="#">
                    <div class="h-item">我們</div>
                </a>
            </div>

        </div>
        <div class="header1"></div>

首頁不動。導航里每項都一樣保留一項其余刪掉之后用循環讓他們都顯示，后台有幾個就循環幾次

頭部header改完動態的樣子如下

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    
    <meta name="keywords" content="{$SEO['keyword']}"><!--keywords等於網站關鍵字，為了百度能搜到做網頁用-->
	<meta name="description" content="{$SEO['description']}"><!--description網站描述，為了做網絡優化用-->
    
    <link href="{CSS_PATH}CSS/HeaderAndFooter.css" rel="stylesheet" />
    <link href="{CSS_PATH}CSS/indexStyle.css" rel="stylesheet" />
    <script src="{JS_PATH}JS/jquery-1.7.2.min.js"></script>
    <title>{if isset($SEO['title']) && !empty($SEO['title'])}{$SEO['title']}{/if}{$SEO['site_title']}</title>
</head>
<body>
    <div style="position: absolute; top: 0px; left: 0px; width: 100%; min-width: 1200px;">

        <!--導航 開始 絕對定位-->
        <div class="header">
            <div class="logo-1">
                <img src="{IMG_PATH}images/logo1.png" />
            </div>
            ]
            <div class="logo-2">
                <img src="{IMG_PATH}images/logo1.png" />
            </div>

            <div class="header-items">
           <!-- (1方案)-->
               <!-- <a href="{siteurl($siteid)}"><!--這是個方法獲取首頁-->
               <!-- <div class="h-item select">首頁</div><!--select選中變顏色-->
               <!-- </a>
                <div class="h-item2">/</div>-->
                
               <!-- （2方案）-->
                <!--找到父級最上面的ID等於零就是首頁-->
				{if $top_parentid==0}<!--判斷首頁顯示的是不是首頁--> 
                <a href="{siteurl($siteid)}">
                    <div class="h-item select">首頁</div>
                </a>
                {else}
                <a href="{siteurl($siteid)}">
                    <div class="h-item">首頁</div>
                </a>
                {/if}
                
                
                
                
                <!--循環導航欄-->
                <!--pc標簽是phpcms簡寫。pc標簽作用相當於參數-->
                <!--：content代表要取的內容，因為剛找的就是內容模塊-->
                <!--action="category"代表取欄目-->
                <!--catid="0"零代表找所有以及菜單-->
                <!--num="5"代表數量要掉幾個-->
                <!--siteid="$siteid"代表站點id或者 寫1也可以-->
                <!--order排序-->
                <!--order="listorder ASC"這句話的意思是根據listorder ASC升序排列-->
                <!--listorder根據欄目添加的數據排序-->
                {pc:content action="category" catid="0" num="25" siteid="$siteid" order="listorder ASC"}
                
				{loop $data $r}<!--循環遍歷數組--><!--根據PC標簽里的條件查到的$data遍歷完了就是$r。二維數組遍歷出的小數組-->
				<!--<li><a href="{$r[url]}"><span>{$r[catname]}</span></a></li>-->
                
                {if $catid==$r[catid] || $top_parentid==$r[catid]}<!--判斷顯示的catid，如果是顯示的catid--> 
                   
                   
                  <!-- （2方案）-->
                    <div class="h-item2">/</div>
                    <a href="{$r[url]}">
                        <div class="h-item select">{$r[catname]}</div>
                    </a>
                    {else}
                    <div class="h-item2">/</div>
                    <a href="{$r[url]}">
                        <div class="h-item">{$r[catname]}</div>
                    </a>
                 	{/if}
                
                
              <!--  （1方案）-->
                <!--循環輸出-->
               <!-- <a href="{$r[url]}"><!--url是欄目的鏈接-->
                    <!--<div class="h-item">{$r[catname]}</div><!--產品應該換成欄目名稱-->
               <!-- </a>
                <div class="h-item2">/</div>-->
				{/loop}
				{/pc}
      
            </div>

        </div>
        <div class="header1"></div>

13.底腳靜態變動太

<div class="footer">
            <div class="f-top">
                <a href="#"><span class="f-item select">首頁</span></a>
                <span>/</span>
                <a href="#"><span class="f-item">產品</span></a>
                <span>/</span>
                <a href="#"><span class="f-item">人才</span></a>
                <span>/</span>
                <a href="#"><span class="f-item">資源</span></a>
                <span>/</span>
                <a href="#"><span class="f-item">承接</span></a>
                <span>/</span>
                <a href="#"><span class="f-item">動態</span></a>
                <span>/</span>
                <a href="#"><span class="f-item">我們</span></a>
            </div>

            <div class="f-bottom">
                <div class="fb-left">
                    <img src="{IMG_PATH}images/logo2.png" />
                </div>
                <div class="fb-right">
                    <div class="fb-right-context">
                        地址：張店區共青團西路富麗商城A座4樓<br />
                        電話：400-0533-575/0533-3113118<br />
                        網站：www.itnba.com<br />
                        郵箱：zbhq@itnba.com
                    </div>

                </div>
            </div>
        </div>
        <!--底部 結束-->
    </div>
</body>
</html>
<script src="{JS_PATH}JS/HeaderAndFooter.js"></script>

動態

        <div class="footer">
            <div class="f-top">
				{if $top_parentid==0}<!--判斷首頁顯示的是不是首頁--> 
                <a href="{siteurl($siteid)}">
                    <div class="h-item select">首頁</div>
                </a>
                {else}
                <a href="{siteurl($siteid)}">
                    <div class="h-item">首頁</div>
                </a>
                {/if}
                 {pc:content action="category" catid="0" num="5" siteid="$siteid" order="listorder ASC"}
                 {loop $data $r}
                 {if $catid==$r[catid] || $top_parentid==$r[catid]}
                 
                                     <div class="h-item2">/</div>
                    <a href="{$r[url]}">
                        <div class="h-item select">{$r[catname]}</div>
                    </a>
                    {else}
                    <div class="h-item2">/</div>
                    <a href="{$r[url]}">
                        <div class="h-item">{$r[catname]}</div>
                    </a>
                 	{/if}
                
                	
                {/loop}
                {/pc}
            </div>

            <div class="f-bottom">
                <div class="fb-left">
                    <img src="{IMG_PATH}images/logo2.png" />
                </div>
                <div class="fb-right">
                    <div class="fb-right-context">
                        地址：張店區共青團西路富麗商城A座4樓<br />
                        電話：400-0533-575/0533-3113118<br />
                        網站：www.itnba.com<br />
                        郵箱：zbhq@itnba.com
                    </div>

                </div>
            </div>
        </div>
        <!--底部 結束-->
    </div>
</body>
</html>
<script src="{JS_PATH}JS/HeaderAndFooter.js"></script>

14.中間部分內容

（1）換大圖

  <div class="bigimg">換大圖
    {pc:content  action="lists" catid="18" order="id DESC" num="1"}
    {loop $data $val}
    <img src="{$val[thumb]}" />
    {/loop}
    {/pc}
  </div>

(2)作如圖下點擊跳轉

修改前

<!--三項 開始-->
        <div style="width: 100%; height: 30px;"></div>
        <div class="three">
            <div class="three-item">
                <a href="#">  <!--要修改的地方-->
                    <img src="images/three1.png" /></a>
            </div>
            <div class="three-item">
                <a href="#">
                    <img src="images/three2.png" /></a>
            </div>
            <div class="three-item">
                <a href="#">
                    <img src="images/three3.png" /></a>
            </div>
            <!--占位勿刪-->
            <div style="clear: both"></div>
        </div>
        <div style="width: 100%; height: 30px;"></div>
        <!--三項 結束-->

修改后

     <!--三項 開始-->
        <div style="width: 100%; height: 30px;"></div>
        <div class="three">
            <div class="three-item">
					<!--做軟件是承接第八個-->
                <a href="{$CATEGORYS[8]['url']}">
                    <img src="{IMG_PATH}images/three1.png" /></a>
            </div>
            <div class="three-item">
                <a href="{$CATEGORYS[6]['url']}">
                    <img src="{IMG_PATH}images/three2.png" /></a>
            </div>
            <div class="three-item">
                <a href="{$CATEGORYS[7]['url']}">
                    <img src="{IMG_PATH}images/three3.png" /></a>
            </div>
            <!--占位勿刪-->
            <div style="clear: both"></div>
        </div>
        <div style="width: 100%; height: 30px;"></div>
        <!--三項 結束-->

（3）把動態也換了可以改變的

該后代碼

        <!--行業動態 資料庫 開始-->
        <div class="dt-zlk">
            <!--行業動態-->
            <div class="dt-double" style="left: 18.5%;">
                <!--標題-->
                <div class="dt-title">
                    <span class="dt-sp1">行業動態</span>
                    <a href="{$CATEGORYS[9][url]}"><span class="dt-sp2" style="color: white;">更多>></span></a>
                </div>
                <!--展示項-->
                <!--保留一個循環-->
                
                {pc:content  action="lists" catid="9" order="id DESC" num="4"}

                 {loop $data $key $val}
                 
				<div class="dt-item">
                    <a href="{$val[url]}"><!--鏈接地址-->
                    
					<div class="dt-item-title"><!--文章標題-->{$val[title]}</div>
                    </a>
                    <div class="dt-item-context"><!--description文章的簡介-->
                       {$val[description]} 
                        
                    </div>
				</div>
                 
                 
                 {/loop}

                 {/pc}
                
                

               <!-- <div class="dt-item">
                    <a href="#">
                        <div class="dt-item-title">漢企天啟網絡實訓員工啟動第一階段小組項目</div>
                    </a>
                    <div class="dt-item-context">
                        2016年12月12日上午，湊點字數看起來不那么少。
                    </div>
                </div>

                <div class="dt-item">
                    <a href="#">
                        <div class="dt-item-title">漢企天啟網絡實訓員工啟動第一階段小組項目</div>
                    </a>
                    <div class="dt-item-context">
                        2016年12月12日上午，湊點字數看起來不那么少湊點字數看起來不那么少。
                    </div>
                </div>

                <div class="dt-item">
                    <a href="#">
                        <div class="dt-item-title">漢企天啟網絡實訓員工啟動第一階段小組項目</div>
                    </a>
                    <div class="dt-item-context">
                        2016年12月12日上午，湊點字數看起來不那么少湊點字數看起來不那么少湊點字數看起來不那么少。
                    </div>
                </div>-->


            </div>
            <!--資料庫-->
            <div class="dt-double" style="right: 18.5%;">

                <!--標題-->
                <div class="dt-title">
                    <span class="dt-sp1">漢企一一資料庫</span>
                    <a href="{$CATEGORYS[10][url]}"><span class="dt-sp2" style="color: white;">更多</span></a>
                </div>
                <!--展示項-->
                {pc:content  action="lists" catid="10" order="id DESC" num="4"}

				{loop $data $key $val}
                
                <div class="dt-item">
                    <a href="{$val[url]}">
                        <div class="dt-item-title">{$val[title]}</div>
                    </a>
                    <div class="dt-item-context">
                     {$val[description]} 
                       
                    </div>
                </div>
			{/loop}

			{/pc}
                
                

                
            </div>
            <img src="{IMG_PATH}images/bk1.png" />
        </div>
        <!--行業動態 資料庫 結束-->

效果圖

15.要做的如下圖，優秀產品

（1）優秀產品

    <!--標題-->
                <div class="dt-title">
                    <span class="dt-sp1">漢企一一資料庫</span>
                    <a href="{$CATEGORYS[10][url]}"><span class="dt-sp2" style="color: white;">更多</span></a>
                </div>
                <!--展示項-->
                {pc:content  action="lists" catid="10" order="id DESC" num="4"}

				{loop $data $key $val}
                
                <div class="dt-item">
                    <a href="{$val[url]}">
                        <div class="dt-item-title">{$val[title]}</div>
                    </a>
                    <div class="dt-item-context">
                     {$val[description]} 
                       
                    </div>
                </div>
			{/loop}

			{/pc}
                
                

                
            </div>
            <img src="{IMG_PATH}images/bk1.png" />
        </div>
        <!--行業動態 資料庫 結束-->

        <!--優秀產品展示  開始-->
        <div class="yxxm">
            <div class="yxxm-title">優秀產品展示</div>
            <!--展示項-->
            
			{pc:content  action="lists" catid="11" order="id DESC" num="6" moreinfo="1"}<!--moreinfo="1"代表查詢更多信息-->

			{loop $data $key $val}
            
			<div class="yxxm-item">
				<a href="{$val[url]}"><!--產品地址-->
				<img src="{$val[thumb]}" /></a><!--圖片地址-->
			<div class="yxxm-name">
                    項目名稱：
			<span>{$val[title]}</span><!--內容里的標題-->
			</div>
			<div class="yxxm-user">
                    客　　戶：
			<span>{$val[keywords]}</span><!--內容里的關鍵字-->
			</div>
			<div class="yxxm-context">
                    功　　能：
			<span style="width: 77%;">{$val[description]}<!--功能用簡介作--></span>
			</div>
			<div class="yxxm-context">
                    開發人員：
			<span>{php list($copyfrom) = explode('|', $val['copyfrom'])}
                    {$copyfrom}</span><!--開發用來原作-->
			</div>
		</div>
            
			{/loop}

			{/pc}

運行如下

16.公司業務承接

 <div class="yw">
            <div class="yw-title">公司業務承接</div>
            
             <div class="yw-items">
             {pc:content  action="lists" catid="8" order="id DESC" num="8"}

             {loop $data $key $val}
                <div class="yw-item">
                    <img src="{$val[thumb]}" />
                    <div class="yw-item-title">
                        {$val[title]}
                        
                    </div>
                    <div class="yw-item-context">
                        {$val[description]}
                    </div>
                    <div class="yw-item-price">
                        <span class="price-sp">{$val['title']}</span>
                        <span class="price-sp1">價格：
                            <span class="price-sp2">{$val['keywords']}</span>
                            元</span>
                    </div>
                    <a href="{$val['url']}"><input class="btn_buy" type="button" value="點擊訂購" /></a>
                </div>
            
             {/loop}

             {/pc}
            
            </div>
            
           
            <img src="{IMG_PATH}images/bk2.png" />
        </div>

運行如下

17.優秀人才推薦

   <div class="rc">
            <div class="rc-title">優秀人才推薦</div>

            <div class="rc-items">
                <!--人才項-->
                
                
                {pc:content  action="lists" catid="6" order="id DESC" num="8" moreinfo="1"}

                 {loop $data $key $val}
				<div class="rc-item">
					<a href="#">
					<img src="{$val[thumb]}" />
					<div class="rc-item-title">{$val[title]}</div>
                    </a>
					<div class="rc-item-context">{$val[description]}</div>
                </div>
                    
                 {/loop}

                 {/pc}
                



                <!--占位勿刪-->
                <div style="clear: both"></div>
            </div>
        </div>

運行如下

18.人才里的內容列表list.htmh(1)把頭部導航刪了（2）把頁腳刪了

（3）把頭和頁腳拿進來

【1】頭部{template "content","header"}

【2】頁腳{template "content","footer"}

運行效果如下

19.給圖片該樣式

{template "content","header"}<!--把這個頭也就是導航拿過來就好了-->

<link href="{CSS_PATH}css/ListStyle.css" rel="stylesheet" />
        <!--導航背景-->
        <div style="position: relative; width: 100%; height: 100px; background-image: url"{IMG_PATH}images/bigimg11.png);"></div>

        <!--二級導航 開始-->
        <div class="left">
            <div style="width: 100%; height: 50px; text-align: center; line-height: 50px; font-size: 18px; font-weight: bold;">欄目標題</div>
            <div class="left-item">人才介紹</div>
            <div class="left-item">標題標題</div>
            <div class="left-item">李昌輝很胖</div>
            <div class="left-item">測試標題</div>
            <div class="left-item">選項選項選項</div>
            <div class="left-item">李昌輝腰疼</div>
            <div class="left-item">王胖胖</div>
        </div>
        <!--二級導航 結束-->

        <!--列表區 開始-->
        <div class="right">
            <div class="list-title">    列表標題</div>

            <!--列表項-->
            <div class="right-item">
                <a href="#">
                    <div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
                </a>
                <div class="item-time">2016-12-24</div>
            </div>

            <div class="right-item">
                <a href="#">
                    <div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
                </a>
                <div class="item-time">2016-12-24</div>
            </div>

            <div class="right-item">
                <a href="#">
                    <div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
                </a>
                <div class="item-time">2016-12-24</div>
            </div>

            <div class="right-item">
                <a href="#">
                    <div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
                </a>
                <div class="item-time">2016-12-24</div>
            </div>

            <div class="right-item">
                <a href="#">
                    <div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
                </a>
                <div class="item-time">2016-12-24</div>
            </div>

            <div class="right-item">
                <a href="#">
                    <div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
                </a>
                <div class="item-time">2016-12-24</div>
            </div>

            <div class="right-item">
                <a href="#">
                    <div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
                </a>
                <div class="item-time">2016-12-24</div>
            </div>

            <div class="right-item">
                <a href="#">
                    <div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
                </a>
                <div class="item-time">2016-12-24</div>
            </div>

            <div class="right-item">
                <a href="#">
                    <div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
                </a>
                <div class="item-time">2016-12-24</div>
            </div>

            <div class="right-item">
                <a href="#">
                    <div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
                </a>
                <div class="item-time">2016-12-24</div>
            </div>


            <!--分頁-->
            <div class="paging">
                當前第[1]頁　共[10]頁　首頁　上一頁　下一頁　末頁
            </div>
        </div>
        <!--列表區 結束-->
        <div style="clear: both;"></div>


        <!--友情鏈接 分割區-->
        <div style="width: 100%; height: 40px; line-height: 40px; text-align: center; background-color: #e0e0e0;">
            友情鏈接：
            <a href="#">淄博漢企人才定制中心</a>  
            <a href="#">淄博漢企人才定制中心</a>  
            <a href="#">淄博漢企人才定制中心</a>  
            <a href="#">淄博漢企人才定制中心</a>  
        </div>

        <!--底部 開始-->

{template "content","footer"}<!--低腳加這句話-->

<script type="text/javascript">
    var oBk;
    $(".right-item").hover(function () {
        oBk = $(this).css("background-color");
        $(this).css("background-color", "#E8E8E8");
    }, function () {
        $(this).css("background-color", oBk);
    });

    var oBk2;
    $(".left-item").hover(function () {
        oBk2 = $(this).css("background-color");
        $(this).css("background-color", "#E8E8E8");
    }, function () {
        $(this).css("background-color", oBk2);
    });
    
</script>

如上面圖中左側欄里要讓顯示導航欄

list.html左側導航列表以及分頁

{template "content","header"}<!--把這個頭也就是導航拿過來就好了-->

<link href="{CSS_PATH}css/ListStyle.css" rel="stylesheet" />
        <!--導航背景-->
        <div style="position: relative; width: 100%; height: 100px; background-image: url({$CAT['image']});"></div>


        <!--二級導航 開始-->
		<div class="left">
            <div style="width: 100%; height: 50px; text-align: center; line-height: 50px; font-size: 18px; font-weight: bold;">導航</div>
             <a href="{siteurl($siteid)}"><!--跳轉首頁-->
               	 <div class="left-item">首頁</div>
              </a>
            
            {pc:content  action="category" catid="0" order="listorder ASC" num="6" siteid="$siteid"}

                 {loop $data $r}
                  	{if $catid==$r[catid] || $top_parentid==$r[catid]}<!--判斷顯示的catid，如果是顯示的catid--> 
                    <a href="{$r[url]}"><div class="left-item sel">{$r[catname]}</div></a>
                    {else}
                     <a href="{$r[url]}"><div class="left-item">{$r[catname]}</div></a>
                 	{/if}
                    
                 {/loop}
     			 {/pc}
            	
        </div>
        <!--二級導航 結束-->

        <!--列表區 開始-->
        <div class="right">
            <div class="list-title">    {$CATEGORYS[$catid][catname]}列表</div>

            <!--列表項-->
            {pc:content  action="lists" catid="$catid" order="id DESC" num="5" page="$page"}<!--實現分頁num="5" page="$page"要找第幾頁並顯示幾條-->

             {loop $data $key $val}
			<div class="right-item">
                <a href="{$val[url]}">
                    <div class="item-context">{$val[title]}</div>
                </a>
                <div class="item-time">{$val[inputtime]}</div>
            </div>
             {/loop}

             {/pc}
            
            
            
            <!--分頁-->
            <div class="paging">
             {$pages}<!--實現分頁-->
            </div>
        </div>
        <!--列表區 結束-->
        <div style="clear: both;"></div>


        <!--友情鏈接 分割區-->
        <div style="width: 100%; height: 40px; line-height: 40px; text-align: center; background-color: #e0e0e0;">
            友情鏈接：
            {pc:link  action="type_list" typeid="0" siteid="$siteid" linktype="1" order="listorder DESC" num="3" return="pic_link"}<!--return="pic_link"返回帶有圖標的-->
             {loop $pic_link $v}
             <a href="{$v['url']}">{$v['name']}</a>  
             
             {/loop}
             {/pc}
           
        </div>

        <!--底部 開始-->

{template "content","footer"}<!--低腳加這句話-->

<script type="text/javascript">
    var oBk;
    $(".right-item").hover(function () {
        oBk = $(this).css("background-color");
        $(this).css("background-color", "#E8E8E8");
    }, function () {
        $(this).css("background-color", oBk);
    });

    var oBk2;
    $(".left-item").hover(function () {
        oBk2 = $(this).css("background-color");
        $(this).css("background-color", "#E8E8E8");
    }, function () {
        $(this).css("background-color", oBk2);
    });
    
</script>

20.人才里的二級頁面則走的時候category.html頁面

{template "content","header"}<!--把這個頭也就是導航拿過來就好了-->

<link href="{CSS_PATH}css/ListStyle.css" rel="stylesheet" />

        <!--導航背景-->
        <div style="position: relative; width: 100%; height: 100px; background-image: url({IMG_PATH}images/bigimg11.png);"></div>

        <!--二級導航 開始-->
        <div class="left">
            <div style="width: 100%; height: 50px; text-align: center; line-height: 50px; font-size: 18px; font-weight: bold;">欄目標題</div>
           {pc:content  action="category" catid="$catid"<!--把人才分1027-0904--> order="listorder ASC" num="6" siteid="$siteid"}

                 {loop $data $r}
                  	{if $catid==$r[catid] || $top_parentid==$r[catid]}<!--判斷顯示的catid，如果是顯示的catid--> 
                    <a href="{$r[url]}"><div class="left-item sel">{$r[catname]}</div></a>
                    {else}
                     <a href="{$r[url]}"><div class="left-item">{$r[catname]}</div></a>
                 	{/if}
                    
                 {/loop}
     			 {/pc}
        </div>
        <!--二級導航 結束-->

        <!--列表區 開始-->
        <div class="right">
            <div class="list-title">    {$CATEGORYS[$catid][catname]}</div>

            <!--列表項-->
            <div class="picitems">

                <!--展示項-->
                 {pc:content  action="lists" catid="$catid" order="id DESC" num="8" page="$page"}<!--實現分頁num="5" page="$page"要找第幾頁並顯示幾條-->

             {loop $data $key $val}
			<div class="pic-item">
                 <a href="{$val[url]}"><img src="{$val[thumb]}" /></a>
                 <div class="pic-item-title">{$val[title]}</div>
                 <div class="pic-item-title2">{$val[keywords]}</div>
                 <div class="pic-item-context">{$val[description]}</div>
             </div>
             {/loop}

             {/pc}
                
                
                <div style="clear: both;"></div>
            </div>

            <!--分頁-->
            <div class="paging">
               {$pages}
            </div>
        </div>
        <!--列表區 結束-->
        <div style="clear: both;"></div>


        <!--友情鏈接 分割區-->
        <div style="width: 100%; height: 40px; line-height: 40px; text-align: center; background-color: #e0e0e0;">
            友情鏈接：
            <a href="#">淄博漢企人才定制中心</a>  
            <a href="#">淄博漢企人才定制中心</a>  
            <a href="#">淄博漢企人才定制中心</a>  
            <a href="#">淄博漢企人才定制中心</a>  
        </div>

       {template "content","footer"}<!--低腳加這句話-->

<script type="text/javascript">
    var oBk2;
    $(".left-item").hover(function () {
        oBk2 = $(this).css("background-color");
        $(this).css("background-color", "#E8E8E8");
    }, function () {
        $(this).css("background-color", oBk2);
    });

    var oBk3;

    $(".pic-item").hover(function () {
        oBk3 = $(this).css("background-color");
        $(this).css("background-color", "#E8E8E8");
    }, function () {
        $(this).css("background-color", oBk3);
    });

</script>
如圖下

21.人才下面又分了兩個如圖

注意：把人才分1027-0904.取父級IDcatid="$parentid"就不用去頂級IDcatid="$catid"因為是人才的分頁

代碼如下

{template "content","header"}<!--把這個頭也就是導航拿過來就好了-->

<link href="{CSS_PATH}css/ListStyle.css" rel="stylesheet" />

        <!--導航背景-->
        <div style="position: relative; width: 100%; height: 100px; background-image: url({IMG_PATH}images/bigimg11.png);"></div>

        <!--二級導航 開始-->
        <div class="left">
            <div style="width: 100%; height: 50px; text-align: center; line-height: 50px; font-size: 18px; font-weight: bold;">欄目標題</div>
           {pc:content  action="category" catid="$parentid"<!--把人才分1027-0904.取父級IDcatid="$parentid"就不用去頂級IDcatid="$catid"因為是人才的分頁--> order="listorder ASC" num="6" siteid="$siteid"}

                 {loop $data $r}
                  	{if $catid==$r[catid] || $top_parentid==$r[catid]}<!--判斷顯示的catid，如果是顯示的catid--> 
                    <a href="{$r[url]}"><div class="left-item sel">{$r[catname]}</div></a>
                    {else}
                     <a href="{$r[url]}"><div class="left-item">{$r[catname]}</div></a>
                 	{/if}
                    
                 {/loop}
     			 {/pc}
        </div>
        <!--二級導航 結束-->

        <!--列表區 開始-->
        <div class="right">
            <div class="list-title">    {$CATEGORYS[$catid][catname]}</div>

            <!--列表項-->
            <div class="picitems">

                <!--展示項-->
                 {pc:content  action="lists" catid="$parentid"<!--catid="$parentid"取父級ID要取頂級是catid="$catid"--> order="id DESC" num="8" page="$page"}<!--實現分頁num="5" page="$page"要找第幾頁並顯示幾條-->

             {loop $data $key $val}
			<div class="pic-item">
                 <a href="{$val[url]}"><img src="{$val[thumb]}" /></a>
                 <div class="pic-item-title">{$val[title]}</div>
                 <div class="pic-item-title2">{$val[keywords]}</div>
                 <div class="pic-item-context">{$val[description]}</div>
             </div>
             {/loop}

             {/pc}
                
                
                

                

                
                <div style="clear: both;"></div>
            </div>

            <!--分頁-->
            <div class="paging">
               {$pages}
            </div>
        </div>
        <!--列表區 結束-->
        <div style="clear: both;"></div>


        <!--友情鏈接 分割區-->
        <div style="width: 100%; height: 40px; line-height: 40px; text-align: center; background-color: #e0e0e0;">
            友情鏈接：
            <a href="#">淄博漢企人才定制中心</a>  
            <a href="#">淄博漢企人才定制中心</a>  
            <a href="#">淄博漢企人才定制中心</a>  
            <a href="#">淄博漢企人才定制中心</a>  
        </div>

       {template "content","footer"}<!--低腳加這句話-->

<script type="text/javascript">
    var oBk2;
    $(".left-item").hover(function () {
        oBk2 = $(this).css("background-color");
        $(this).css("background-color", "#E8E8E8");
    }, function () {
        $(this).css("background-color", oBk2);
    });

    var oBk3;

    $(".pic-item").hover(function () {
        oBk3 = $(this).css("background-color");
        $(this).css("background-color", "#E8E8E8");
    }, function () {
        $(this).css("background-color", oBk3);
    });

</script>
結果如下圖


點人才顯示全部，下面分1027和0904點哪個分別顯示哪個

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 (四) PHPCMSV9如何更換模板風格 PHPCMSV9上線方法及文件權限設置 phpcmsv9自定義sql語句查詢模型實現把靜態轉換為動態頁面，替換首頁功能 PHPCMSV9版本代碼審計學習 phpcmsv9多表聯合查詢分頁功能實現 phpcmsv9 authkey泄露導致SQL注入漏洞 phpcmsV9后台登陸界面去掉驗證碼 springboot 動態頁面靜態化靜態頁面和動態頁面的區別