一、觀察樣板
<div class="col-lg-3 col-md-6 text-center"> <div class="service-box"> <i class="fa fa-4x fa-diamond text-primary sr-icons"></i> <h3>Sturdy Templates</h3> <p class="text-muted">Our templates are updated regularly so they don't break.</p> </div> </div>
二、借head.php的nav_home()來用
################################# # 選單列表程式 # ################################# function icon_home() { global $mysqli, $smarty; #取得所有記錄 $sql = "select sn,title,url,target,content from `creative_nav` where `kind`='icon_home' and `enable`='1' order by `sort` "; //die($sql); $result = $mysqli->query($sql) or die(printf("Error: %s <br>" . $sql, $mysqli->sqlstate)); $rows = array(); while ($row = $result->fetch_assoc()) { #過濾撈出資料 //Array ( [sn] => 3 [ofsn] => 0 [kind] => nav_home [title] => asdfasdf [sort] => 0 [enable] => 1 [url] => asdfasdf [target] => 0 [col_sn] => 0 [content] => ) $row['sn'] = intval($row['sn']); //http://www.w3school.com.cn/php/func_string_htmlspecialchars.asp $row['title'] = htmlspecialchars($row['title'], ENT_QUOTES); // 轉換雙引號和單引號 $row['url'] = htmlspecialchars($row['url'], ENT_QUOTES); // 轉換雙引號和單引號 $row['target'] = intval($row['target']); $content = json_decode($row['content'], true); //(PHP 5 >= 5.2.0 true=>array $row['icon'] = htmlspecialchars($content['icon'], ENT_QUOTES); // 轉換雙引號和單引號 $row['summary'] = htmlspecialchars($content['summary'], ENT_QUOTES); // 轉換雙引號和單引號 $rows[] = $row; } $smarty->assign("icon_home", $rows); return; }
icon_home(); /*---- 將變數送至樣版----*/ $smarty->assign("WEB", $WEB); /*---- 程式結尾-----*/ $smarty->display('theme.html');
<section id="services"> <div class="container"> <div class="row"> <div class="col-lg-12 text-center"> <h2 class="section-heading">最新消息</h2> <hr class="primary"> </div> </div> </div> <div class="container"> <div class="row"> <{foreach from=$icon_home item=row}> <div class="col-lg-3 col-md-6 text-center"> <div class="service-box"> <i class="fa fa-4x <{$row.icon}> text-primary sr-icons"></i> <h3><{$row.title}></h3> <p class="text-muted"><{$row.summary}></p> </div> </div> <{/foreach}> </div> </div> </section>
三、顯示單筆新聞(作業)