In Hubspot blog editor how to fix height of the editor ?

SOLVE
prasadcolumbus
Participant | Diamond Partner

how to addjust the blog editor height on when click on create post.Currently it's showing below height by default.blog editor.PNG

 

I am using  {{ content.post_body}} this variable on blog post templste

0 Upvotes
1 Accepted solution

Accepted Solutions
BootstrapC
Solution
Top Contributor

Dennis had a great suggestion. What I did was compare the HTML markup inside the editor vs the preview page. I noticed the container that wraps the post body is a div and then when publishes converts to a span tag.

 

It also has a unique class of inpage-editor-active-field when inside the editor. So add this rule to your stylesheet to add a min-height just when you are editing the post.  

 

/* Make the post body height larger when editing */

#hs_cos_wrapper_post_body.hs-baymax-editor {
min-height:400px;
}

Jake Lett
HubSpot CMS web design & optimization consultant
Creator of the FREE Industrial HubSpot Theme which helps manufacturers quickly build their website or blog on HubSpot.



View solution in original post

3 Replies 3
dennisedson
Community Manager

Hello @prasadcolumbus ,

This is the default height.  Are you wanting it to be larger while editing or are you wanting it to be larger on the production site? 

I imagine you could target some classes that are only used in edit mode if you want it just while editing 🤔

@BootstrapC , @SandyG1@AlexanderData  how would you all go about this?

Thanks,

Dennis




Check out our Community Developer Blog
where we feature our Community driven developer podcast and how to content
0 Upvotes
prasadcolumbus
Participant | Diamond Partner

I did n't understand you solution.Can You please eloborate more @dennisedson .

 

Is their any chance to place the default Place Holder text to the Editor when I click on create new post?

0 Upvotes
BootstrapC
Solution
Top Contributor

Dennis had a great suggestion. What I did was compare the HTML markup inside the editor vs the preview page. I noticed the container that wraps the post body is a div and then when publishes converts to a span tag.

 

It also has a unique class of inpage-editor-active-field when inside the editor. So add this rule to your stylesheet to add a min-height just when you are editing the post.  

 

/* Make the post body height larger when editing */

#hs_cos_wrapper_post_body.hs-baymax-editor {
min-height:400px;
}

Jake Lett
HubSpot CMS web design & optimization consultant
Creator of the FREE Industrial HubSpot Theme which helps manufacturers quickly build their website or blog on HubSpot.



View solution in original post