support plantuml

Signed-off-by: zhaohuabing <zhaohuabing@gmail.com>

3 files changed, 43 insertions, 0 deletions

diff --git a/README.md b/README.md
index d01ed64..8b90996 100644
--- a/README.md
+++ b/README.md
@@ -243,6 +243,33 @@ Vimeo
 {{< vimeo 146022717 >}}

 ```

 

+### Plantuml

+

+Plantuml support can be enabled at site or page level by adding the following line in the config.yaml or page header.

+

+```

+plantuml: true

+```

+

+Then you can just put plantuml source code in markdown files and the picture will be generated automatically.

+

+An example:

+

+```

+```plantuml

+@startuml

+Alice -> Bob: Authentication Request

+Bob --> Alice: Authentication Response

+

+Alice -> Bob: Another authentication Request

+Alice <-- Bob: Another authentication Response

+@enduml

+```

+```

+

+![screenshot](https://raw.githubusercontent.com/zhaohuabing/hugo-theme-cleanwhite/master/images/plantuml.png)

+

+

 ## Thanks

 Thanks for the great jobs of [huxblog Jekyll Theme](https://github.com/Huxpro/huxpro.github.io) and [Clean Blog Jekyll Theme](https://github.com/BlackrockDigital/startbootstrap-clean-blog-jekyll) which are the the two upstream projects CleanWhite Hugo theme is based on.

 

diff --git a/images/plantuml.png b/images/plantuml.png
new file mode 100644
index 0000000..4158771
--- /dev/null
+++ b/images/plantuml.png
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index f061726..281587e 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -430,3 +430,19 @@
 </script>
 {{ end }}
 
+{{ if or .Page.Params.plantuml .Site.Params.plantuml }}
+<!-- PlantUML -->
+<script src="https://cdn.jsdelivr.net/gh/jmnote/plantuml-encoder@1.2.4/dist/plantuml-encoder.min.js" integrity="sha256-Qsk2KRBCN5qVZX7B+8+2IvQl1Aqc723qV1tBCQaVoqo=" crossorigin="anonymous"></script>
+<script>
+(function(){
+  let plantumlPrefix = "language-plantuml";
+  Array.prototype.forEach.call(document.querySelectorAll("[class^=" + plantumlPrefix + "]"), function(code){
+    let image = document.createElement("IMG");
+    image.loading = 'lazy'; // Lazy loading
+    image.src = 'http://www.plantuml.com/plantuml/svg/~1' + plantumlEncoder.encode(code.innerText);
+    code.parentNode.parentNode.insertBefore(image, code.parentNode);
+    code.parentNode.style.display = 'none';
+  });
+})();
+</script>
+{{ end }}