[andy]

網站幫助與友情連結這兩個區塊可以放在網頁的任何位置，或任何頁面上，只要將css調整好即可，所以我將檔案分成 help.lbi 和 links.lbi 方便調用，其實還有一個底部導航，我希望它全站顯示因此直接寫到 page_footer.lbi 了，：

代碼: [選擇]

    <!-- #BeginLibraryItem "/library/help.lbi" --><!-- #EndLibraryItem -->
    <!-- #BeginLibraryItem "/library/links.lbi" --><!-- #EndLibraryItem -->
  <!-- {if $navigator_list.bottom} -->
  <!-- 底部導航 -->
  <div class="row">
    <div class="col-md-12 text-center">
      <!-- {foreach name=nav_bottom_list from=$navigator_list.bottom item=nav} -->
        <a href="{$nav.url}"{if $nav.opennew eq 1} target="_blank"{/if}>{$nav.name}</a>
        <!-- {if !$smarty.foreach.nav_bottom_list.last} --> - <!-- {/if} -->
      <!-- {/foreach} -->
    </div>
  </div>
  <!-- {/if} -->


網站幫助與友情連結依項目多寡決定佔12格或6格，避免頁面過多空白區域：

代碼: [選擇]

<!--{if $helps}-->
<div class="block">
  <div class="col-md-12">
    <div class="title"><i class="fa fa-question-circle"></i>  網站幫助<span class="tip"><em>HELP</em></span></div>
    <table class="table table-hover table-bordered">
      <tr>
        <!-- {foreach from=$helps item=help_cat} -->
        <th class="help-name"><i class="fa fa-question"></i>  {$help_cat.cat_name}</th>
        <!-- {/foreach} -->
      </tr>
      <tr>
        <!-- {foreach from=$helps item=help_cat} -->
        <td valign="top">
          <!-- {foreach from=$help_cat.article item=item} -->
          <div class="help-link">  <i class="fa fa-angle-double-right"></i>  <a href="{$item.url}" title="{$item.title|escape:html}" class="">{$item.short_title}</a></div>
          <!-- {/foreach} -->
        </td>
        <!-- {/foreach} -->
      </tr>
    </table>
  </div>
</div>
<!--{/if}-->
<!-- {if $img_links  or $txt_links } -->
<div class="block">
  <div class="col-md-12">
    <div class="title"><i class="fa fa-link"></i>  友情連結<span class="tip"><em>LINKS</em></span></div>
    <div class="col-md-12 links">
      <div class="">
        <!-- {if $txt_links} -->
        <!-- {foreach from=$txt_links item=link} -->
        <a class="btn btn-info" href="{$link.url}" target="_blank" title="{$link.name}">{$link.name}</a>
        <!-- {/foreach} -->
        <!-- {/if} -->
       
        <!-- {if $img_links} -->
        <!-- {foreach from=$img_links item=link} -->
        <a href="{$link.url}" target="_blank" title="{$link.name}"><img src="{$link.logo}" alt="{$link.name}" /></a>
        <!-- {/foreach} -->
        <!-- {/if} -->
      </div>
    </div>
  </div>
</div>
<!-- {/if} -->


截至目為止已經完成頁首、頁尾和首頁的模板，你應該會發現自己設定的樣式並不多，除了區塊共用樣式之外，很多樣式在 BootStrap 都已經幫你寫好了，不用死記只要記住網址，像我一樣用到的時候再來查就好了， BootStrap