WordPress 的header 與及 footer 介紹

  web     wordpress   : 2021-11-22    : 森心    : 1,766

前一篇的技術文章我們介紹過了 WordPress template 和 content template 的功能,如果你還沒看過可以用以下連結來看看喔!

今天我們就接著談WordPress 的一些功能頁面,不過今天的會比較簡單些,它們就是header.php 跟 footer.php的介紹。

WordPress  header and footer


WordPress 的header.php 和 footer.php 是在建站中必須用到的部份。我們可以簡單的把WordPress的一個網頁分開成三個部分,它們分別是置頂的header.php 和置底的footer.php,而中間的就是用來顯示我們的網頁內容(Page) 跟文章內容(Post)的部分。

首先我們先來看看一個header.php的代碼:

<?php
/** 
* The header for our theme 
* 
**/?>

<!DOCTYPE html>
<html <?php language_attributes(); ?> class="no-js no-svg">
<head>
    <title>
       <?php echo get_bloginfo( 'name' ); echo get_bloginfo( 'description' ); ?>
    </title>    
    <meta name="viewport" content="width=device-width, initial-scale=1" />
     <link rel="stylesheet">
</head>
<?php wp_head();?>
<body>
  <div class="nav_menubar">
                <?php 
                   wp_nav_menu( array( 
                              'theme_location' => 'menu01', 
                              'container_class' => 'nav-menu', 
                              'menu_class' => 'nav-menu' ) ); 
                 ?>
 </div>
  ........

還有一段footer.php 的代碼:

<?php wp_footer(); ?>
<div id="footer" class="Footer">
     <p class="itle">
             <?php echo get_bloginfo( 'name' ); echo get_bloginfo( 'description' );?>
     </p>
     <p class="stext"><?php echo privacy_policy.php ?></p>
     <p class="stext"><?php echo copy_right.php</p></div>
</div>
</body>
</html>

我們可以看到兩段代碼中一些互相關連的部分比如<html>和<body> tags,header 跟footer 貫通整個網站所有網頁,它們是每個頁面的組成部分,用來承載一些重複顯示的內容,比如網頁的名字,Logo,選單等等,把內容放在head跟footer上,我們就可以做到輕鬆地在每個網頁都可以顯示,而我們如果需要更改它們時就只要更改一次就全站都自動更新好。

需要特別注意的地方:
如果我們是在WordPress 使自訂個人主題時,就要留意在header.php 跟footer.php 裡面有沒有<?php wp_head();?>和<?php wp_footer(); ?> 這兩句代碼,一些WordPress 的功能比如 Top menu bar 和一些外掛(Plugin) 都需要有它們才可以順利執行。

※ 如果您喜歡我們的文章,能否請您幫忙點一下廣告,讓我們網站可以有點微薄的收入,得以維持網站的經營,感謝您的幫忙。
訂閱
通知
guest
0 Comments
在線回覆
查看所有的評論

跟隨我們: