quapka
quapka

Reputation: 2929

How to implement syntax highlighting?

I am making a website portfolio for one of my school project. Our task is to write some code (lets say in Python) which produces mostly images. Then we have to put those images on our website and add the code which produced them.

Now I just put the image on the webpage and add a link to github.com to access the code, but I would like to make better.

I am mostly coding in Sublime Text and I think the color schemes they use are pretty and helpful. I would like to somehow get the highlighted code from Sublime to view it on the webpage. It might look alike on the github.com, but without linking it. I want it actually on my web. If it can be done I think there might be two ways:

  1. Get the code from Sublime and somehow put it highlighted on the web
  2. Using probably textarea tags in html and some Javascript to recognise the language.

If it's not clear, my question is: Is it possible to achieve the behaviour described above? If so, how?

Upvotes: 0

Views: 304

Answers (2)

MattDMo
MattDMo

Reputation: 102842

Check out the ExportHtml plugin available through Package Control. Once installed, right-click in your document, then select Export -> HTML -> Sublime View: Color and a new tab will be opened with the HTML in it. You can set the color scheme you wish to use in the preferences. I'll warn you that the generated HTML is pretty ugly, but you can just copy and paste into your web page, ensuring that you bring the JavaScript and CSS along with it.

Upvotes: 2

onsy
onsy

Reputation: 750

try Ace Editor

Ace is an embeddable code editor written in JavaScript. It matches the features and performance of native editors such as Sublime, Vim and TextMate. It can be easily embedded in any web page and JavaScript application. Ace is maintained as the primary editor for Cloud9 IDE and is the successor of the Mozilla Skywriter (Bespin) project.

Upvotes: 1

Related Questions