一、什么是文章詳情組件？

文章詳情組件是一個根據(jù)規(guī)則自動調(diào)取不同文章詳情內(nèi)容的模塊。文章詳情組件通常被添加在系統(tǒng)頁面或自定義頁面的文章詳情頁面，該組件會自動根據(jù)傳入的文章id調(diào)用該文章下的文章詳細數(shù)據(jù)，比如文章名稱、文章附圖、文章摘要、文章內(nèi)容等，同后臺內(nèi)容管理中的文章系統(tǒng)的文章數(shù)據(jù)自動匹配對應(yīng)。文章詳情頁面是所有文章頁面的通用模板，頁面上的組件配置和頁面結(jié)構(gòu)是一樣的，但是文章組件的數(shù)據(jù)會動態(tài)讀取。

二、如何使用文章詳情組件？

1、如何查看文章詳情組件是否已經(jīng)存在？
如果你的頁面上已經(jīng)有這個組件了，就不需要再添加，直接根據(jù)需要進行相關(guān)操作就可以（具體操作見下文所述）；
如果你的頁面上需要這個組件，但是還沒有添加，就需要先添加文章詳情組件了；
請注意，文章詳情組件支持添加在系統(tǒng)頁面或者自定義頁面的產(chǎn)品詳情頁面，其它頁面是不支持添加的。
怎么判斷頁面上有沒有這個組件？單擊查看如何查看某一塊內(nèi)容是使用什么組件制作的？

2、如何添加文章詳情組件？
2.1 支持添加文章詳情組件的頁面有系統(tǒng)頁面或自定義頁面的文章詳情頁面，系統(tǒng)頁面的文章詳情（新聞詳情）頁面是指如下截圖上的頁面：

2.2 在頁面上添加組件的方法都是一樣的，單擊查看如何添加組件？，要添加的組件名稱為“文章詳情”，如下圖所示：

3、如何設(shè)置文章詳情組件？

3.1 進入組件的“設(shè)置”分兩種場景
1）此組件已經(jīng)添加好的場景：進入所有這類組件設(shè)置項方法都是一樣的，可以參考這個攻略：如何進入組件的設(shè)置項？
2）新添加的組件的場景：在添加此組件時會彈出這個組件的的設(shè)置話框。

3.2 在組件的設(shè)置中可以設(shè)置組件展示的內(nèi)容
支持上/下一篇：支持在文章內(nèi)容底端顯示上一篇和下一篇；
上/下一篇標題：支持展示上/下一篇的標題或不顯示標題只展示“上一篇”、“下一篇”；
上/下一篇排序方式：支持按添加日期升序或降序、按修改日期升序或降序、發(fā)布日期升序或降序（可以在某一篇文章的編輯頁面自定義發(fā)布時間）；
是否顯示作者來源發(fā)布日期：支持顯示作者來源、發(fā)布日期；
選擇日期格式：支持設(shè)置日期展示格式；

是否顯示分享工具：只是顯示分享工具，方便訪客把文章一件分享到微信、微博等第三方平臺；
是否顯示瀏覽數(shù)量：支持顯示瀏覽數(shù)量；
設(shè)置詢價按鈕：支持展示詢價按鈕，方便訪客戶點擊發(fā)送詢價信息；
點擊詢價交互類型：客戶點擊詢價以后，支持跳轉(zhuǎn)到新頁面來填寫詢價信息提交，或在新的彈出窗口填寫詢價信息提交；

3.3 在組件的設(shè)置中可以設(shè)置組件內(nèi)容的展示風(fēng)格
顯示設(shè)置：文章詳細內(nèi)容有多種展示風(fēng)格，有的帶文章附圖（在文章編輯頁面來修改文章附圖），有的不帶文章圖片。有的客戶不喜歡文章附圖默認展示在文章中就可以選擇“不顯示附圖”此風(fēng)格；

設(shè)置文章標題樣式：支持自定義文章標題樣式，可以自定義這些內(nèi)容：文字大小、行高、文字間距、對齊方式、文字風(fēng)格、文字顏色；

3.4 設(shè)置好文章列表組件的內(nèi)容及風(fēng)格、高級功能后，單擊設(shè)置框右下方“保存”按鈕，以保存所設(shè)置的內(nèi)容。

4、保存、預(yù)覽、發(fā)布
設(shè)置好以上內(nèi)容以后要單擊頁面右上角的“保存”按鈕，目的是把此修改保存到網(wǎng)站后臺；
然后可以單擊“預(yù)覽”按鈕查看不同終端下展示的效果，如果不合適可以到后臺再做修改；
如果需要讓訪客也看到，請單擊頁面右上角的“發(fā)布”按鈕，發(fā)布之后稍等兩分鐘左右即可看網(wǎng)站前臺展示效果。

根據(jù)需要還可以對這個組件做以下操作，具體請單擊以下鏈接了解。

5、單擊查看如何編輯組件的樣式？

組件的“編輯樣式”功能主要可以編輯此組件的以下內(nèi)容：組件背景、組件邊框、組件邊距、文字字號、顏色等，根據(jù)需求選擇使用；

組件的“編輯樣式”功能操作入口：所有組件的“編輯樣式”功能操作入口都是一樣的，具體操作方法請單擊查看如何編輯組件的樣式？

6、單擊查看如何應(yīng)用組件？

