We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Changing heading level programatically

Thread ID:





142845 Feb 21,2019 09:15 PM UTC Feb 22,2019 10:14 AM UTC JavaScript - EJ 2 1
Tags: DocumentEditor
Asked On February 21, 2019 09:15 PM UTC

I am trying to change the selected text heading level programatically.. like applying "normal" or "heading 1" or heading 2. etc

 Any help much appreciated.

Thank you

Suriya Murugan [Syncfusion]
Replied On February 22, 2019 10:14 AM UTC

Hi Sampurnima, 
Thanks for contacting Syncfusion support. 

In our DocumentEditor control, we have some predefined set of styles such as 'Normal', 'Heading 1', 'Heading 2', 'Heading 3', 'Heading 4', 'Heading 5', 'Heading 6'. You can apply these styles to selected text by using ‘applyStyle()’ method of Editor module. Please find the sample code to apply predefined styles to selected text.  

Sample Code: 
//Apply Normal style 
//Apply Heading 1 style 
documenteditor.editor.applyStyle("Heading 1"); 
//Apply Heading 2 style 
documenteditor.editor.applyStyle("Heading 2"); 
//Apply Heading 3 style 
documenteditor.editor.applyStyle("Heading 3"); 
//Apply Heading 4 style 
documenteditor.editor.applyStyle("Heading 4"); 
//Apply Heading 5 style 
documenteditor.editor.applyStyle("Heading 5"); 
//Apply Heading 6 style 
documenteditor.editor.applyStyle("Heading 6"); 

And we also have support for adding custom styles in DocumentEditor. Please find the step to define a new style and apply it in document editor from below documentation link. 


Suriya M. 


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon