In the GroupDocs.Editor, the editing operation implies that the source document is converted to the EditableDocument instance, and this instance can emit HTML- and CSS-markup to be placed in the client-side WYSIWYG-editor, then end-user edits this document in the web-browser, and finally document is saved — this implies converting document content from HTML/CSS back to the original (or some other) format.
Prior to the version 23.8 of the GroupDocs.Editor the HTML-version of a document, which is obtained from EditableDocument class, the CSS styles were placed in the external stylesheet file “style.css”. HTML file in this case contains a reference to the external stylesheet. And there was no possibility to change the location of CSS styles.
Version 23.8 of GroupDocs.Editor introduces a new option — an ability to enable the “inline styles” mode for all of the documents, which belong to the family of WordProcessing formats. In this mode only WordProcessing styles are exported to the external stylesheet, while all other styles — text and paragraph formatting, list and table settings, — are exported directly to the HTML markup. They became inline CSS styles, which means that in this case the styles are saved in the “style” HTML attribute for every HTML element. As a result, an HTML document, generated with enabled inline styles option, has larger HTML-markup and lesser CSS-markup, compared to the one, where this option is disabled.
The inline styles option is represented as a public property of the System.Boolean type in the WordProcessingEditOptions class. By default it is disabled (false), so the GroupDocs.Editor will act in the same behavior, as its previous versions.
publicboolUseInlineStyles{get;set;}
The example below shows opening and editing a single WordProcessing document twice: first one in default style, and then with enabled inline styles.
// Obtain a valid full path to the existing WordProcessing filestringinputPath="SampleDoc.docx";// Create default edit options, where all styles are externalWordProcessingEditOptionseditOptionsExternalStyles=newWordProcessingEditOptions();//Create custom edit options, where most of styles are inlineWordProcessingEditOptionseditOptionsInlineStyles=newWordProcessingEditOptions();// Enable inline styles in this instanceeditOptionsInlineStyles.UseInlineStyles=true;// Create instance of the Editor class and load a documentusing(Editoreditor=newEditor(inputPath)){// Get editable document instance, where all styles are external EditableDocumentdocWithExternalStyles=editor.Edit(editOptionsExternalStyles);// Get editable document instance, where most of styles are inlineEditableDocumentdocWithInlineStyles=editor.Edit(editOptionsInlineStyles);// Get only HTML-markup, where all styles are externalstringhtmlMarkupExternal=docWithExternalStyles.GetContent();// Get only HTML-markup, where most of styles are inlinestringhtmlMarkupInline=docWithInlineStyles.GetContent();// Make sure that HTML-markup with inline styles is biggerAssert.Greater(htmlMarkupInline.Length,htmlMarkupExternal.Length);}
Need to emphasize that no matter where the CSS styles are located — inside the HTML-markup or in the external file, — the final representation of the HTML-document in the web-browser will be identical.
Also please take into account that this feature exists only for the WordProcessing formats family.
Was this page helpful?
Any additional feedback you'd like to share with us?
Please tell us how we can improve this page.
Thank you for your feedback!
We value your opinion. Your feedback will help us improve our documentation.