英雄知識庫——使用模板系統
已發表: 2016-01-11如果您花費大量時間一遍又一遍地回答相同的支持問題,那麼我們 HeroThemes 就有了答案……
注意:本文假設您知道如何安裝 WordPress、插件,並且您有一些主題開發知識,包括父/子主題、HTML、CSS 以及對 PHP 的基本了解。
英雄知識庫
我們的知識庫插件提供了一種快速且易於設置的解決方案,可以在您的網站上創建自定義知識庫。 立即為您的客戶提供那些更常見問題的答案,並讓您減少回答支持電話和電子郵件所花費的時間,這樣您就可以轉而跳過雛菊領域(或做任何您想做的事情)相反)並確保您擁有更滿意的客戶。
像大多數 WordPress 插件一樣,初始安裝再簡單不過了。 只需通過儀表板將插件上傳到您的插件目錄並激活它。 知識庫插件與大多數編碼良好的主題無縫集成,因此,無論您使用的是完全定制的主題、我們的高級 HeroThemes 產品之一還是 WordPress 的默認主題,都沒有區別。 您將在幾分鐘內輕鬆地將功能齊全的知識庫集成到您的 WordPress 網站中。
如果您對主題開發有一定的了解並希望進一步定制插件,那麼我們乾淨、開發人員友好的代碼、可插入的功能和易於遵循的模板系統允許您進行高級定制。 本文將介紹使用模板系統自定義插件時可以做的一些很酷的事情。
我將簡要概述:
- 安裝插件、常規設置和添加一些內容
- 與 WordPress 4.4 提供的新 TwentySixteen 主題的基本集成
- 高級集成:修改模板以進行進一步定制
入門
初始安裝 WordPress 後,請確保您已安裝並激活了 TwentySixteen 主題和知識庫插件。
TwentySixteen 是 WordPress 4.4 附帶的新默認主題。 如果在升級 WordPress 安裝後,您沒有在外觀 > 主題下列出新主題,您可以從 WordPress.org 上的 TwentySixteen 主題頁面下載它
知識庫插件
就像 WordPress 本身一樣,設置知識庫插件非常簡單。 激活插件後,您將自動進入“入門”屏幕,其中包含一些幫助您入門的基本技巧。 儀表板左側的菜單中還有一個新的菜單項,稱為知識庫。
知識庫的工作方式與 WordPress 使用的標準“帖子”帖子類型非常相似。 文章可以按類別組織,也可以按標籤組織。 可以隨時添加或刪除類別,就像他們可以添加帖子一樣,但是,為了幫助確保您的知識庫盡可能有用,建議您在開始創建內容之前規劃您的類別結構。
默認情況下,知識庫文章按發布日期順序顯示,與標準帖子完全相同,但是,您可以在插件設置中更改此設置。

知識庫附帶了廣泛的設置,可以自定義您的安裝,而無需深入研究模板。
您可以保持原樣,您的知識庫將完美運行,但是,如果您想更改文章的排序方式、類別的顯示方式、自定義實時搜索功能、啟用對文章的投票和評論以及廣泛的許多其他選項,您無需具備任何編碼知識即可執行此操作。
創建內容
在開始對我們的知識庫進行任何高級定制之前,您需要一些內容。 因此,您需要做的第一件事是創建一些文章。 安裝了 TwentySixteen 主題後,您的添加新屏幕


如果您以前使用過 WordPress,這應該看起來很熟悉。 帖子標題、內容、發布、帖子格式、類別和標籤框都相同。 事實上,唯一不同的領域是文章選項和投票選項
或者,您可以在開始時從入門屏幕安裝默認內容。
與 TwentySixteen 集成
將知識庫插件與 TwentySixteen 主題集成非常簡單。 如果您已按照上述步驟操作,就是這樣。 您可以將它留在那裡,您將擁有一個漂亮的功能知識庫,無需對其進行任何進一步的操作。 如果您不太了解代碼或只是想要快速簡單地設置一些東西,那就完美了。
但是……如果你想做更多呢?
對於主題開發人員來說,插件的真正好處是模板系統。
模板系統通過將要更改的模板文件從插件複製到主題文件夾中來工作。 WordPress 然後首先查看您的主題。 如果您的主題中有相關的模板文件,那麼將使用該文件。 如果沒有,插件文件夾中的後備模板將用於劫持the_content()函數並將知識庫內容插入到標準page.php中。
插件或主題內的模板層次結構與標準 WordPress 模板層次結構非常相似,讓您輕鬆搞定。
例如hkb-taxonomy-category.php將覆蓋hkb-archive.php ,就像category-$slug.php覆蓋標準archive.php一樣。

