4.
首頁精選文章輪播
一、 模組基礎架構
- 下載XOOPS250ModuleConversionFiles,解壓縮,改目錄名稱,即為一個模組目錄。
- 編輯
xoops_version.php
,順著設定項目一項一項設定、產生對應檔案或內容。若有中文,大部分可直寫,但偏好設定若有中文一定要放在語系檔language/語系/modinfo.php
中。
- 可利用adminer建構模組所需資料表,然後匯出成
mysql.sql
放在sql
目錄下
- 模組的
admin
目錄為後台,後台僅模組管理員可以進入操作。
- 後台選單可從
admin/menu.php
來設定,其語系檔也是language/語系/modinfo.php
。
- 發布、修改等功能,若懶得限制權限,可直接放到後台。後台基本檔案架構為:
<?php
$xoopsOption['template_main'] = "後台樣板檔.tpl"; //設定樣板檔(必)
include_once "header.php"; //引入預設檔頭(必)
include_once "../function.php"; //引入共同函數檔
//內容
include_once 'footer.php';
- 前台則是所有人都可以瀏覽(當然,也可以從群組做限制),其基本檔案架構為:
<?php
include_once "header.php";(必)
$xoopsOption['template_main'] = "前台樣板檔.tpl";(必)
include_once XOOPS_ROOT_PATH . "/header.php";(必)
//內容
include_once XOOPS_ROOT_PATH . '/footer.php';(必)
二、 樣板
- 樣板一律放在
templates
下,附檔名為tpl
或html
,樣板變數為<{$樣板變數}>
,在PHP中必須用 $xoopsTpl->assign('樣板變數' , '值')
來指定樣板變數的值。
- 可在樣板中使用超級全域變數:
<{$smarty.session.xxx}>
或<{$smarty.get.xxx}>
- 亦可在樣板中使用模組語系,如:
<{$smarty.const.常數名稱}>
- 樣板有兩種,要放在
$xoopsOption['template_main']
裡面的一定要去xoops_version.php
註冊,如此,便成了可自訂樣板。另一種是無須註冊的樣板,可直接引入共用,寫法差異如下:
<{includeq db="$xoops_rootpath/modules/模組名稱/templates/有註冊的樣板檔.tpl"}>
<{includeq file="$xoops_rootpath/modules/模組名稱/templates/不用註冊的樣板檔.tpl"}>
三、 資料庫
- XOOPS現階段僅支援MySQL(或MariaDB)
- 要進行資料庫操作,可直接使用
$xoopsDB
物件,可直接用,無須實體化,常用方法如下:
$tbl = $xoopsDB->prefix('資料表名稱'); //自動加上資料表前置字串
$xoopsDB->query($sql); //執行SQL語法(較安全)
$xoopsDB->queryF($sql); //強制執行SQL語法
$sn=$xoopsDB->getInsertId(); //取得最後新增的編號
$data=$xoopsDB->fetchRow($result);
//抓回以數字為索引的資料陣列,得到的結果會像:$data[0]、$data[1]...這樣的,可搭配list($sn,$title)=$data 來將內容指派到變數中。
$data=$xoopsDB->fetchArray($result);
//抓回以欄名為索引的資料陣列,得到的結果會像:$data['sn']、$data['title']...這樣的
四、 使用者物件
- 登入就會有
$xoopsUser
物件,沒登入不會有,所以,務必用以下方式來使用之:
$uid = ($xoopsUser)?$xoopsUser->uid():0;
- 常用方法如下:
$使用者編號 = $xoopsUser->uid();
$真實姓名 = $xoopsUser->name();
$登入帳號= $xoopsUser->uname();
$Email= $xoopsUser->email();
五、 開發程序
- 新增功能→新增
$op
→switch新增一組設定→新增執行函數
- 若函數有輸出(如顯示)→新增子樣板→函數終將遇顯示資料assign到樣板
- 若函數沒有輸出(如寫入、更新、刪除)→用
header()
轉向
六、 安全性(不分前後台)
- 外來變數在進入流程前都必須過濾:
include_once $GLOBALS['xoops']->path('/modules/system/include/functions.php');
$op = system_CleanVars($_REQUEST, 'op', '', 'string');
$sn = system_CleanVars($_REQUEST, 'sn', '', 'int');
- 有用到表單務必啟用token(避免偽造表單)
$form = new XoopsThemeForm('標題', 'name', 'main.php', 'post', '使用token');
- 若是自製表單(不用物件),亦可直接使用token物件來產生相關隱藏欄位即可:
$token =new XoopsFormHiddenToken('XOOPS_TOKEN',360);
$xoopsTpl->assign('token' , $token->render());
- 儲存或更新時,要先檢查鳥單token是否正確再繼續處理儲存或更新:
//安全判斷
if(!$GLOBALS['xoopsSecurity']->check()){
$error=implode("<br>" , $GLOBALS['xoopsSecurity']->getErrors());
throw new Exception($error);
}
- 寫入時,要過濾變數(防止隱碼攻擊,並使之可以順利寫入)
$myts = MyTextSanitizer::getInstance();
$過濾後的文字=$myts->addSlashes($過濾前文字);
- 讀出時也要過濾(避免跨域攻擊)
$myts = MyTextSanitizer::getInstance();
$snews['content'] = $myts->displayTarea($snews['content'], 1, 0, 0, 0, 0);
$snews['title'] = $myts->htmlSpecialChars($snews['title']);
七、 加入分頁
- 在
$sql
及$xoopsDB->query($sql)
之間插入(注意第一個變數名稱需一致):
//getPageBar($原sql語法, 每頁顯示幾筆資料, 最多顯示幾個頁數選項);
$PageBar = getPageBar($sql, 3, 10);
$bar = $PageBar['bar'];
$sql = $PageBar['sql'];
$total = $PageBar['total'];
- 接著就可把分頁工具及總數送到樣板使用:
$xoopsTpl->assign('bar', $bar);
$xoopsTpl->assign('total', $total);
八、 隨視窗大小自動調整大小的滑動圖
- http://v3.bootcss.com/javascript/#carousel
- 基本語法(拿掉了快速切換工具,並替圖片加了一個
class="slide-img"
):
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="圖片路徑.jpg" alt="標題" class="slide-img">
<div class="carousel-caption">
<h3>這是第一張圖的標題</h3>
<p>這是第一張圖的摘要</p>
</div>
</div>
</div>
<!-- Controls -->
左右控制語法...略
</div>
- 讓圖片可以自動滿版,並當作底圖來用,故加上CSS設定:
.slide-img {width: 100%; object-fit: cover;}
- 讓圖片可以隨視窗調整自動調整高度(視窗高度扣掉工具列高度,即為圖片高度)
<script type="text/javascript">
$(document).ready(function () {
$(".slide-img").css('height', $(window).height()-$('.navbar').height());
});
$(window).resize(function () {
$(".slide-img").css('height', $(window).height()-$('.navbar').height());
});
</script>
- 最後,替標題加入半透明黑底以突顯文字,並讓滑動圖與工具列之間不要有空白
.carousel-caption{ background-color: rgba(0,0,0,0.5); }
#carousel-example-generic{ position:relative; top: -22px;}
九、 讀取精選文章並套用套樣板
- 首頁的滑動圖源自於精選文章,所以,執行
snews_list()
時,同時也要撈取精選文章。
- 另做一個
snews_focus()
用來取得精選文章,和snews_list()
大同小異故複製之來做即可。
- 利用
strip_tags()
用來去除網頁標籤
- 並利用XOOPS內建的
xoops_substr($字串, $起點, $字數, $顯示符)
來裁切字串,其中中文字數要x4才行,例如想顯示10個中文字,必須填40。
- 或改用
mb_substr($字串, $起點, $字數, $編碼)
亦可。
- 修改樣板,把滑動圖部份改用迴圈。
<{foreach from=$focus key=i item=f}>
<div class="item <{if $i==0}>active<{/if}>">
<img src="<{$f.cover}>" alt="<{$f.title}>" class="slide-img">
<div class="carousel-caption">
<h3><{$f.title}></h3>
<p><{$f.content}></p>
</div>
</div>
<{/foreach}>
十、 調校佈景
- 版面類型可改為「單欄式」,並取消背景圖、滑動圖、logo圖
- 導覽工具列顏色可設為
#343A40
,文字設為白色,並上傳導列 logo圖
- 「額外佈景設定」中「是否使用有限寬度」及陰影設定都選「否」,頁尾底色
#343A40