WordPress 主題教程 #3:開始 Index.php

【轉載自我愛水煮魚

在這篇中,你將要着手開始寫 WordPress 代碼。這里建議在本地電腦上安裝 WordPress,而不是安裝到服務器上,因為本地更方便測試。

第1步:打開 XAMPP 控制面板。

在 XAMPP 文件夾(通常是:C:\xampp),雙擊 xampp-control.exe 將會彈出一個新的窗口。單擊 Apache 和 MySQL 的啟動按鈕。如下圖所示:

啟動之后你看最小化窗口了。

第2步:創建你的主題文件夾。

轉到你本地安裝的 WordPress 主題文件夾,應該在xampp/htdocs/wordpress/wp-content/themes。創建一個新的文件夾,命名為 tutorial

第3步:創建 index.phpstyle.css 文件。

打開記事本或者你選擇的文本編輯器,把 index.txt 這個文件中的所有內容都拷貝到你的記事本。保存為 index.php

打開另外一個記事本,直接保存為 style.css 到相同的文件夾下.

現在有兩個文件了: index.phpstyle.css.

index.php 解釋

點擊上面的圖片查看大圖。我會向你解釋每個紅色圓圈區域是什么意思。

Doctype - 指明你用哪種類型的代碼來編碼你的主題。這里你暫時還不用管它的詳細意思。

<html> 是網頁開始的地方。

<head> 是你的網頁頭部開始的地方。每個網頁都有一個頭部和主體。</head> 是頭部結束的地方。

<?php bloginfo(’stylesheet_url’); ?> 是一個 PHP 函數,它能取得 style.css 文件所在的路徑,這樣主題就能使用 style.css 樣式化頁面上所有元素。任何時候,PHP 代碼都是在 <?php?> 之間的。PHP 代碼和 HTML 的代碼是不一樣的,在 PHP 中,<?php 代表開始 PHP 代碼而 ?> 是結束 PHP 代碼。

所以:

  • <?php - 開始 PHP 代碼
  • bloginfo(’stylesheet_url’) - 調用 style.css 文件所在的路徑
  • ; - 停止調用函數。分號是用來結束一個 PHP 語句。
  • ?> - 結束 PHP 代碼

<body> - 這是網頁主體開始的地方。你能在網頁上看到和讀到的東西就是主體部分。你正在閱讀的這個教程說明你在正在看當前這個網頁的主體部分。</body> 是網頁主體結束的地方。

</html> 是網頁結束的地方,沒有東西在它的后面了。

第4步:創建 style.css。

style.txt 中所有的代碼拷貝到你的 style.css 文件中。保存和關閉它。

第5步:安裝你的主題。

打開瀏覽器。在地址欄輸入輸入 http://localhost/wordpress/wp-login.php。登錄到你的 WordPress 管理后台。(這里能夠看到 WordPress 登錄頁面是因為你在第1步的時候啟動了 Xampp。否者的話,在這里你的瀏覽器會報找不到的錯誤。)

在管理界面下到 外觀 (Apperance) 菜單并激活名為 Tutorial 的主題。

注意,你的主題文件沒有屏幕縮略圖,所以是空白的。一旦激活了,WordPress 就會告訴你激活信息。

現在打開一個新的瀏覽器或者標簽頁(如果你的瀏覽器支持標簽頁瀏覽)并在地址欄輸入 http://localhost/wordpress。你應該得到一個空白頁面,恩,完全空白的頁面。如果不是,那你就是在錯誤的頁面上了。

你的主題已經創建好了,這就是這個課程,下一步我們將討論主題頭部模板。

不要忘記關閉 Xampp。雙擊它在任務欄中小圖標,點擊 Apache 和 MySQL 的停止按鈕,然后點擊推出。


想在手機閱讀更多Wordpress資訊?下載【香港矽谷】Android應用
分享到Facebook
技術平台: Nasthon Systems