通過組件的“應(yīng)用組件”功能，可以將當(dāng)前頁面的組件應(yīng)用到其他頁面上，因為原理上它們是同一個組件，所以在任何被應(yīng)用到的頁面上編輯/刪除組件時，被應(yīng)用的頁面會一起變化，這個是“應(yīng)用組件”和“復(fù)制組件”最本質(zhì)的區(qū)別。此功能經(jīng)常用于面包屑導(dǎo)航、產(chǎn)品分類組件、文章分類組件等。被應(yīng)用過去的組件會出現(xiàn)在頁面的最底端，可以用鼠標左鍵按住組件名稱拖動到需要的位置；

組件的“應(yīng)用組件”功能操作入口：所有組件的“應(yīng)用組件”功能操作入口都是一樣的，具體操作方法請單擊查看如何應(yīng)用組件？

7、單擊查看如何刪除組件？

如果確定不需要這個組件了，可以通過“刪除組件”按鈕把此組件刪除掉，被刪除的組件會默認放到組件回收站中。

組件的“刪除組件”功能操作入口：所有組件的“刪除組件”功能操作入口都是一樣的，具體操作方法請單擊查看如何刪除組件？

8、單擊查看如何恢復(fù)組件？

如果需要恢復(fù)已經(jīng)刪除的組件，可以到組件回收站中，找到對應(yīng)的組件，然后執(zhí)行【還原】操作，即可恢復(fù)此組件到原有的頁面上，通常會位于頁面的最底端。

恢復(fù)組件的操作入口：所有組件的恢復(fù)功能操作入口都是一樣的，具體請單擊查看如何恢復(fù)組件？

三、關(guān)于“文章詳情組件”的版本優(yōu)化內(nèi)容

1、2017年12月第一周，文章詳情組件、產(chǎn)品詳情組件的詳情描述中的圖片新增在手機端可點擊放大查看圖片的效果。

【應(yīng)用場景】在查看文章詳情時，當(dāng)用戶在手機端進行瀏覽圖片時，會存在圖片太小不便于查看的問題，因此需要支持當(dāng)用戶在手機端瀏覽時，圖片可供放大查看的效果。

【操作方式】在文章詳情組件的設(shè)置中找到是否開啟手機端圖片放大功能，勾選“是”則開啟此效果，開啟后，在手機瀏覽時點擊圖片即可放大查看圖片，歡迎大家嘗鮮試用~

根據(jù)需要還可以對這個組件做以下操作，具體請單擊以下鏈接了解。

5、單擊查看如何編輯組件的樣式？
組件的“編輯樣式”功能主要可以編輯此組件的以下內(nèi)容：組件背景、組件邊框、組件邊距、文字字號、顏色等，根據(jù)需求選擇使用；
組件的“編輯樣式”功能操作入口：所有組件的“編輯樣式”功能操作入口都是一樣的，具體操作方法請單擊查看如何編輯組件的樣式？

6、單擊查看如何應(yīng)用組件？
通過組件的“應(yīng)用組件”功能，可以將當(dāng)前頁面的組件應(yīng)用到其他頁面上，因為原理上它們是同一個組件，所以在任何被應(yīng)用到的頁面上編輯/刪除組件時，被應(yīng)用的頁面會一起變化，這個是“應(yīng)用組件”和“復(fù)制組件”最本質(zhì)的區(qū)別。此功能經(jīng)常用于面包屑導(dǎo)航、產(chǎn)品分類組件、文章分類組件等。被應(yīng)用過去的組件會出現(xiàn)在頁面的最底端，可以用鼠標左鍵按住組件名稱拖動到需要的位置；
組件的“應(yīng)用組件”功能操作入口：所有組件的“應(yīng)用組件”功能操作入口都是一樣的，具體操作方法請單擊查看如何應(yīng)用組件？

7、單擊查看如何刪除組件？
如果確定不需要這個組件了，可以通過“刪除組件”按鈕把此組件刪除掉，被刪除的組件會默認放到組件回收站中。
組件的“刪除組件”功能操作入口：所有組件的“刪除組件”功能操作入口都是一樣的，具體操作方法請單擊查看如何刪除組件？

8、單擊查看如何恢復(fù)組件？
如果需要恢復(fù)已經(jīng)刪除的組件，可以到組件回收站中，找到對應(yīng)的組件，然后執(zhí)行【還原】操作，即可恢復(fù)此組件到原有的頁面上，通常會位于頁面的最底端。
恢復(fù)組件的操作入口：所有組件的恢復(fù)功能操作入口都是一樣的，具體請單擊查看如何恢復(fù)組件？

三、關(guān)于“文章詳情組件”的版本優(yōu)化內(nèi)容

1、2017年12月第一周，文章詳情組件、產(chǎn)品詳情組件的詳情描述中的圖片新增在手機端可點擊放大查看圖片的效果。
【應(yīng)用場景】在查看文章詳情時，當(dāng)用戶在手機端進行瀏覽圖片時，會存在圖片太小不便于查看的問題，因此需要支持當(dāng)用戶在手機端瀏覽時，圖片可供放大查看的效果。
【操作方式】在文章詳情組件的設(shè)置中找到是否開啟手機端圖片放大功能，勾選“是”則開啟此效果，開啟后，在手機瀏覽時點擊圖片即可放大查看圖片，歡迎大家嘗鮮試用~