Apply Word document styles to maintain consistent formatting across your document.
Linked styles preserve the original Word styling system, including style inheritance and formatting rules.
Important: Linked Styles work with Word documents. This demo simulates the visual effect.
Real-World Usage
When a Word document is loaded:
// Styles are automatically imported from styles.xml
const styles = editor . helpers . linkedStyles . getStyles ()
// Apply a style by ID
editor . commands . setStyleById ( 'Heading1' )
// Or with the style object
const titleStyle = editor . helpers . linkedStyles . getStyleById ( 'Title' )
editor . commands . setLinkedStyle ( titleStyle )
OOXML Structure
< w:p >
< w:pPr >
< w:pStyle w:val = "Heading1" />
</ w:pPr >
< w:r >
< w:t > Text with Heading 1 style </ w:t >
</ w:r >
</ w:p >
Use case
Document Templates - Maintain corporate style guides
Consistency - Uniform formatting across large documents
Quick Formatting - One-click style application
Word Compatibility - Preserves Word’s style system
Style Updates - Change all instances by updating the style definition
Commands
setLinkedStyle
Apply a linked style to the selected paragraphs.
Example:
const style = editor . helpers . linkedStyles . getStyleById ( 'Heading1' );
editor . commands . setLinkedStyle ( style );
Parameters:
The style object to apply
toggleLinkedStyle
Toggle a linked style on the current selection. Removes the style if already applied, applies it if not.
Example:
const style = editor . helpers . linkedStyles . getStyleById ( 'Heading1' );
editor . commands . toggleLinkedStyle ( style )
editor . commands . toggleLinkedStyle ( style , 'paragraph' )
Parameters:
The linked style to apply (with id property)
Node type to restrict toggle to (e.g., ‘paragraph’)
setStyleById
Apply a linked style by its ID.
Example:
editor . commands . setStyleById ( 'Heading1' )
editor . commands . setStyleById ( 'Normal' )
Parameters:
The style ID to apply (e.g., ‘Heading1’)
Helpers
getStyles
Get all available linked styles from the document.
Example:
const styles = editor . helpers . linkedStyles . getStyles ();
Returns:
Array of linked style objects
getStyleById
Get a specific style by ID.
Example:
const headingStyle = editor . helpers . linkedStyles . getStyleById ( 'Heading1' );
Parameters:
Returns:
The style object or undefined
Types
LinkedStyle
Style definition from a Word document.
Style ID (e.g., ‘Heading1’, ‘Normal’)
Style type (‘paragraph’ or ‘character’)
Style definition from Word
Source code