如何使用文章詳情組件?
瀏覽數(shù)量: 7 作者: 本站編輯 發(fā)布時(shí)間: 2018-06-27 來(lái)源: 本站
一、什么是文章詳情組件?
文章詳情組件是一個(gè)根據(jù)規(guī)則自動(dòng)調(diào)取不同文章詳情內(nèi)容的模塊。文章詳情組件通常被添加在系統(tǒng)頁(yè)面或自定義頁(yè)面的文章詳情頁(yè)面,該組件會(huì)自動(dòng)根據(jù)傳入的文章id調(diào)用該文章下的文章詳細(xì)數(shù)據(jù),比如文章名稱(chēng)、文章附圖、文章摘要、文章內(nèi)容等,同后臺(tái)內(nèi)容管理中的文章系統(tǒng)的文章數(shù)據(jù)自動(dòng)匹配對(duì)應(yīng)。文章詳情頁(yè)面是所有文章頁(yè)面的通用模板,頁(yè)面上的組件配置和頁(yè)面結(jié)構(gòu)是一樣的,但是文章組件的數(shù)據(jù)會(huì)動(dòng)態(tài)讀取。
二、如何使用文章詳情組件?
1、如何查看文章詳情組件是否已經(jīng)存在?
如果你的頁(yè)面上已經(jīng)有這個(gè)組件了,就不需要再添加,直接根據(jù)需要進(jìn)行相關(guān)操作就可以(具體操作見(jiàn)下文所述);
如果你的頁(yè)面上需要這個(gè)組件,但是還沒(méi)有添加,就需要先添加文章詳情組件了;
請(qǐng)注意,文章詳情組件支持添加在系統(tǒng)頁(yè)面或者自定義頁(yè)面的產(chǎn)品詳情頁(yè)面,其它頁(yè)面是不支持添加的。
怎么判斷頁(yè)面上有沒(méi)有這個(gè)組件?單擊查看如何查看某一塊內(nèi)容是使用什么組件制作的?
2、如何添加文章詳情組件?
2.1 支持添加文章詳情組件的頁(yè)面有系統(tǒng)頁(yè)面或自定義頁(yè)面的文章詳情頁(yè)面,系統(tǒng)頁(yè)面的文章詳情(新聞詳情)頁(yè)面是指如下截圖上的頁(yè)面:

2.2 在頁(yè)面上添加組件的方法都是一樣的,單擊查看如何添加組件?,要添加的組件名稱(chēng)為“文章詳情”,如下圖所示:

3、如何設(shè)置文章詳情組件?
3.1 進(jìn)入組件的“設(shè)置”分兩種場(chǎng)景
1)此組件已經(jīng)添加好的場(chǎng)景:進(jìn)入所有這類(lèi)組件設(shè)置項(xiàng)方法都是一樣的,可以參考這個(gè)攻略:如何進(jìn)入組件的設(shè)置項(xiàng)?
2)新添加的組件的場(chǎng)景:在添加此組件時(shí)會(huì)彈出這個(gè)組件的的設(shè)置話框。
3.2 在組件的設(shè)置中可以設(shè)置組件展示的內(nèi)容
支持上/下一篇:支持在文章內(nèi)容底端顯示上一篇和下一篇;
上/下一篇標(biāo)題:支持展示上/下一篇的標(biāo)題或不顯示標(biāo)題只展示“上一篇”、“下一篇”;
上/下一篇排序方式:支持按添加日期升序或降序、按修改日期升序或降序、發(fā)布日期升序或降序(可以在某一篇文章的編輯頁(yè)面自定義發(fā)布時(shí)間);
是否顯示作者來(lái)源發(fā)布日期:支持顯示作者來(lái)源、發(fā)布日期;
選擇日期格式:支持設(shè)置日期展示格式;

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

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

設(shè)置文章標(biāo)題樣式:支持自定義文章標(biāo)題樣式,可以自定義這些內(nèi)容:文字大小、行高、文字間距、對(duì)齊方式、文字風(fēng)格、文字顏色;

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

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

