中國政法大學(xué):基于Drupal構(gòu)建研究院院網(wǎng)

文/張文博

中國政法大學(xué):基于Drupal構(gòu)建研究院院網(wǎng)

文/張文博

項目描述

中國政法大學(xué)證據(jù)科學(xué)研究院舊版門戶系統(tǒng)采用的是傳統(tǒng)新聞發(fā)布平臺，僅能提供基本的信息發(fā)布功能，已經(jīng)無法滿足日益增加的對外交流、學(xué)術(shù)活動、多分類資訊等等細分的內(nèi)容方面的需求。因此，需要對原有系統(tǒng)進行升級重構(gòu)。

從筆者參與過的項目來看，高校一般門戶系統(tǒng)的功能幾乎都可以通過建設(shè)者模式搭配而成，這個搭配的過程往往是相當(dāng)優(yōu)雅的，通過圖形化的配置，鼠標(biāo)點擊就可以實現(xiàn)豐富多彩的業(yè)務(wù)功能。選擇Drupal作為學(xué)院系統(tǒng)的技術(shù)平臺，僅需要很少的代碼開發(fā)量，事半功倍。

證據(jù)科學(xué)研究院新版院網(wǎng)系統(tǒng)在設(shè)計階段強調(diào)國際化，希望最終提供給訪問者的頁面系統(tǒng)可以方便地進行語言切換，使外籍教授、學(xué)生能夠方便地查閱資訊。根據(jù)學(xué)院開設(shè)的課程，目前需要系統(tǒng)提供簡體中文和英文兩種頁面語言。

師資力量的展示與宣傳也是新版院網(wǎng)的設(shè)計重點，希望通過詳細的院網(wǎng)師資頁面，統(tǒng)一并且規(guī)范的展示教師的中、英文簡歷。

在英文版面設(shè)計上要符合英語版式習(xí)慣，方便閱讀。

圖1　

開發(fā)實施

多語言架構(gòu)搭建

Drupal提供了完善的多語言體系，可以實現(xiàn)各類國際化站點的需求。院網(wǎng)項目中，不同語言（中/英）需有各自獨立的頁面風(fēng)格、菜單、欄目等等。同時，內(nèi)容頁面要能夠?qū)崿F(xiàn)對照翻譯。

根據(jù)這個總體需求，在Drupal提供的多種可選方案中，最終選擇了使用兩套獨立的主題再通過ThemeKey這個主題切換模塊來處理不同語言不通風(fēng)格欄目的需求。

圖2　界面可以漢化為中文

Drupal的境界

通過Drupal的模板系統(tǒng)建立中文主題和英文主題：

admin/appearance

在ThemeKey的配置頁面，可以建立基于語言的過濾條件：

admin/config/user-interface：為中文和英文語言指定不同的模板。

圖3　

ThemeKey，提供了大量的過濾條件可以實現(xiàn)多種場景下的主題切換。

圖4　

同時，ThemeKey可以設(shè)置多種匹配條件。

完成多語言的相關(guān)設(shè)置后，就可以開始制作中文版主題了。

中文版首頁搭建

Drupal提供了多種技術(shù)來實現(xiàn)首頁功能，總體來說可以通過Drupal的模板引擎系統(tǒng)來實現(xiàn)，也可以通過Panels這個模塊來實現(xiàn)，還可以通過Views來實現(xiàn)。

在院網(wǎng)這個項目中，采用了整合的方案，通過Drupal的模板引擎的復(fù)寫技術(shù)，為首頁建立單獨的頁面模板。

然后，通過Panels建立一個自定義的頁面，并將這個首頁設(shè)置為默認首頁：

admin/structure/pages：

config/system/site-information：

完成首頁的建立之后，通過Panels自帶的模板系統(tǒng)定制首頁的各個功能區(qū)塊位置：

圖5　

通過Views操作數(shù)據(jù)庫，將所需的數(shù)據(jù)從數(shù)據(jù)庫中提取出來，生成區(qū)塊，再填入Panels模板中的區(qū)塊位置內(nèi)。

圖6　

將所有Panels預(yù)留位置填入Views生成的數(shù)據(jù)區(qū)塊

