Title: Heading defaults Last modified: April 27, 2025 --- # Heading defaults * [scargill](https://wordpress.org/support/users/scargill/) * (@scargill) * [1 year, 1 month ago](https://wordpress.org/support/topic/heading-defaults/) * This one is probably down to me but I’ll ask anyway… when I’m creating or editing a blog entry, I like sections to have headings – but every time – the default heading is heading 2 in default colour… is there any way to tell WP to default to H3 and maybe one of the colours over in the right panel – I use green. * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fheading-defaults%2F%3Foutput_format%3Dmd&locale=en_US) to see the link]_ Viewing 10 replies - 1 through 10 (of 10 total) * [Sohilbhai Ghanchivahora](https://wordpress.org/support/users/sohilvahora96/) * (@sohilvahora96) * [1 year, 1 month ago](https://wordpress.org/support/topic/heading-defaults/#post-18439494) * Hi [@scargill](https://wordpress.org/support/users/scargill/) To set default heading to h3 and color to green there is not any setting at wp-admin side, you have to use custom code as per below which I have implemented in child theme. Update it according to your requirement in parent or child theme.// Please add below code in “functions.php” file of the theme, then create “editor.js” file and “editor-style.css” on theme root folder. * ```wp-block-code /***************************************************************************************//*************************************** functions.php **********************************//****************************************************************************************/// Editor style code - set h3 element color to green (Create "editor-style.css" in theme root folder)function mytheme_add_editor_styles() { add_theme_support('editor-styles'); // Enables editor-style add_editor_style('editor-style.css'); // Path of theme root}add_action('after_setup_theme', 'mytheme_add_editor_styles');// Set default element to h3 (Create "editor.js" in theme root folder) (get_stylesheet_directory_uri() for child theme, use get_template_directory_uri() for parent or main theme)function mytheme_editor_assets() { wp_enqueue_script( 'mytheme-editor-js', get_stylesheet_directory_uri() . '/editor.js', array('wp-blocks', 'wp-dom-ready', 'wp-edit-post'), filemtime(get_stylesheet_directory_uri() . '/editor.js') );}add_action('enqueue_block_editor_assets', 'mytheme_editor_assets');/*************************************************************************************//*************************************** editor.js ***********************************//*************************************************************************************/wp.domReady(function () { const { getBlockType, unregisterBlockType, registerBlockType } = wp.blocks; const headingBlock = getBlockType('core/heading'); if (headingBlock) { unregisterBlockType('core/heading'); registerBlockType('core/heading', { ...headingBlock, attributes: { ...headingBlock.attributes, level: { type: 'number', default: 3, // 👈 Set default heading level to H3 }, }, }); }});/*************************************************************************************//************************************* editor-style.css *******************************//*************************************************************************************//* This targets headings inside the Gutenberg editor */.editor-styles-wrapper h3 { color: #2e8b57; /* Green */}/* Optionally: frontend headings too */h3 { color: #2e8b57;} ``` * Thread Starter [scargill](https://wordpress.org/support/users/scargill/) * (@scargill) * [1 year, 1 month ago](https://wordpress.org/support/topic/heading-defaults/#post-18441329) * Understand all that thanks – not sure how to create those files you mention – can’t seen to do it in WP admin – in CPANEL ? Oh I tried that – some issue with formatting your code – is the forum adding in some special characters?? - This reply was modified 1 year, 1 month ago by [scargill](https://wordpress.org/support/users/scargill/). * [Sohilbhai Ghanchivahora](https://wordpress.org/support/users/sohilvahora96/) * (@sohilvahora96) * [1 year, 1 month ago](https://wordpress.org/support/topic/heading-defaults/#post-18441456) * Hi [@scargill](https://wordpress.org/support/users/scargill/) First check activated theme by visiting “**Appearance**” tab on wp-admin side ([http://yoursite.com/wp-admin/themes.php](http://yoursite.com/wp-admin/themes.php)) Then by using **file manager at cPanel**, you can create those files as per previous message in wp-content/themes/your_activated_theme directory. No, foram not adding any special characters. * Thread Starter [scargill](https://wordpress.org/support/users/scargill/) * (@scargill) * [1 year, 1 month ago](https://wordpress.org/support/topic/heading-defaults/#post-18441770) * Truly sorry to waste your time – but in creating editor.js and pasting in code from the forum… I’m seeing… * wp.domReady(function () { const { getBlockType, unregisterBlockType, registerBlockType} = wp.blocks; * ```wp-block-code const headingBlock = getBlockType('core/heading'); if (headingBlock) { unregisterBlockType('core/heading'); registerBlockType('core/heading', { ...headingBlock, attributes: { ...headingBlock.attributes, level: { type: 'number', default: 3, // 👈 Set default heading level to H3 }, }, }); } ``` * }); * and the editor is griping from line 12 (…headingBlock) on.. * Oh I can’t show you and image of what I see (standad Win 11 PC, Chrome)as this dumb forum editor won’t let me paste in images…. expected } to match { from line 11 and instead saw ‘…’. Expected ) and instead saw headingBlock etc etc and theres a finger after default: 3, // * Possibly email [email removed by moderator] the text of that code? - This reply was modified 1 year, 1 month ago by [scargill](https://wordpress.org/support/users/scargill/). - This reply was modified 1 year, 1 month ago by [Steven Stern (sterndata)](https://wordpress.org/support/users/sterndata/). * [Biplob Chandra Deb Nath](https://wordpress.org/support/users/biplob043013/) * (@biplob043013) * [1 year, 1 month ago](https://wordpress.org/support/topic/heading-defaults/#post-18442741) * have any error message? * [Sohilbhai Ghanchivahora](https://wordpress.org/support/users/sohilvahora96/) * (@sohilvahora96) * [1 year, 1 month ago](https://wordpress.org/support/topic/heading-defaults/#post-18442763) * Hi [@scargill](https://wordpress.org/support/users/scargill/) , Try below one for editor.js * ```wp-block-code wp.domReady(function () { const { getBlockType, unregisterBlockType, registerBlockType } = wp.blocks; const headingBlock = getBlockType('core/heading'); if (headingBlock) { unregisterBlockType('core/heading'); registerBlockType('core/heading', { ...headingBlock, attributes: { ...headingBlock.attributes, level: { type: 'number', default: 3, }, }, }); }}); ``` * Let me know if you face any issue and possible to send screenshots of the issue. Thanks. * [Sohilbhai Ghanchivahora](https://wordpress.org/support/users/sohilvahora96/) * (@sohilvahora96) * [1 year, 1 month ago](https://wordpress.org/support/topic/heading-defaults/#post-18444684) * Hi [@scargill](https://wordpress.org/support/users/scargill/) I have checked in blog-kit theme and made some changes, please create/update file and update/ add below code in your theme’s file. Please check below image link, * [https://ibb.co/zhn9dG4D](https://ibb.co/zhn9dG4D) * ```wp-block-code // editor.jswp.domReady(function () { const { getBlockType, unregisterBlockType, registerBlockType } = wp.blocks; const headingBlock = getBlockType('core/heading'); if (headingBlock) { unregisterBlockType('core/heading'); registerBlockType('core/heading', { ...headingBlock, attributes: { ...headingBlock.attributes, level: { type: 'number', default: 3, // Set default heading level to H3 }, textColor: { type: 'string', default: 'green', // Set default color to green }, style: { type: 'object', default: { color: { text: '#00d084' // Alternative way to set default color } } } }, }); }}); ``` * ```wp-block-code // editor-style.css/* This targets headings inside the Gutenberg editor */.editor-styles-wrapper h3 { color: #00d084 /* Green */}/* Optionally: frontend headings too */h3 { color: #00d084;} ``` * ```wp-block-code // theme.json{ "version": 2, "settings": { "color": { "palette": [ { "name": "Green", "slug": "green", "color": "#00d084" } ] } }, "styles": { "blocks": { "core/heading": { "typography": { "fontSize": "var(--wp--preset--font-size--medium)" }, "color": { "text": "var(--wp--preset--color--green)" } } } }} ``` * ```wp-block-code // functions.php// Editor style code - set h3 element color to green (Create "editor-style.css" in theme root folder)function mytheme_add_editor_styles() { add_theme_support('editor-styles'); // Enables editor-style add_editor_style('editor-style.css'); // Path of theme root}add_action('after_setup_theme', 'mytheme_add_editor_styles');// Set default element to h3 (Create "editor.js" in theme root folder) (get_template_directory_uri() for child theme, use get_template_directory_uri() for parent or main theme)function mytheme_editor_assets() { wp_enqueue_script( 'mytheme-editor-js', get_template_directory_uri() . '/editor.js', array('wp-blocks', 'wp-dom-ready', 'wp-edit-post'), filemtime(get_template_directory_uri() . '/editor.js') );}add_action('enqueue_block_editor_assets', 'mytheme_editor_assets'); ``` * Thread Starter [scargill](https://wordpress.org/support/users/scargill/) * (@scargill) * [1 year, 1 month ago](https://wordpress.org/support/topic/heading-defaults/#post-18444761) * Thanks ut no matter what I try – those 3 periods before headingBlock cause the editor to throw up errors… * That or the comma… * ```wp-block-code ...headingBlock, ``` * I simply can’t find a ay to save the above without errors. I’m in cpanel file namager – got the empty editor.js file – edit….. - This reply was modified 1 year, 1 month ago by [scargill](https://wordpress.org/support/users/scargill/). * [Sohilbhai Ghanchivahora](https://wordpress.org/support/users/sohilvahora96/) * (@sohilvahora96) * [1 year, 1 month ago](https://wordpress.org/support/topic/heading-defaults/#post-18446866) * Hi [@scargill](https://wordpress.org/support/users/scargill/) * I got it that you’re getting warnings in cPanel’s file manager due to the spread operator (…) in the JavaScript code. This is likely because cPanel’s file manager might be using an older JavaScript parser that doesn’t support the spread operator syntax. Let me help you modify the code to be more compatible. * I’ve modified the code to replace the spread operator (…) with Object.assign(), which is a more widely supported method for object merging. The functionality remains exactly the same, but now it should work without warnings in cPanel’s file manager. * ```wp-block-code // editor.jswp.domReady(function () { const { getBlockType, unregisterBlockType, registerBlockType } = wp.blocks; const headingBlock = getBlockType('core/heading'); if (headingBlock) { unregisterBlockType('core/heading'); registerBlockType('core/heading', Object.assign({}, headingBlock, { attributes: Object.assign({}, headingBlock.attributes, { level: { type: 'number', default: 3, // Set default heading level to H3 }, textColor: { type: 'string', default: 'green', // Set default color to green }, style: { type: 'object', default: { color: { text: '#00d084' // Alternative way to set default color } } } }) })); }}); ``` * Replace above code in editor.js file. Thanks * [Sohilbhai Ghanchivahora](https://wordpress.org/support/users/sohilvahora96/) * (@sohilvahora96) * [1 year ago](https://wordpress.org/support/topic/heading-defaults/page/2/#post-18483844) * Hi [@scargill](https://wordpress.org/support/users/scargill/) , Your issue resolved? Viewing 10 replies - 1 through 10 (of 10 total) The topic ‘Heading defaults’ is closed to new replies. * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/) * 17 replies * 3 participants * Last reply from: [Sohilbhai Ghanchivahora](https://wordpress.org/support/users/sohilvahora96/) * Last activity: [1 year ago](https://wordpress.org/support/topic/heading-defaults/page/2/#post-18483844) * Status: not a support question ## Topics ### Topics with no replies ### Non-support topics ### Resolved topics ### Unresolved topics ### All topics