# 懶人包:WordPress應用證照 website25 @2019/09/25 ###### tags: `WordPress` `證照` :::warning * 相關安裝外掛懶人包 * [DropBox下載](https://www.dropbox.com/sh/j3wty7eluzwxyn9/AAB_fS-ElJf1iSWmFi_8r-vUa?dl=0) ::: ## 第一組:後台搭建 ### 安裝XAMPP * 目標: 安裝於C:\ * 安裝懶人包裡面:xampp-win32-5.6.33-0-VC11-installer ### 新增使用者Admin 管理員 * 目標:新增一MySQL帳號admin並授予管理員權限以取代原root帳號 ![](https://i.imgur.com/MKVvKiJ.png) ### 修改資料庫管理後臺登入方式 * 目標:將phpMyAdmin登入方式改為帳號登入。 * 找到..\xampp\phpMyAdmin 資料夾開啟 config.inc.php * 或在控制面板進入 ![](https://i.imgur.com/WWGhUB2.png) * 找到下面程式碼,將config改成cookie * localhost登入時需要帳號密碼 ``` /* Authentication type and info */ $cfg['Servers'][$i]['auth_type'] = 'cookie'; ``` * 登出之後會看到此畫面,就成功了 ![](https://i.imgur.com/TPx2Tfr.png) ### 網頁軟體基本安裝與設定 * 目標 * 安裝網頁軟體:路徑:C:\xampp\htdocs\websiteXX(學號) * 資料庫權限設定:帳號:websiteXX、密碼:123456、資料庫名稱:websiteXX。 * 網頁軟體初始管理員:帳號:websiteXX、密碼:123456。 1. 將懶人包裡面wordpress-5.2.2-zh_TW.zip,放到指定路徑資料夾中 * **重點**解壓縮後,將wordpress裡所有檔案複製到根目錄下C:\xampp\htdocs\websiteXX(學號) ![](https://i.imgur.com/Y1ijR4l.png) 2. 用Admin登入localhost/phpmyadmin/,新增資料庫:websiteXX(學號), ![](https://i.imgur.com/Y6U75FC.png) 3. 新增帳號與給予同名資料庫權限 * 按下圖新增後 按執行 ![](https://i.imgur.com/WgiGSg2.png) * 賦予同名資料庫權限 ![](https://i.imgur.com/u09thWW.png) * 執行 ![](https://i.imgur.com/0EjjCp5.jpg) > [name=Chao Kuei Chen]感謝阿奎 4. 然後開新視窗,localhost/websiteXX(學號),開始安裝wordpress ![](https://i.imgur.com/yA0nWQy.png) 5. 安裝wordpress過程中,帳號也是websiteXX(學號) ![](https://i.imgur.com/vZfWj9w.png) * 執行安裝 ![](https://i.imgur.com/Yw33voy.png) * wordpress 帳密設定 ![](https://i.imgur.com/9988nqR.png) * 登入 ![](https://i.imgur.com/Xp8C98e.png) * 登入測試 ![](https://i.imgur.com/E93fi3k.png) * 登入後台畫面 ![](https://i.imgur.com/hLl6oMZ.png) ## 第二組:網頁內容製作 ### 網頁軟體頁面製作 * 外觀安裝佈景主題:Dara(https://tw.wordpress.org/themes/dara/) * 搜尋Dara下載 * 或懶人包裏有dara.1.2.1.zip,用上傳佈景主題 ![](https://i.imgur.com/sYOpnIy.png) * 頁面製作: * 製作選單:自訂 > 選單 > 新增選單:公司簡介(單頁)、服務項目(單頁)、產品介紹(單頁)、作品展示(文章頁面) * 自訂 ![](https://i.imgur.com/QsXWZT0.png) * 選單 ![](https://i.imgur.com/Qocjw2f.png) * 製作選單 ![](https://i.imgur.com/IrkDupY.png) * 新增選單 ![](https://i.imgur.com/JEk22B9.png) * 新增選單 ![](https://i.imgur.com/kiaqkpo.png) * 新增選單 ![](https://i.imgur.com/ck94aYX.png) * 刪除側編資訊欄 * 小工具 > 資訊欄 > 刪除各個資訊項目 * 小工具 ![](https://i.imgur.com/U7sFz1E.png) * 資訊欄 ![](https://i.imgur.com/0CXWA0S.png) * 刪除各個資訊項目 ![](https://i.imgur.com/A6XmMeH.png) * 將"作品展示"設定成文章部落格版面: * 頁面設定 > 靜態頁面 > 文章頁面 (選-->) 作品展示 * 頁面設定 ![](https://i.imgur.com/nyH8v9C.png) * 網站首頁顯示內容(選-->)靜態頁面 * 靜態首頁 (選-->)公司簡介 * 文章頁面 (選-->) 作品展示 ![](https://i.imgur.com/qfZMe1M.png) * 作品展示:新增呈現5項作品文章 * 頁面 > 新增文章 > 製作圖文內容 > 發布 > 再新增其餘文章 * 頁面 > 新增文章 ![](https://i.imgur.com/gMytuFl.png) * 製作圖文內容 > 發佈 ![](https://i.imgur.com/G6Pd5Ey.png) * 新增文章取消"留言"&"引言" ![](https://i.imgur.com/Wu6qAOZ.png) * 再新增其餘文章 ![](https://i.imgur.com/EXWFsG3.png) * 製作圖文內容 > 發佈 ![](https://i.imgur.com/K5a6xCe.png) ![](https://i.imgur.com/pGkyRMp.png) * 編輯文章 ![](https://i.imgur.com/A4YzbCN.png) ### 開sublime可以快速造中文字 * 中文假字系統,輸入ctlorem再按ALT+C就可產生 * ctlorem500(造500字) ctlorem100(造100字) ![](https://i.imgur.com/iz0bhXO.png) ### --- 檢查是否符合下面四項需求 ### 公司簡介 * 目標: * 公司簡介:單頁內容,內容含log與300字以上介紹 * 網站首頁直接使用公司簡介 ### 服務項目 * 目標: 單頁內容,五項服務項目及說明 ### 產品介紹 * 目標: 單頁內容,五項圖文產品介紹 ### 作品展示 * 目標: 五項作品,文章部落格呈現版面,點選單篇標題後會進入詳細內容。 ## 第三組:檢查後台與佈景主題 ### 確認網站基本安裝與設定 * 目標: * 路徑:C:\xampp\htdocs\websiteXX * 資料庫權限:帳號:websiteXX、密碼:123456、資料庫名稱:websiteXX * 網站初始管理員:帳號:websiteXX、密碼:123456 ### 佈景主題設定 * 目標:下載任一佈景主題並套用 * 推薦主題:Dara ## 第四組: ### 網站備份 * 目標: 運用Akeeba Backup插件將網站備份 ### 網站還原 * 目標: * 利用網站備份資料還原至主機 * 路徑:C:\xampp\htdocs\website1XX * 資料庫權限:帳號:websiteXX、密碼:123456、資料庫名稱:websiteXX * 網站初始管理員:帳號:websiteXX、密碼:123456 ## 用Akeeba Backup外掛備份與還原 * 備份 1. 安裝akeebabackupwp外掛 2. 不用使用精靈,點One-Click Backup ![](https://i.imgur.com/xvudS5q.png) ### 還原步驟 1. 將.jpa備份檔,移到要還原的資料夾website1XX(學號),**重點學號前多個數字1** * .jpa備份檔路徑: C:\xampp\htdocs\html\website07\wp-content\plugins\akeebabackupwp\app\backups 2. 在PHPAdmin中建立資料庫與使用者websiteXX(學號) 3. 將kickstart-core-6.0.1裡面的兩個檔案,移到到要還原的資料夾website1XX(學號) * 資料夾website1XX(學號)中,必需有三個檔案 ![](https://i.imgur.com/qRTS6D7.png) 4. 輸入網址,點選kickstart.php * localhost/website1XX(學號) ![](https://i.imgur.com/8GWmLPh.png) * 開始一步步還原 * 執行到第六步驟中途會另開視窗,請保留此視窗 ![](https://i.imgur.com/57VKdSH.png) * 點選Next ![](https://i.imgur.com/UQ45RXg.png) * 更改新的資料庫資料後,點選Next ![](https://i.imgur.com/T3ID6Wz.png) * 最後確認路徑 ![](https://i.imgur.com/jVyHrFb.png) * 看到這個畫面就還原成功了喔! ![](https://i.imgur.com/JeTR9Nk.png) * 最後回原本分頁點Clean UP * 不小心關掉也沒關係,依據網址連結過去就可以 * localhost/website1XX(學號) ![](https://i.imgur.com/dPBhLjv.png)