網站開發時富文本編輯器是必不可少的，他可以讓用戶自行編輯內容的樣式然后上傳到后台！下面我們來介紹如何安裝使用百度富文本編輯器
一、下載並且設置百度富文本編輯器的樣式
你可以去百度UEditor的官網去下載編輯器，網址是http://ueditor.baidu.com/website/，下載下來之后看到有一個demo.html文件，所以你網頁上面也得引入demo.html里面引入的所有js文件
<!-- 配置文件 --> <script type="text javascript" src="um/ueditor.config.js"> <!-- 編輯器源碼文件 --> <script type="text javascript" src="um/ueditor.all.js"></script type="text></script type="text>
<!-- 加載編輯器的容器 -->這是在header里面引入
<script id="container" name="content" type="text plain"=""> <script type="text javascript" src="js.js"></script type="text></script id="container" name="content" type="text>
這是放在你網頁上面需要放置編輯器的位置
看這樣百度富文本編輯器就出來啦，然后你可以編輯編輯器的樣式，推薦使用火狐瀏覽器的firebug工具查看編輯器的代碼然后設置樣式！如下，
例如我想要縮短編輯器的長度並且居中你就可以這樣寫css（注意引入css哦！）
#container { width:90%; margin:0 auto; }
二、設置百度UEditor文件上傳路徑
百度富文本編輯器UEditor默認上傳的文件都在ueditorphpupload文件夾下，這樣對於我們網站開發肯定是不方便的，所以我們得更改上傳文件目錄！打開umphpconfig.json文件，里面都各種文件上傳目錄配置！
例如我想更改圖片上傳的目錄，找到帶有 “/* 上傳圖片配置項 */”下面的代碼，然后找到imagePathFormat配置，可以將“/ueditor/php/upload/image/”修改成你想要上傳到的文件目錄，注意后面的“{yyyy}{mm}{dd}/{time}{rand:6}”不用更改，它可以自己生成分類文件夾！大家可以參照一下我的配置
"imagePathFormat": "Upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上傳保存路徑,可以自定義保存路徑和文件名格式 */
其他的文件上傳也可以參照圖片上傳都是改變imagePathFormat的屬性，而且在PHP中只需要改變這一個屬性！
三、將百度UEditor提交到后台
將在百度富文本編輯器UEditor中編輯的內容提交到后台，后台怎么接收呢？其實這就跟一個form表單提交一樣，你可以吧整個百度UEditor看做一個textarea
<!-- 加載編輯器的容器 --> <script id="container" name="content" type="text plain"=""> </script id="container" name="content" type="text>
這是要在網頁上面編輯器的位置添加的一部分代碼，大家有沒有發現script標簽有一個name屬性，所有后台就直接可以$_POST['content']接收就好啦，當然你也可以用其他name名稱試試！
四、在前台顯示百度UEditor編輯的代碼樣式
百度富文本編輯器UEditor帶有插入代碼的功能，也就是你在后台選擇一種代碼語言，然后在里面寫入代碼，前台可以給代碼高亮顯示，便於用戶閱讀代碼，可以增加用戶體驗！
大家可以看看看代碼高亮的樣式
但是這需要前台引入其他的js和css文件才可以啟動代碼高亮功能，所以前台引入代碼如下
<link href="/um/third-party/SyntaxHighlighter/shCoreDefault.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="/um/third-party/SyntaxHighlighter/shCore.js"></script>
基本的百度富文本編輯器UEditor安裝配置就到這里啦，如果大家還有什么問題可以到王業樓的博客去討論，大家一起交流學習！
本文來源於王業樓的個人博客 本文地址：http://www.ly89.cn/detailB/50.html
歡迎分享本文，轉載請注明本文出處和地址