根據(jù)需要還可以對(duì)這個(gè)組件做以下操作,具體請(qǐng)單擊以下鏈接了解。
5、單擊查看如何編輯組件的樣式?
組件的“編輯樣式”功能主要可以編輯此組件的以下內(nèi)容:組件背景、組件邊框、組件邊距、文字字號(hào)、顏色等,根據(jù)需求選擇使用;
組件的“編輯樣式”功能操作入口:所有組件的“編輯樣式”功能操作入口都是一樣的,具體操作方法請(qǐng)單擊查看如何編輯組件的樣式?
6、單擊查看如何應(yīng)用組件?
通過(guò)組件的“應(yīng)用組件”功能,可以將當(dāng)前頁(yè)面的組件應(yīng)用到其他頁(yè)面上,因?yàn)樵砩纤鼈兪峭粋€(gè)組件,所以在任何被應(yīng)用到的頁(yè)面上編輯/刪除組件時(shí),被應(yīng)用的頁(yè)面會(huì)一起變化,這個(gè)是“應(yīng)用組件”和“復(fù)制組件”最本質(zhì)的區(qū)別。此功能經(jīng)常用于面包屑導(dǎo)航、產(chǎn)品分類(lèi)組件、文章分類(lèi)組件等。被應(yīng)用過(guò)去的組件會(huì)出現(xiàn)在頁(yè)面的最底端,可以用鼠標(biāo)左鍵按住組件名稱(chēng)拖動(dòng)到需要的位置;
組件的“應(yīng)用組件”功能操作入口:所有組件的“應(yīng)用組件”功能操作入口都是一樣的,具體操作方法請(qǐng)單擊查看如何應(yīng)用組件?
7、單擊查看如何刪除組件?
如果確定不需要這個(gè)組件了,可以通過(guò)“刪除組件”按鈕把此組件刪除掉,被刪除的組件會(huì)默認(rèn)放到組件回收站中。
組件的“刪除組件”功能操作入口:所有組件的“刪除組件”功能操作入口都是一樣的,具體操作方法請(qǐng)單擊查看如何刪除組件?
8、單擊查看如何恢復(fù)組件?
如果需要恢復(fù)已經(jīng)刪除的組件,可以到組件回收站中,找到對(duì)應(yīng)的組件,然后執(zhí)行【還原】操作,即可恢復(fù)此組件到原有的頁(yè)面上,通常會(huì)位于頁(yè)面的最底端。
恢復(fù)組件的操作入口:所有組件的恢復(fù)功能操作入口都是一樣的,具體請(qǐng)單擊查看如何恢復(fù)組件?
三、關(guān)于“文章詳情組件”的版本優(yōu)化內(nèi)容
1、2017年12月第一周,文章詳情組件、產(chǎn)品詳情組件的詳情描述中的圖片新增在手機(jī)端可點(diǎn)擊放大查看圖片的效果。
【應(yīng)用場(chǎng)景】在查看文章詳情時(shí),當(dāng)用戶在手機(jī)端進(jìn)行瀏覽圖片時(shí),會(huì)存在圖片太小不便于查看的問(wèn)題,因此需要支持當(dāng)用戶在手機(jī)端瀏覽時(shí),圖片可供放大查看的效果。
【操作方式】在文章詳情組件的設(shè)置中找到是否開(kāi)啟手機(jī)端圖片放大功能,勾選“是”則開(kāi)啟此效果,開(kāi)啟后,在手機(jī)瀏覽時(shí)點(diǎn)擊圖片即可放大查看圖片,歡迎大家嘗鮮試用~
![6)X@5Y]RVAK{J2FW%F5SKNF.png 6)X@5Y]RVAK{J2FW%F5SKNF.png](data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC)
根據(jù)需要還可以對(duì)這個(gè)組件做以下操作,具體請(qǐng)單擊以下鏈接了解。
5、單擊查看如何編輯組件的樣式?
組件的“編輯樣式”功能主要可以編輯此組件的以下內(nèi)容:組件背景、組件邊框、組件邊距、文字字號(hào)、顏色等,根據(jù)需求選擇使用;
組件的“編輯樣式”功能操作入口:所有組件的“編輯樣式”功能操作入口都是一樣的,具體操作方法請(qǐng)單擊查看如何編輯組件的樣式?
6、單擊查看如何應(yīng)用組件?
通過(guò)組件的“應(yīng)用組件”功能,可以將當(dāng)前頁(yè)面的組件應(yīng)用到其他頁(yè)面上,因?yàn)樵砩纤鼈兪峭粋€(gè)組件,所以在任何被應(yīng)用到的頁(yè)面上編輯/刪除組件時(shí),被應(yīng)用的頁(yè)面會(huì)一起變化,這個(gè)是“應(yīng)用組件”和“復(fù)制組件”最本質(zhì)的區(qū)別。此功能經(jīng)常用于面包屑導(dǎo)航、產(chǎn)品分類(lèi)組件、文章分類(lèi)組件等。被應(yīng)用過(guò)去的組件會(huì)出現(xiàn)在頁(yè)面的最底端,可以用鼠標(biāo)左鍵按住組件名稱(chēng)拖動(dòng)到需要的位置;
組件的“應(yīng)用組件”功能操作入口:所有組件的“應(yīng)用組件”功能操作入口都是一樣的,具體操作方法請(qǐng)單擊查看如何應(yīng)用組件?
7、單擊查看如何刪除組件?
如果確定不需要這個(gè)組件了,可以通過(guò)“刪除組件”按鈕把此組件刪除掉,被刪除的組件會(huì)默認(rèn)放到組件回收站中。
組件的“刪除組件”功能操作入口:所有組件的“刪除組件”功能操作入口都是一樣的,具體操作方法請(qǐng)單擊查看如何刪除組件?
8、單擊查看如何恢復(fù)組件?
如果需要恢復(fù)已經(jīng)刪除的組件,可以到組件回收站中,找到對(duì)應(yīng)的組件,然后執(zhí)行【還原】操作,即可恢復(fù)此組件到原有的頁(yè)面上,通常會(huì)位于頁(yè)面的最底端。
恢復(fù)組件的操作入口:所有組件的恢復(fù)功能操作入口都是一樣的,具體請(qǐng)單擊查看如何恢復(fù)組件?
三、關(guān)于“文章詳情組件”的版本優(yōu)化內(nèi)容
1、2017年12月第一周,文章詳情組件、產(chǎn)品詳情組件的詳情描述中的圖片新增在手機(jī)端可點(diǎn)擊放大查看圖片的效果。
【應(yīng)用場(chǎng)景】在查看文章詳情時(shí),當(dāng)用戶在手機(jī)端進(jìn)行瀏覽圖片時(shí),會(huì)存在圖片太小不便于查看的問(wèn)題,因此需要支持當(dāng)用戶在手機(jī)端瀏覽時(shí),圖片可供放大查看的效果。
【操作方式】在文章詳情組件的設(shè)置中找到是否開(kāi)啟手機(jī)端圖片放大功能,勾選“是”則開(kāi)啟此效果,開(kāi)啟后,在手機(jī)瀏覽時(shí)點(diǎn)擊圖片即可放大查看圖片,歡迎大家嘗鮮試用~