How to Display Code as Code in a Browser

How do you format code to look like code in browsers? How to get monospacing, styling, and syntax highlight to display on a website in any language. I'll show you how in this video and include steps in the description below.

Komodo is one of the best Editors/IDE's for Ruby programming. If you already have an editor, I recommend trying out Komodo. I've tried all the others and I still came back to Komodo.

This is important for when you're sharing code on your own blog or website. You need to be able to share your sample code while still allowing the using to highlight the text.

Here's the code:

Put this script (with script tags) inside your head tags:

Make sure to include the opening and closing script src= tags like I show in the video. (YouTube doesn't allow me to include brackets in this description field.)

Wrap your code in this(Don't forget the brackets):

pre class="prettyprint"

Here's the standard prettify script skin names:
default, desert, sunburst, sons-of-obsidian, doxy

See what each skin/theme looks like here:

Prettify Github page:

Prettify Getting Starting page:

Bonus video: Carlos Garcia talk at DevPoint Labs about why he loves Ruby:

[segsfault]

that's what i was lookin for man, thanks for helping this poor coder,
big love from india

[leandrodossantos]

Hey Jake!!
Keep up the good work man!!
You really help people like me a lot on the internet with ruby or programming in general.
:)

[manjeetkumar]

This was exactly what i was looking for. Description is crisp & clear. Thanks Jake :)

[cr]

THANKS A LOT this is 2020
now, I can build my SQL portfolio with this code :)

[wawwaw]

thank you so much, I found this prettify but no idea how to use it before watching ur tutorial

[shahabjoon]

hey man, that was perfect, thanks for sharing

[adamashyraff]

thank u bro.
it helps me alot on the current task am handling.
may god bless u man

[danielcavalcante]

I think they updated the way you can put the line numbers.
Here is the new way to do this:
<pre class="prettyprint linenums:4"
>

(You can choose any number you want - not just 4 haha)

[magmaera]

hey jake ive recently got into coding. I want to learn about app devolopment such as messenging apps. What do you suggest i start with.

[rickhernandez]

So was it worth it? The bootcamp? I would love to hear about your experience, cost, effort in difficulty, and if it encouraged you to do more entrepreneurial ventures or seek a job.

[execode]

i used the default stylizing.
but there is a black border around the code snippet
how can i remove that.
please help me

[bhavikkhawale]

nice tecnique to reach the 10 min mark