I want to add a code viewer in Google Blogger like in image given below. How can I add it please help.
-
I'm voting to close this question as off-topic because this question is not about writing, but about programming.– Craig SeftonCommented May 25, 2018 at 6:39
-
This question is about blogging software and how to use it, which is on-topic. That the OP wants to include technical stuff like programming code is irrelevant and doesn't make the question off-topic.– SecespitusCommented May 25, 2018 at 8:16
4 Answers
There is no native way to do this in Blogger it appears (ie - no button you can click on the editor toolbar to insert a block of formatted code) - however, there are plugins and css / javascript solutions you could try - some of those programmatic solutions can be found here in StackOverflow that discusses this at length:
https://stackoverflow.com/questions/3207758/how-to-show-code-snippet-in-blogs
Another solution: http://rusya7.blogspot.com/2015/02/how-to-insert-code-blocks-in-blogger.html
Good luck!
Just choose html mode, then write
<code> some code </code>
Then switch back to the normal mode, the paste your codes in replace of the "some code"
-
The only thing to note on this solution is it won't add a 'template' as the OP inquired about; it's a pretty vanilla solution. The nice thing is this is a semantic HTML solution with no scripts needed, but at the end of the day really just changes the font of the code.– atconwayCommented Dec 20, 2019 at 22:41
Hilite.me is a good quick way. Copy/paste the HTML code then into your blog post. You might need to switch from Compose View to HTML View.
Alternatively I like to copy/paste from my code editor Visual Studio Code. (no need to switch to HTML View) This will take over the coloring/ syntax highlighting from your editor. It might work as well with other Editors.
If I have bigger portion of code, I like to create a public gist and paste the embed HTML code in the HTML code of the blog.
To add code snippet or examples in your blogs, you can use:
- Block Codes
- planetB Syntax highlight code
- Code Blocks Add-ons for Google Doc
- markup.su Highlighter
- halite.me
- Github gist
-
Welcome to Writing.SE! Could you edit the relevant information from your blog post into your answer? Currently, a) this is little more than a spam ad for your blog, b) if, God forbid, something should happen to your blog, your answer will become useless.– F1Krazy ♦Commented Apr 24, 2020 at 14:58
-
Your link adds nothing to the rest of the answer, which is useful. Commented Apr 24, 2020 at 17:14