在當今數字化辦公時代,文檔編輯器已成為各類企業、組織和開發者不可或缺的工具之一。ONLYOFFICE 文檔提供的功能豐富且強大的文檔編輯 API,讓開發者能夠根據自己的產品需求和品牌特點,定制編輯器界面,實現品牌化展示,為用戶提供了一個深度契合其品牌形象和業務需求的文檔操作體驗。下面一起來了解ONLYOFFICE文檔API,幫助實現編輯器定制化。
關于 ONLYOFFICE 文檔
ONLYOFFICE 是一個開源項目,專注于高級和安全的文檔處理和協作。全球超過 1500 萬用戶,是在線辦公領域的創新者。
ONLYOFFICE 文檔提供文本文檔、電子表格、幻燈片、表單和 PDF 編輯器。ONLYOFFICE 文檔高度兼容微軟 Office 格式,并提供數百種格式化和樣式工具,以及多種協作功能,包括實時和段落鎖定兩種共同編輯模式、評論和審閱、內置聊天、版本歷史等。
?
該辦公套件可以連接到多個云平臺,如 WordPress、Seafile、Moodle等,也可以集成到您自有的應用程序、網站或其他解決方案,為其提供強大的編輯功能,還提供個性化的定制功能來滿足產品的品牌化需求。
ONLYOFFICE 可以在任何平臺上部署,包括 Windows、Linux、macOS、Android,也可以在任何設備上使用。在線、移動和桌面版本均使用同一引擎,確保離線和在線工作之間無縫切換。
下面我們一起了解關于編輯器自定義的API。
什么是品牌自定義
品牌自定義是指根據企業自身的品牌形象和風格,對相關界面或元素進行個性化設置的功能。在自定義部分,您可以對編輯器界面進行調整,使其與其他產品(如果有)在視覺風格上保持一致,實現品牌整體形象的統一。同時,您還可以靈活設置是否顯示附加按鈕和鏈接,更換徽標,以及修改編輯器所有者信息等細節內容,以此來打造符合品牌特色的專屬編輯環境,提升品牌辨識度和用戶體驗。ONLYOFFICE 開發者版當前可支持標準品牌定制和白標定制,滿足不同程度的定制化需求。
標準品牌定制
編輯器開發者版本可以根據您的需求進行標準品牌定制,包括:定制編輯器的行為和外觀。
-
隱藏功能提示
editorConfig.customization.features.featuresTips?參數允許在更新后首次加載編輯器時啟用或禁用有關新功能的工具提示。默認值為?true
。
-
顯示電子表格滾動條
從 8.3 版本開始,可以定義在加載電子表格編輯器時是否自動顯示或隱藏水平/垂直滾動條。查看?editorConfig.customization.showHorizontalScroll?和?editorConfig.customization.showVerticalScroll?來控制這些參數。默認值為?true
.
-
演示文稿幻燈片背景
使用?editorConfig.customization.slidePlayerBackground?參數以 HEX、RGB 或 RGBA 格式定義幻燈片背景顏色。例如,#ff0000、rgb(255, 0, 0)、rgba(255, 0, 0, 0.5)。
showHorizontalScroll: true,
showVerticalScroll: true,
slidePlayerBackground: "#000000",
-
文檔標題顏色
使用?editorConfig.customization.wordHeadingsColor?參數自定義文檔編輯器中默認標題顏色,并允許使用HEX?顏色規范(十六進制顏色)。
-
緊湊文檔標題
你可以選擇附加操作按鈕的位置,在編輯器窗口標題的上部靠近徽標 (false
) ,或是顯示在工具欄 (true
),使標題更緊湊。默認值為 false
。
-
?查看器的緊湊工具欄
editorConfig.customization.compactToolbar?參數現在支持查看器模式,允許在完整工具欄和緊湊工具欄之間切換。查看模式的默認值為?true
。
-
移動編輯器中的信息按鈕
使用?editorConfig.customization.mobile.info?決定顯示或隱藏移動編輯器中“文檔信息”。默認值為?false
。
-
指針模式
使用?editorConfig.customization.pointerMode?參數調整演示文稿查看器中的指針模式(選擇或手形)。默認值為?select
。
-
自定義展示信息
您可以自定義編輯器關于部分中顯示的信息,包括文檔授權者的聯系地址、公司信息、公司logo、電子郵箱、公司名稱和聯系電話、網址等。這部分信息對所有編輯器用戶可見。
const customer = {address: "My City, 123a-45",info: "Some additional information",logo: "https://example.com/logo-big.png",logoDark: "https://example.com/dark-logo-big.png",mail: "john@example.com",name: "John Smith and Co.",phone: "123456789",www: "example.com",
}
自定義地址
editorConfig.customization.customer.address 參數授予編輯者或編輯者作者訪問權限的公司或個人的聯系地址。
示例:?My City, 123a-45
自定義信息
關于您希望其他人知道的公司或個人的一些附加信息。
示例:?Some additional information
自定義logo
editorConfig.customization.customer.logo?參數支持設置圖像徽標,圖片 logo 推薦透明背景的?.png?格式,尺寸為432x70。editorConfig.customization.customer.logoDark支持深色主題圖像徽標
示例1:?https://example.com/logo-big.png
示例2:?https://example.com/dark-logo-big.png
自定義電子郵箱?
使用editorConfig.customization.customer.mail授予編輯者或編輯者作者訪問權限的公司或個人的電子郵件地址。
示例:?john@example.com
自定義名稱?
?使用editorConfig.customization.customer.name授予編輯者或編輯者作者訪問權限的公司或個人的名稱。
示例:?John Smith and Co.
自定義聯系方式?
使用editorConfig.customization.customer.phone授予編輯器或編輯器作者訪問權限的公司或個人的電話。
示例:?123456789
自定義網址?
使用editorConfig.customization.customer.www添加上述公司或個人的主頁地址。
示例:?example.com
自定義信息的展示示例如下:
-
自定義品牌logo
更改編輯器標題左上角的圖像文件。推薦的圖像高度為 20 像素。
請注意, 此參數僅適用于 ONLYOFFICE 文檔開發者版的編輯,以及移動編輯器。
示例:
const logo = {image: "https://example.com/logo.png",imageDark: "https://example.com/dark-logo.png",imageLight: "https://example.com/light-logo.png",url: "https://example.com",visible: true,
}
logo圖標
customization-standard-branding/#logoimage使用editorConfig.customization.logo.image在通用工作模式(即所有編輯器的查看和編輯模式)或嵌入模式(請參閱配置部分以了解如何定義嵌入文檔類型)中顯示的圖像文件的路徑。圖片必須具有以下尺寸:172x40.
示例:?https://example.com/logo.png
logo.深色圖標?
使用editorConfig.customization.logo.imageDark在深色標題的圖像文件的路徑(例如,在深色主題中或帶有彩色標題的主題中)。圖像必須具有以下尺寸:172x40。
示例:?https://example.com/dark-logo.png
logo.淺色圖標?
使用editorConfig.customization.logo.imageLight在淺色標題的圖像文件的路徑(例如,在灰色主題中)。圖像必須具有以下尺寸:172x40。
示例:?https://example.com/light-logo.png
ONLYOFFICE 文檔 API 提供了全面且細致的品牌化定制選項,涵蓋了從界面元素的顯示與隱藏、布局調整到品牌信息的深度融入等各個方面。無論是企業內部系統集成、獨立軟件產品開發,還是 SaaS 平臺的文檔服務模塊定制,都能輕松應對。
立即定制您的編輯器界面
想要將 ONLYOFFICE 文檔編輯器集成到您的產品中嗎?請訪問我們的官方網站,下載最新版本的 ONLYOFFICE 文檔開發者版。點擊下方鏈接,申請免費試用30天:
下載 ONLYOFFICE 服務器解決方案,并以您的品牌提供給您的客戶 | ONLYOFFICEhttps://www.onlyoffice.com/zh/download-developer.aspx?utm_source=csdn&utm_medium=article&utm_campaign=doc_api_roundup
相關鏈接
ONLYOFFICE?文檔開發者版
API 文檔
自動化 API
ONLYOFFICE?文檔?8.3