圖7　

通過上述步驟，中文版的首頁就生成了。

中文版欄目頁面搭建

Drupal有多種欄目頁的搭建方式，適用于不同的需求場景。院網(wǎng)項目中，采用了以Taxonomy（分類）為主體的欄目頁面生成方案。這個方案適合小規(guī)模的門戶系統(tǒng)，是各類方案中較為簡單的一種。

Drupal已經(jīng)自動為每個Taxonomy自動生成了一個頁面，可以直接使用這個頁面作為欄目頁。如需進一步個性化定制，則需要使用模板技術(shù)或者配合其他模塊來實現(xiàn)。

院網(wǎng)項目中，使用了Views模塊提供的擴展功能，來接管Taxonomy生成的頁面，將頁面各項配置通過Views來可視化完成。

admin/structure/views：

admin/structure/views/view/taxonomy_term/

圖8　

在Views的Taxonomy Page 配置頁面，可以通過“CONTEXTUAL FILTERS”來控制輸入?yún)?shù)。Views將利用的輸入?yún)?shù)作為數(shù)據(jù)庫的篩選條件，當(dāng)通過地址欄輸入一個TERM的ID，Views就可以接收到這個ID信息，并將ID用于數(shù)據(jù)庫的篩選過濾。

通過Views的配置頁面可以很容易的定制需要在欄目頁面上展示的字段。

在院網(wǎng)這個項目中，默認的欄目頁面會展示兩個字段組成的列表，一個是Title（標(biāo)題），另一個是Post date（發(fā)布日期）。

中文版內(nèi)容頁面搭建

Drupal在內(nèi)容的管理上是獨特的，與一般的CMS系統(tǒng)，包括WordPress、Joomla都有很大區(qū)別。Drupal通過不同字段組成了Content Type（內(nèi)容類型），建立一篇新的文章資訊時，是以內(nèi)容類型為基礎(chǔ)的，系統(tǒng)會自動生成一個屬于內(nèi)容類型的NODE頁面來呈現(xiàn)不同的文章。

在院網(wǎng)內(nèi)容頁面的呈現(xiàn)設(shè)計上，選用了Display Suite這個模塊來控制各類內(nèi)容頁面的顯示，它可以為內(nèi)容頁面建立不同的模板。

圖9　

以教師簡歷這個模板為例，在模板文件中，設(shè)計Title、Row01～Row13等等區(qū)域，之后，在Manage Display中，就可以看到模板中建立的區(qū)域，通過鼠標(biāo)的拖拽將各個字段拉入對應(yīng)的區(qū)域，就可以完成內(nèi)容頁面的結(jié)構(gòu)設(shè)計。在建立資訊后，對應(yīng)字段的內(nèi)容就會呈現(xiàn)在模板的區(qū)域中。

圖10　

英文版總體搭建概述

英文版本的搭建過程中在前端技術(shù)的使用上與中文版不同，采用了時下比較流行的Bootstrap響應(yīng)式布局，為手機、平板電腦、大屏主機提供更好的閱讀體驗。

在Drupal中使用Bootstrap，可安裝Bootstrap響應(yīng)式主題，該主題已經(jīng)為Drupal的響應(yīng)式設(shè)計做好了銜接?？梢酝ㄟ^Drupal核心生成符合Bootstrap框架要求的前端代碼。

本文從項目整體流程角度概述了從項目分析設(shè)計到開發(fā)實施的各個環(huán)節(jié)，并選擇了一些技術(shù)點展開分析。由于篇幅有限，項目中還有很多有Drupal特色的技術(shù)內(nèi)容沒能呈現(xiàn)出來。Drupal可供學(xué)習(xí)研究的空間很大，學(xué)習(xí)難度也相對較大，比如Views這一個模塊，就有專門書籍來幫助技術(shù)人員進行各類數(shù)據(jù)庫的復(fù)雜操作、篩選。可也正是因為Drupal內(nèi)容豐富、功能強大，研究學(xué)習(xí)Drupal也是非常有樂趣的。

（作者單位為中國政法大學(xué)現(xiàn)代教育技術(shù)中心）