diff --git a/src/core/render/compiler.js b/src/core/render/compiler.js
index ff74711a3..6973de2b9 100644
--- a/src/core/render/compiler.js
+++ b/src/core/render/compiler.js
@@ -82,6 +82,7 @@ export class Compiler {
     this.contentBase = router.getBasePath()
 
     const renderer = this._initRenderer()
+    this.heading = renderer.heading
     let compile
     const mdConf = config.markdown || {}
 
@@ -403,6 +404,10 @@ export class Compiler {
     return treeTpl(tree)
   }
 
+  header(text, level) {
+    return this.heading(text, level)
+  }
+
   article(text) {
     return this.compile(text)
   }
diff --git a/src/core/render/index.js b/src/core/render/index.js
index 5df3c4cd5..cead7ba0b 100644
--- a/src/core/render/index.js
+++ b/src/core/render/index.js
@@ -117,9 +117,9 @@ export function renderMixin(proto) {
       const main = dom.getNode('#main')
       const firstNode = main.children[0]
       if (firstNode && firstNode.tagName !== 'H1') {
-        const h1 = dom.create('h1')
-        h1.innerText = activeEl.innerText
-        dom.before(main, h1)
+        const h1 = this.compiler.header(activeEl.innerText, 1)
+        const wrapper = dom.create('div', h1)
+        dom.before(main, wrapper.children[0])
       }
     }