如何使用文本組件?
瀏覽數(shù)量: 17 作者: 本站編輯 發(fā)布時(shí)間: 2018-06-25 來(lái)源: 本站
一、什么是文本組件?
文本組件是一個(gè)在頁(yè)面上展示一段文本的模塊,通過(guò)所見(jiàn)即所得的富文本編輯器可以靈活編輯文本內(nèi)容,支持純文本、超鏈接文字、圖標(biāo)字體。通過(guò)編輯器的工具條可以編輯文字的粗細(xì)、斜體、下劃線、清除樣式、設(shè)置編號(hào)、調(diào)整文字對(duì)齊方式(居左、居中、居右、兩端對(duì)齊)、文字段落、文字字體、文字大小、文字顏色、插入圖標(biāo)字體、更改字體背景色等。文本組件的應(yīng)用場(chǎng)景很廣泛、在需要展示一段文字的地方都可以添加文本組件。
二、如何使用文本組件?
1、如何查看文本組件是否已經(jīng)存在?
如果這個(gè)文本組已經(jīng)存在了,就不需要再添加,直接根據(jù)需要進(jìn)行相關(guān)操作就可以(具體操作見(jiàn)下文所述);
如果你的頁(yè)面上需要這個(gè)組件,但是還沒(méi)有添加,就需要先添加文本組件了;怎么判斷頁(yè)面上有沒(méi)有這個(gè)組件?單擊查看如何查看某一塊內(nèi)容是使用什么組件制作的?
2、如何添加文本組件?
在頁(yè)面上添加組件的方法都是一樣的,單擊查看如何添加組件?
添加的組件名稱為“文本組件”,如下圖所示:

3、如何設(shè)置文本組件?
3.1 設(shè)置文本組件展示的內(nèi)容
設(shè)置文本組件內(nèi)容與其它組件方法不一樣,文本組件使用富文本編輯器編輯內(nèi)容。操作步驟如下:
1)添加好文本組件之后,把鼠標(biāo)放到新添加的文本組件區(qū)域,然后單擊鼠標(biāo)左鍵定位光標(biāo),編輯文本內(nèi)容即可,如果是從word、PPT、excel、網(wǎng)頁(yè)等處復(fù)制的內(nèi)容,一定要先把這些內(nèi)容放到記事本中,然后再?gòu)挠浭卤緩?fù)制粘貼到文本組件中,目的是去除文字原有的樣式避免顯示不正常等問(wèn)題。
2)定位好光標(biāo)以后,工具條就會(huì)出現(xiàn),常用操作如下:
★ 如何給文本加超鏈接?
第1步:先選中要加鏈接的文字,然后單擊工具條上的超鏈接按鈕,超鏈接類型選擇“地址”,協(xié)議選擇“http://”,然后輸入要跳轉(zhuǎn)到的頁(yè)面地址(URL),再點(diǎn)擊“確定”,如下圖所示;

第2步:如果需要在新窗口中打開(kāi)此鏈接的話,可以單擊“目標(biāo)”,然后在目標(biāo)窗口處選擇“新窗口”,最后單擊“確定”,如下圖所示;

第3步:如果要給加了超鏈接的文字設(shè)置顏色,可以先選中文本,然后設(shè)置顏色,如下圖所示。

★ 如何實(shí)現(xiàn)單擊郵箱(郵件地址)直接到發(fā)送郵件的客戶端?
第1步:先選中郵箱,然后單擊工具條上的超鏈接按鈕,超鏈接類型選擇“電子郵件”,在"地址"處輸入郵箱,然后單擊“確定”,如下圖所示;

第2步:如果要給加了超鏈接的郵件地址設(shè)置顏色,可以先選中郵箱,然后設(shè)置顏色,如下圖所示。

第3步:如果訪客電腦上安裝了1個(gè)客戶端(客戶端舉例:outlook、foxmail),訪客單擊郵箱時(shí)會(huì)直接跳轉(zhuǎn)到客戶端發(fā)郵件界面;如果訪客電腦上安裝多個(gè)客戶端,會(huì)讓選擇用哪個(gè)打開(kāi);如果訪客電腦上沒(méi)有安裝客戶端,會(huì)讓選擇在web端發(fā)送郵件。
★ 如何添加圖標(biāo)字體并且設(shè)置字體顏色?
第1步:在添加圖標(biāo)字體的位置單擊鼠標(biāo)左鍵定位光標(biāo);
第2步:?jiǎn)螕艄ぞ邨l上的“圖標(biāo)字體庫(kù)”按鈕,彈出“選擇圖標(biāo)”對(duì)話框,單擊選擇一個(gè)圖標(biāo),單擊“確定”;
第3步:像設(shè)置普通的文字一樣去給圖標(biāo)設(shè)置顏色就可以,先選中,然后使用工具條上的顏色設(shè)置就可以。

★ 如何在文本組件中給文字添加H標(biāo)簽?
先選中要加H標(biāo)簽的文字,然后出現(xiàn)富文本編輯器工具條,單擊工具條中的“段落”右側(cè)下拉小箭頭,可以給選中的文字設(shè)置H標(biāo)簽,如下圖所示:

3.2 進(jìn)入組件的“設(shè)置”分兩種場(chǎng)景
1)“此組件已經(jīng)添加好”場(chǎng)景:進(jìn)入所有這類組件設(shè)置項(xiàng)方法都是一樣的,可以參考這個(gè)攻略:如何進(jìn)入組件的設(shè)置項(xiàng)?
2)“新添加的組件”場(chǎng)景:在添加此組件時(shí)會(huì)彈出這個(gè)組件的的設(shè)置話框。
3.3 在組件的設(shè)置中可以設(shè)置組件的特效
選擇頁(yè)面初次加載的文字特效:頁(yè)面初次加載文字時(shí),可以設(shè)置一些文字特效,如下圖所示:

3.4 在組件的設(shè)置中可以設(shè)置組件的高級(jí)功能
有的文本組件文字在PC端顯示的字號(hào)是合適的,但是到了PAD或手機(jī)端就太大了,這種情況就可以自定義PAD或手機(jī)端文字大小了。文本組件支持自定義不同設(shè)備下的文字大小。

3.5 在組件的設(shè)置中可以設(shè)置組件展示的風(fēng)格
文本組件支持自定義文字風(fēng)格,可以設(shè)置初始狀態(tài)下的文字顏色、背景顏色,也支持設(shè)置鼠標(biāo)懸浮到文字上時(shí)的文字顏色、背景顏色。

3.6 設(shè)置好文本組件的特效。高級(jí)功能和風(fēng)格后,單擊設(shè)置框右下方“保存”按鈕,以保存所設(shè)置的。

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)品分類組件、文章分類組件等。被應(yīng)用過(guò)去的組件會(huì)出現(xiàn)在頁(yè)面的最底端,可以用鼠標(biāo)左鍵按住組件名稱拖動(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ù)組件
設(shè)置好文本組件的內(nèi)容后,可以根據(jù)需要使用此組件的以下功能:
3、查看如何編輯組件的樣式?
4、查看如何復(fù)制組件?
5、查看如何應(yīng)用組件?
6、查看如何刪除組件?
7、查看如何恢復(fù)組件?