javascript - How to output CKEditor code snippets with matching styles -

i have question ckeditor... first have say, searched on 3 hours , don't know, if i'm bad or why found nothing... i'm searching way, how output ckeditor-text right styles and added syntax-highlighter-plugin (code snippet) want right styles...

can me, how format right styles?

input:

output:

code:

<h1>hello world!</h1> <p>i&#39;m instance of <a href="http://ckeditor.com">ckeditor</a>.</p> <pre>    <code class="language-javascript">       var = "test";       alert(i);    </code> </pre> 

it's bit funny said you've been looking answer 3 hours explained right in official documentation feature. makes sense check docs, :)

target page

to see highlighter styles on target page ckeditor content displayed, need load highlight.js script , theme's stylesheet on page. can either reuse copy of highlight.js placed in ckeditor/plugins/codesnippet/lib/highlight directory or download own copy highlight.js download page. (...)

read more details , grab code here: http://docs.ckeditor.com/#!/guide/dev_codesnippet-section-target-page