hkb-taxonomy-category.php ,否則使用hkb-archive.php 。如果您想了解更多關於 WordPress 模板層次結構的信息,您可以閱讀開發人員手抄本。
自定義模板
默認情況下,使用 TwentySixteen 主題時,知識庫部分將如下所示:

這很好,TwentySixteen 是一個風格非常漂亮的移動優先主題。 但是,由於頁面模板的佈局,與網站中的其他頁面相比,知識庫頁面有很多死空間:

您不需要知識庫頁面上的所有這些空白,因此您需要做的是修改相關模板的 HTML 以將其刪除。

不過,在開始之前,您需要為 TwentySixteen 創建一個子主題,以便在發布主題更新時不會丟失任何更改。 我已將我的文件夾命名為二十六-孩子。 有關子主題的更多信息可以在我們關於子主題的文章中找到。
設置好子主題後,您現在可以開始編輯模板了。 在二十六子文件夾中創建一個新文件夾並將其命名為hkb-templates 。 然後,將要編輯的模板從插件文件夾複製到新創建的模板文件夾中。
要更改知識庫存檔頁面,您需要編輯的模板是hkb-archive.php 。 複製完成後,在代碼編輯器中打開它。 你應該看到:
<?php /** * Theme template for archive display */ ?>
<?php get_header(); ?>
<?php hkb_get_template_part('hkb-compat', 'archive'); ?>
<?php get_footer(); ?>
注意:因為插件中的模板使用 WordPress 的the_content()函數將知識庫內容注入到頁面中,所以頁面的完整結構最初並未包含在模板中。 因為您要覆蓋默認模板,所以您需要向頁面添加額外的 HTML。
因此hkb-archive.php中的代碼應更改為如下所示:
<?php /** * Theme template for archive display */ ?>
<?php get_header(); ?>
<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">
<?php // Include the page content template. hkb_get_template_part('hkb-compat', 'archive'); ?>
</main><!-- .site-main -->
<?php get_sidebar( 'content-bottom' ); ?>
</div>
<!-- .content-area -->
<?php get_sidebar(); ?><?php get_footer(); ?>
注意:此模板中無需包含 while 循環

保存文件並查看頁面。 它現在應該看起來像這樣:
這現在使用了二十六主題中標準page.php的佈局,並從左側刪除了空白。 但是,它實際上也刪除了所有插件樣式,而是遵循主題的默認樣式。
這是因為一旦您開始自定義主題,插件就會假定您想要自由編寫自己的樣式,因此不會加載樣式表。 這在您構建完全定制的主題時非常有用,但是,如果您確實想保留現有樣式,您可以將hkb-style.css中的樣式複制並粘貼到子主題中的style.css中。 或者,如果您正在創建定制主題,您可以將樣式表從插件文件夾複製到主題文件夾,然後使用以下代碼行將其排入您的functions.php隊列:
// Knowledge Base plugin styles wp_enqueue_style( 'hkb-style', get_template_directory_uri() . '/css/hkb-style.css', array( 'twentysixteen-style' ), '20151217' );
注意:如果將此方法用於子主題,則需要使用get_stylesheet_directory_uri()而不是get_template_directory_uri() 。 這是因為get_stylesheet_directory_uri()將查看您的子主題的文件結構,而get_template_directory_uri()指向父主題文件夾。
如果您正在構建定制主題而不是使用子主題修改現有主題,那麼我個人更喜歡將樣式表分開並使用 enqueue 方法將樣式正確地註入主題中。 這是因為 style.css 通常會變得非常大並且難以快速管理,將相關樣式分開可以在您需要進一步編輯它們時輕鬆找到它們。 如果您使用像 SASS 這樣的預處理器,則可以使用相同的組織,然後您可以@import新樣式表,以便將其自動組合到style.css中,然後可以使用wp_enqueue_style()將其註入到您的主題中。
重新應用樣式後,再次查看頁面,您現在應該看到:

頁面現已重新格式化,左側的死區已被刪除,使所有內容看起來更加整潔,同時又不失主題的風格和設計。 如果您希望將此佈局更改應用到任何其他頁面模板,只需將相關模板複製到您的子主題中即可!
最後的想法
希望我已經展示了 Heroic Knowledge Base 插件的可定制性。 您可以開箱即用地做很多事情,而無需了解任何代碼,但是,如果您確實想進一步自定義內容並且您了解 WordPress 代碼標準和主題開發,您可以非常輕鬆地做到這一點。
