---
title: Kilpse Blogging
url: https://www.grahambrooks.com/post/2021-09-11-kilpse-bloging/
date: 2021-09-11T00:00:00+00:00
author: Graham Brooks
tags:
- Go
- Writing
---

# Kilpse Blogging

Interactive web applications are always more appealing than static sites. This blog explores using the [klipse](https://github.com/viebel/klipse) plugin to add interactive code snippets to this blog.

Very often seeing the output of running code is key. I was really excited when <http://lighttable.com> became available . It seems to be a very quiet project these days but the output and value of variables while working on the code is really exciting - especially when writing unit tests. The RED/GREEN refactor loop running as you type is a real boost

Adding a code block to Jekyll blog using asciidoc

Asciidoc source code block  
``` go
[code.language-klipse-go] # ①
---- # ②
import "fmt"

func main() {
fmt.Println("Hello all!")
}
---- # ③
```

<div class="callout-list">

1.  Declare a code block with a language-klipse-go CSS class

2.  Start of the code block

3.  Terminate the code block

</div>

When run through asciidoctor it renders like this and is editable!!

``` klipse-go
import "fmt"

func main() {
  fmt.Println("Hello all!")
}
```

To activate the code to be interactive and run in the browser in the plugin we need to include the plugin CSS and JavaScript Asciidoc allows us to use a passthrough block that we add to the article to include the bits we need.

``` html
++++
<link rel="stylesheet" type="text/css" href="https://storage.googleapis.com/app.klipse.tech/css/codemirror.css">

<script>
window.klipse_settings = {
    selector_golang: '.language-klipse-go',
};
</script>
<script src="https://storage.googleapis.com/app.klipse.tech/plugin_prod/js/klipse_plugin.min.js"></script>
++++
```

# A more elaborate example

A more elaborate example importing a library.

At the time of writing imports are not supported beyond the standard libraries. If you don’t see an error then it means that imports are now supported and please drop me a line.

``` klipse-go
import (
    "fmt"
    "github.com/grahambrooks/fingerprint/fingerprinter"
)

func main() {
    options := fingerprinter.Options{
        GuaranteeThreshold: 4,
        NoiseThreshold:     4,
    }

    fingerprint := fingerprinter.TextFingerprint("Some text as a source for the fingerprint", options)

    fmt.Println(fingerprint)
}
```

<link rel="stylesheet" type="text/css" href="https://storage.googleapis.com/app.klipse.tech/css/codemirror.css">
<script>
window.klipse_settings = {
    selector_golang: '.language-klipse-go',
};
</script>

<script src="https://storage.googleapis.com/app.klipse.tech/plugin_prod/js/klipse_plugin.min.js"></script>