Wiki

Clone wiki

atlassian-plugins / Code Snippet - Run HTML, CSS and JS

Code Snippet - Run HTML, CSS and JS

This is documentation for Code Snippet - Run HTML, CSS and JS.

Documentation

To add Code Snippet, click "+" (insert more content), choose "Other Macros" then "Visuals & images" category. Then select Code Snippet.

Formatting Code Snippet

This is Code Snippet template:

#!html

<!-- begin snippet -->

<!-- language: lang-js -->
// Here goes JavaScript

<!-- language: lang-css -->
// Here goes CSS

<!-- language: lang-html -->
// Here goes HTML

<!-- end snippet -->

Example:

#!html
<!-- begin snippet -->

<!-- language: lang-js -->
$('p').text('World !');

<!-- language: lang-css -->
body { background: tomato; }

<!-- language: lang-html -->
<h1> Hello </h1>
<p> [Test] </p>

<!-- load jquery -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js">

<!-- end snippet -->

Scripts included in HTML section (<!-- language: lang-html -->) are loaded first then JavaScript from <!-- language: lang-js --> is executed.

Updated