Source Code Block in a blog post

SOLVE
Highlighted
Occasional Contributor

I'm working on blogging for a technical audience for a marketing push we're doing.  It's going well, but I'm having to hand align all of the source code blocks using  I'm posting as part of the blog.  I know other blogging and CMS software has builtin source code inline formatting with coloring and proper indentation controls and quick copy to clipboard buttons for the reader to use and test the code on their systems.

 

Do I just not see that part, or is there a module that we can install on our blog to make this process easier / better looking?

 

Examples:

Ours - http://blog.beyondimpactllc.com/blog/learn-powershell-in-5-painless-steps-storage

Theirs - https://blogs.technet.microsoft.com/kevinholman/2016/12/17/getting-monitor-state-change-events-via-p...

1 Accepted solution

Accepted Solutions
HubSpot Employee

Hi @ColeMcdonald,

 

HubSpot does not have a built-in tool or plug-in for formatting and highlighting code snippets in your content, but, you can edit the source of your content and use the HTML <code> tag or HubL {% raw %} tag to display code. However, the syntax of this code will not be automatically highlighted.

 

This article from our Designers' Blog goes over using code snippets in your HubSpot Content: http://designers.hubspot.com/blog/how-to-insert-source-code-into-your-hubspot-blog-post

 

The article also mentions using Prism.js in order to highlight specific syntax in your code. I do not have any experience with Prism.js but it appears to be a popular tool that should allow you to highlight the syntax of your code snippets in HubSpot.

 

Rami 

 

 

 

6 Replies 6
HubSpot Employee

Hi @ColeMcdonald,

 

HubSpot does not have a built-in tool or plug-in for formatting and highlighting code snippets in your content, but, you can edit the source of your content and use the HTML <code> tag or HubL {% raw %} tag to display code. However, the syntax of this code will not be automatically highlighted.

 

This article from our Designers' Blog goes over using code snippets in your HubSpot Content: http://designers.hubspot.com/blog/how-to-insert-source-code-into-your-hubspot-blog-post

 

The article also mentions using Prism.js in order to highlight specific syntax in your code. I do not have any experience with Prism.js but it appears to be a popular tool that should allow you to highlight the syntax of your code snippets in HubSpot.

 

Rami 

 

 

 

Occasional Contributor

Awesome, thank you.

Reply
0 Upvotes
Occasional Contributor
Reply
0 Upvotes
New Contributor

"

HubSpot does not have a built-in tool or plug-in for formatting and highlighting code snippets in your content, but, you can edit the source of your content and use the HTML <code> tag or HubL {% raw %} tag to display code. However, the syntax of this code will not be automatically highlighted.

 

This article from our Designers' Blog goes over using code snippets in your HubSpot Content: http://designers.hubspot.com/blog/how-to-insert-source-code-into-your-hubspot-blog-post

 

The article also mentions using Prism.js in order to highlight specific syntax in your code. I do not have any experience with Prism.js but it appears to be a popular tool that should allow you to highlight the syntax of your code snippets in HubSpot.

 "

 

thanks for this it help out alot ..  saved us alot of running around to find a solution .. thanks again

Reply
0 Upvotes
Visitor

The solution in the blog post of editing the html and build yourself the code fence to insert some code snippet is  good for one off article but not pratical at all for anyone who needs to write regularly blog posts with code snippets, like me and my colleagues.

 

Plus syntax highligthing is not there, you still need to add it in your own.

 

Please consider to have an editor that supports markdwon with code fences and syntax highligthing on the fly, like:

 

Screenshot from 2018-10-15 10-17-32.pngcode snippet

Even t the editor in this forum is better suitable to insert a code snippet then the one we use in the HubSpot platform to wite our blog posts.

 

Please add support for this feature, because anyone from IT wanting to use HubSopt will require this feature and may even be an excluding factor when deciding to go or not with HubSpot or may even contribute for current customers to make the decision in changing platform.

 

Thanks

 

 

New Member

+1,000

And in other cases, writers need to import their articles containing prose and code, yet HubSpot does not import those monospaced fonts. This is a severely limiting factor when using this CMS tool.

Reply
0 Upvotes