CoderJs
Coderjs is an amazing js wrapper around prismjs (code highlighter) that lets you easily embed multple codes in html. That's mean you can also use your code in your website.
Demo
You can see live demos below
demo1 - demo-html_css_js.html
demo2 - demo_desktop_languages.html
demo3 -
demo_php_blog.html
How to use (for community):
Just open Builder/Coder.html, Select your settings and Click Generate.
It will generate html code automatically at bottom.
You can embed this code in any site or play locally with any broswer.
How to use (for developers):
Step:1 (Put code with settings)
I am always use textarea for displaying codes,
Because it don't need to escape characters,
Currently, github don't allow running js,
So we can't show live demo here.
<textarea
language="javascript" <!-- Define your language -->
index="1" <!-- At which plote should code go ? -->
display="block" <!-- Should code be displayed ? -->
id="coderjs" <!-- Leave as it was. Wrapper will deal with it -->
>
//You can embed any type of code here
//For example, I am using javascript
document.write("Hello World");
</textarea>
*language
Define name of language which you will put as code in textarea, Currently, these languages are suppoerted,
At a time, only language allowed for 1 textarea.
Example: language="vbnet" , language="csharp" , language="cpp" , language="python"
*Index
Define plot number where code should be embed,
Let's suppose I have 3 code snippets,
I want to show them all in one place with tabs,
When specific tab pressed then specific language should be shown at a time,
So I will have to give same plot number to all of them.
Example: index="0" , index="4" , index="5" , index="8"
*Display
Define that should your code be visible at startup.
Example: display="none" , display="block"
*ID
id="coderjs" should remain as it was,
It is for wrapper only, Wrapper will automatically detect textareas with id coderjs.
Step:2 (Put script with settings)
Add this code at the end of page.
<script src="https://raw.githack.com/DarkSecDevelopers/CoderJs/master/Codes/script.min.js"></script> <script> //Choose your theme SetTheme("-okaidia"); //SetTheme("-solarizedlight"); //SetTheme("-coy"); //SetTheme("-dark"); //SetTheme("-funky"); //SetTheme("-tomorrow"); //SetTheme("-twilight"); //SetTheme(""); //Default theme//Should tab be displayed ? //Yes = true and No = false ShowTabs = true; //true or false
//Don't touch, Leave as it was. window.onload = StartAction(); </script>
Contact me:
Please don't waste time in hello,hi. Just tell what you need or want.
- Facebook: gray.programmerz.5
- Email: hackrefisher@gmail.com
- Website: tiplava
