一、什么是文章頁簽組件？

文章頁簽組件是一個以頁簽切換形式展示不同分類下文章的模塊，文章頁簽組件一般應(yīng)用在網(wǎng)站首頁上，針對有多個文章分類的情況，建議選擇3~5個重點推廣或更新的文章分類，每個分類下顯示幾條新聞，定期更新文章內(nèi)容達(dá)到網(wǎng)站首頁的活躍度。

二、如何使用文章頁簽組件？

1、如何查看文章頁簽組件是否已經(jīng)存在？

如果你的頁面上已經(jīng)有這個組件了，就不需要再添加，直接根據(jù)需要進(jìn)行相關(guān)操作就可以（具體操作見下文所述）；

如果你的頁面上需要這個組件，但是還沒有添加，就需要先添加滾動新聞組件了；怎么判斷頁面上有沒有這個組件？單擊查看如何查看某一塊內(nèi)容是使用什么組件制作的？

2、如何添加文章頁簽組件？

在頁面上添加組件的方法都是一樣的，單擊查看如何添加組件？

添加的組件名稱為“文章頁簽”，如下圖所示：

3、如何設(shè)置文章頁簽組件？

3.1 進(jìn)入組件的“設(shè)置”分兩種場景

1）此組件已經(jīng)添加好的場景：進(jìn)入所有這類組件設(shè)置項方法都是一樣的，可以參考這個攻略：如何進(jìn)入組件的設(shè)置項？

2）新添加的組件的場景：在添加此組件時會彈出這個組件的的設(shè)置話框。

3.2 在組件的設(shè)置中可以設(shè)置組件展示的內(nèi)容

組件標(biāo)題：即文章列表組件的標(biāo)題，若輸入，就會顯示，顯示位置如下圖所示，若不輸入，組件標(biāo)題欄就不會出現(xiàn)；

請選擇顯示分類下的文章：在這里可以選擇顯示哪些分類下的文章，可以選擇所有的，也可以選擇一部分；

每個頁簽顯示的文章數(shù)量：在這里可以設(shè)置每個頁簽顯示的文章數(shù)量；

顯示更多：若顯示“更多“，單擊“更多”將連接到對應(yīng)文章分類；

3.3 在組件的設(shè)置中可以設(shè)置組件展示的風(fēng)格

文章頁簽組件支持不同的頁簽風(fēng)格、也支持豐富多樣的文章列表風(fēng)格、支持在文章標(biāo)題前添加圖標(biāo)。

3.3.1 選擇頁簽風(fēng)格

選擇第1種頁簽風(fēng)格（如下圖所示）：

然后，單擊“展開設(shè)置”，支持設(shè)置以下內(nèi)容：

頁簽按鈕位置：居左、居中，居右，指的是對于組件來講的；

頁簽按鈕高度：拖動小按鈕可以調(diào)整頁簽按鈕的高度；

頁簽按鈕寬度：支持設(shè)置按鈕為固定寬度，也支持固定按鈕左右邊距；

頁簽字體大小：支持設(shè)置頁簽字體大小，以此設(shè)置為準(zhǔn)；

頁簽按鈕默認(rèn)樣式：支持設(shè)置默認(rèn)的按鈕背景顏色、文字顏色；

頁簽按鈕選中樣式：支持設(shè)置選擇按鈕時的按鈕背景顏色、文字顏色；

選擇第2種頁簽風(fēng)格（如下圖所示）：

然后，單擊“展開設(shè)置”，支持設(shè)置以下內(nèi)容：

頁簽按鈕位置：居左、居中，居右，指的是對于組件來講的；

頁簽按鈕高度：拖動小按鈕可以調(diào)整頁簽按鈕的高度；

頁簽按鈕寬度：支持設(shè)置按鈕為固定寬度，也支持固定按鈕左右邊距；

頁簽字體大小：支持設(shè)置頁簽字體大小，以此設(shè)置為準(zhǔn)；

頁簽按鈕下方線條顏色：支持設(shè)置頁簽按鈕下方線條顏色；

頁簽按鈕默認(rèn)樣式--文字顏色：支持設(shè)置默認(rèn)的文字顏色；

頁簽按鈕選中樣式：支持設(shè)置選中按鈕時的文字顏色、下邊線色；

3.3.2 選擇文章列表風(fēng)格

如下圖所示：

風(fēng)格1：組件調(diào)取文章標(biāo)題、發(fā)布日期，以文章列表形式展示；

風(fēng)格2：組件調(diào)取文章標(biāo)題、文章摘要，以文章列表形式展示；

風(fēng)格3：組件自動調(diào)取文章附圖、文章標(biāo)題、文章摘要、發(fā)布日期，以文章列表形式展示，支持設(shè)置文章附圖的寬度與高度；

風(fēng)格4：組件自動調(diào)取文章附圖、文章標(biāo)題、發(fā)布日期、文章摘要，以圖文的形式展示出來，PC端一行展示3個，不支持再增加，這個數(shù)量設(shè)置最美觀。

3.3.3 添加列表圖標(biāo)

支持在文章標(biāo)題前添加小圖標(biāo)，有豐富多樣的小圖標(biāo)供選擇，展示效果如下圖所示：

3.4 設(shè)置好文章頁簽組件的內(nèi)容和風(fēng)格后，單擊設(shè)置框右下方“保存”按鈕，以保存所設(shè)置的。

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)在頁面的最底端，可以用鼠標(biāo)左鍵按住組件名稱拖動到需要的位置；

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

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

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

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

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

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

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

三.組件優(yōu)化

1.文章頁簽組件新增頁簽的設(shè)置項；   （2017-9-30優(yōu)化）

（1）新增功能應(yīng)用場景：增加頁簽的設(shè)置項，可以調(diào)整頁簽邊框顏色、粗細(xì)和弧度，讓頁簽組件展示更多樣化；

（2）新增功能操作方法：