使用 Extra 構建產品評論網站 - 第 1 部分
已發表: 2017-09-12歡迎閱讀有關如何使用 Extra 開發產品評論網站的 4 部分系列的第 1 部分。 如果您正在絞盡腦汁思考如何開始開發產品評論網站,那麼本系列適合您。 憑藉其內置的評論功能和智能帖子分類,Extra 專門用於在幾分鐘內創建漂亮的評論、產品帖子模板、大型菜單和類別佈局。 和我一起探索 Extra 的力量。
我喜歡產品評論。 事實上,這些天我很少在沒有進行徹底的聯邦調查局級調查的情況下購買任何東西,以確定世界對該產品的看法。 如果我出去購物(這種情況很少見),我就是在商店裡面對貨架 30 分鐘閱讀貨架上商品評論的人。 我敢打賭,我並不孤單。
產品評論網站很受歡迎,如果您自己動手製作產品評論網站,它們是您在舒適的家中賺取額外現金的好方法。 從商業角度來看,創建產品評論博客需要大量的工作和耐心才能成功。 但就開發您的實際網站而言,Extra 已經涵蓋了您。
Extra 帶有許多內置功能,可以更輕鬆地添加產品評論。 智能類別模塊和佈局非常強大且易於定制。 只需單擊一下,您就可以將任何菜單項轉換為帶有特色圖像的超級菜單,這對於具有大量內容的站點來說非常重要。 Visual Builder 的強大功能為您的產品後期佈局增加了高級別的設計能力。
在今天的帖子中,我將介紹基本的主題選項和主題定制器設置,以使球滾向一個漂亮的產品評論網站。
這是我們將在本系列中構建的內容的先睹為快


在開始之前,讓我們回顧一下其他一些需要考慮的重要步驟。
本系列未涵蓋的產品評論網站的重要步驟
本系列將介紹使用 Extra 構建和設計產品評論網站的基礎知識。 因此,我不會介紹為了構建成功的 Product Review 站點而需要採取的其他重要步驟。 其中一些重要的行動步驟包括:
- 找到合適的利基市場並縮小您的關注範圍。 這並不容易,需要一些重要的研究。
- 研究產品的附屬收入,看看你是否真的會賺錢。
亞馬遜是許多產品評論網站的熱門選擇,但並不總是最好的選擇。 - 使用 Bloom 和 Mailchimp 或 Aweber 等第三方服務創建簡單的電子郵件選擇序列和營銷活動。
- 創建出色的內容或花錢請其他人來做。
- 針對搜索引擎 (SEO) 優化您的網站。
- 通過社交媒體營銷您的網站
- 與您所在領域的其他博主合作,以產生更多流量。
當然還有更多的步驟。
準備設計元素
- 安裝了最新版本的 Extra。
- 一個活躍的兒童主題。 我們不會編輯任何核心主題文件,例如本系列的 header.php 或 function.php 文件。 我們將只使用主題定制器和自定義 CSS。
- 您的徽標的淺色版本,用於深色背景。 我的標誌尺寸是 103×63。
- 產品圖片。 在本教程中,我將有 4 個類別,每個類別中有 3 個產品,因此我將使用總共 12 張圖像。 我正在使用來自帶有白色背景的快門股票的股票圖像,使其看起來更乾淨。
此外,產品圖片的最大版本將為 1280 像素(網站內容寬度),因此請確保您的圖片至少為 1280 像素。 理想情況下,我會將您的所有圖像拍攝為 1280×720,以便與大多數顯示器的 16:9 縱橫比保持一致。
搞定? 讓我們開始吧。
使用 Extra 構建產品評論網站 - 第 1 部分
訂閱我們的 YouTube 頻道
設置主題選項和主題定制器設置。
從 WordPress 儀表板,轉到額外 > 主題選項 > 常規選項卡並更新以下內容:
徽標:輸入您的徽標。 確保它是您徽標的淺色版本,因為它會在您的標題中覆蓋深色背景。
網站圖標:輸入您的網站圖標
全球重點色:#222222
側邊欄位置:無側邊欄

保存設置
現在轉到Extra > Theme Customizer > General Settings > Typography Settings並更新以下內容:
標題文字大小:24
正文大小:20
標題線高度:1.3
標題字體樣式:B(粗體)
標題字體:Oswald
正文字體:Open Sans
車身鏈接顏色:#e6567a

保存並發布
返回並選擇背景設置並將背景顏色更改為 rgba(0,0,0,0.14)。


保存並發布
現在返回主題定制器的主菜單,選擇標題和導航設置 > 標題格式設置,然後選擇“居中”。

保存並發布
現在返回並選擇主菜單欄設置並更新以下內容:
菜單高度:124
標誌高度:51
文字大小:20
文字顏色:rgba(255,255,255,0.86)
背景顏色:#222222
下拉菜單背景顏色:#222222
下拉菜單動畫:垂直翻轉

保存並發布
現在返回並選擇二級菜單欄設置並更新以下內容:
文字大小:20
背景顏色:#121212
下拉菜單背景顏色:#121212
趨勢文字大小:16px
搜索、購物車和圖標文本大小:16
搜索、購物車和圖標背景顏色:#444444

接下來,返回並選擇Fixed Navigation Settings 。 然後更新以下內容:
選擇隱藏徽標圖像
菜單高度:60
文字大小:16
背景顏色:#222222

保存並發布
如果您正在使用全新安裝的 WordPress 和 Extra,那麼您的主頁應該看起來像這樣。

為您的產品設置類別
完成主題定制器設置後,您可以開始為我們將在未來添加的產品添加類別。
要設置類別,請轉到 WordPress 儀表板並導航到Posts > Categories 。 在左側的“添加新類別”部分下,添加第一個類別的信息。 對於本示例,我將添加一個名為“Electronics”的類別,其中包含名為“electronics”的 slug 和“#5bd999”的顏色。

然後單擊添加新類別按鈕。
我將針對另外三個類別重複此步驟。 以下是我的所有 4 個類別的信息:
- 名稱: 電子
彈頭:電子
顏色: #5bd999 - 名稱:服裝
彈頭:衣服
顏色: #00c0e4 - 名稱:廚房
彈幕:廚房
顏色: #e6567a - 名稱: 健康與健身
Slug:健康與健身
顏色: #7658f8
注意:顏色將在網站設計中發揮不可或缺的作用,因此請確保添加它們。
添加完類別後,您就完成了本系列的第 1 部分!
即將推出:為您的產品添加帖子和構建帖子佈局
在本系列的第 2 部分中,我們將開始添加我們的帖子內容並為我們的產品帖子構建一個新的佈局。 將產品評論帖子添加到 Extra 基本上就像添加常規帖子一樣,因此如果您熟悉創建博客帖子和使用 Divi Builder,那麼下一步應該不會有任何問題。 如果您對這一切不熟悉,請認為這是學習如何使用 Extra 進行構建的好時機。
這是我們將在系列的第 2 部分中構建的產品帖子之一的示例。

如果您有任何問題或反饋,請隨時發表評論。
乾杯!
