Google Blogger with markdown

Google Blogger with markdown

I tried to write blogger with markdown, but there is no plugin could support markdown directly. Somebody suggests embedded some javascript code that will convert markdown to html dynamically in browser. 

1. Here is one of the browser dynamic markdown convert solution.  Add the following code to your blogger layout -> javascript / html tool. For full details you could check here.

<script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/1.9.1/showdown.min.js"></script>

<script>

var showdownOption = {
  'simplifiedAutoLink': true,
  'strikethrough': true,
  'tables': true,
  'tasklists': true
}

var converter = new showdown.Converter(showdownOption);

var posts = document.querySelectorAll(".post-body");

Array.prototype.forEach.call(posts, function (el, i) {
  var idx = el.innerHTML.indexOf("markdown");
  if (idx != -1 && idx <= 1) {
    let md = el.innerHTML
      .replace(/\n&amp;gt;/g, '\n>')  // fix quotes
      .replace("markdown", "");   // remove flag

    el.innerHTML = converter.makeHtml(md)
      .replace(/&amp;amp;/g, "&amp;"); // remove redundant escape
  }
});

</script>

<link href="https://cdn.jsdelivr.net/npm/prismjs@1.20.0/themes/prism-tomorrow.css" rel="stylesheet"></link>
<script src="https://cdn.jsdelivr.net/npm/prismjs@1.20.0/components/prism-core.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/prismjs@1.20.0/plugins/autoloader/prism-autoloader.min.js"></script>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

This works somehow, but not that prefect I really want. 

Think of the markdown text will be converted to html code finally, why not just post the html code to the blogger instead? May be I could use some tool to convert markdown text to html locally, then copy those converted html code and paste to the blogger.  So I got another solution.

2. Set up a local blogger with vitepress. And write doc with vitepress, then post the generated html to blogger.  After some css style modify, it works ok. The result is what you see of this page. 

With such method, there is a bit more work  to do. That means I need to edit two times for every one blog. Maybe the second process could be done automatically with some python code and blogger open API. 

By the way, I am not a markdown fan, but I like to use it. Because markdown will make the writing process much easier and some code snippet well formated.