如何將自己所寫的HTML/CSS 貼入wordpress.org+bluehost

前言

本文針對 如何將自己所寫的HTML/CSS 貼入wordpress.org+bluehost 進行說明，並以bluehost builder 做示範。。

筆者在利用wordpress.org+bluehost的過程中有遇到一些問題，想說寫成文章幫助其他有遇到相同問題的人。

本文:

步驟1.bluehost builder 頁面建立:

進入bluehost website builder 點選menus&pages接著點擊New page(如圖1-1)建立一個新的頁面。

圖1-1 利用bluehost website builder 建立頁面

點選後會出現要你選擇想要建立的網頁性質(如圖1-2)，此處可以選擇想要製作的網頁樣式，沒有也沒關係，選擇一個最接近的即可，後續可以做修改。

圖1-2 頁面內容設定

選完後點add page，會出現一個視窗要您設定網頁的名稱(如圖1-3)，設定完成後就出現新的一個頁面接著就可以開始準備好要貼入的程式碼了。

圖1-3加入新頁面

步驟2.選擇Custom HTML/CSS:

點選sections 接著選擇Custom HTML/CSS(如圖2-1) 

圖2-1在選定頁面加入 HTML/CSS 程式碼

接著就會看到在你的頁面裡有出現一個區塊，點選中間的齒輪符號(如圖2-2)

圖2-2開始加入 HTML/CSS 程式碼

接著就會出現可以貼上HTML/CSS以及Javascript的頁面，請注意，一定要使用wordpress.org才可以不然就會像筆者與朋友一開始一樣選擇wordpress.com，但無法貼上，(可以參考我的另篇文章wordpress.org與wordpress.com之比較)

步驟3.完成(後記)

(貼上自己寫的HTML/CSS程式卻只出現部分內容，怎麼辦?)

貼入網站後，如果標籤的樣式沒有做設定，很有可能是因為系統自動將顏色設成與背景相同，導致無法看見，如圖3-1所示，紅色方框中的白色方框位置即為原本button的位置，但因button沒有設定CSS屬性，且剛好背景是黑色就把button的文字給蓋住了。這時只要試著將原本的標籤設定樣式就會出現，因此需住如果要貼上自己寫的HTML程式需注意要將標籤的樣式做設定。

圖3-1 button沒有設定CSS屬性之情形