JSPWiki: Showdown Behavior

To install this JPSWiki extension, you will need Admin rights; and have the Haddock Template activated.

Showdown Behavior is a JSPWiki javascript extension which allows to render pages written in showdown

Showdown was created by John Fraser as a direct port of the original parser written by markdown's creator, John Gruber. Although Showdown has evolved since its inception, in "vanilla mode", it tries to follow the original markdown spec

(henceforth refereed as vanilla) as much as possible. There are, however, a few important differences, mainly due to inconsistencies in the original spec.

Showdown also support "extra" syntax not defined in the original spec as opt-in features. See Showdown's Markdown syntax

It is based on Javascript Markdown to HTML converter on GITHUB

, based on the original works by John Gruber. See Showdown Test Page for an example rendered Showdown page.

How to use `%%showdown`#

%%showdown
{{{
### Hi, now you can include **showdown** in JSPWiki!
}}}
/%

### Hi, now you can include **showdown** in JSPWiki!

How to install the Showdown extension#

Step 2: Create a JS behavior file#

Create a javascript behavior file Wiki.Behavior.Showdown.js with the following code snippet and save it in <your-wiki-site>/scripts folder.
This script will automatically load and invoke the showdown parser in your browser when it detects %%showdown. It uses the CDN at https://cdnjs.cloudflare.com/ajax/libs/showdown/1.8.6/showdown.min.js

.wrap-pre pre, .wrap-pre .prettyprint { white-space:pre-wrap; }

!function(a,b,c){function d(b){var c=new showdown.Converter({headerLevelStart:2,strikethrough:!0,tables:!0,tasklists:!0,emoji:!0}),d="div".slick();d.innerHTML=c.makeHtml(b.textContent),d.replaces(b),d.getElements("table").addClass("table-fit table-condensed table-bordered"),d.getElements("pre > code[class|=lang] ").each(function(a){a.getParent().addClass("prettify-nonum")});var e=a.PageName.replace(/\s/g,"+");d.getElements("h2,h3,h4,h5,h6").each(function(a){a.id="section-"+e+"-"+a.innerText.replace(/[^\w]+/g,""),a.grab("a.hashlink".slick({href:"#"+a.id,text:"#"}))}),d.getElements("a[href^=http://],a[href^=https://]").addClass("external"),d.getElements("a[class!=wikipage][class!=hashlink][class!=external]").each(function(b){b.href=a.toUrl(b.href.replace(/^.+\//,"").replace(/%20/g," ")),b.addClass("wikipage")}),d.getElements("img:not([src^=http://]):not([src^=https://])").each(function(b){b.src=a.BaseUrl+"/attach/"+b.src.replace(/^.+\/(.+\/)/,"$1").replace(/%20/g," "),b.addClass("inline")})}a.once(c,function(){"script".slick({src:b,events:{load:function(b){$$(c+" pre").each(d),a.update()} }}).inject(document.head)})}(Wiki,"https://cdnjs.cloudflare.com/ajax/libs/showdown/1.8.6/showdown.min.js",".showdown")

Step 2: Update JSP files#

Add following lines to <your-wiki-site>/templates/haddock/commonheader.jsp.

  <!-- existing line -->
  <script async src="<wiki:Link format='url' jsp='scripts/haddock.js'/>"></script>
  <!-- add this line -->
  <script src="<wiki:Link format='url' jsp='scripts/Wiki.Behavior.Showdown.js'/>" ></script>

And do the same in <your-wiki-site>/templates/reader/ViewTemplate.js.

Voila! You can now use showdown from your wiki-pages !
No need to restart your JSPWiki server.

See Category.Haddock Behavior, Markdown Behavior

How to use %%showdown#

How to install the Showdown extension#

Step 2: Create a JS behavior file#

Step 2: Update JSP files#

How to use `%%showdown`#