Shortcode markdown not rendering correctly

support
1

Sorry if this question is too basic, I have not been able to locate same question here or at Google

What I did is super simple, just 3 files

index.html file under layouts folder has this
{{ .Content }}

newshortcode.html sitting under layouts/shortcodes folder has this
{{ .Inner }}

And finally _index.md under content folder has the content below

---
title: "Home Page"
date: 2018-09-09T17:52:20+08:00
draft: true
---

{{% newshortcode %}}
**this is the text inside shortcode tags**
{{% /newshortcode %}}`

I would expect with using {{% I should see the text between those ** be bold, however I got
**this is the text inside shortcode tags**

And when I inspect this element at browser,
<pre><code>**this is the text inside shortcode tags**</code></pre> is what it rendered

Could anyone please advise what I did wrongly?

Many thanks

Calvin

2

First undraft your _index.md. Is the behavior still the same?

If yes, then please share a link to the source of your project.

3

https://github.com/calvinfu1128/shortcode-markdown

draft: false does not help

And I pasted the codes that I got, thanks

4

Now just a minute, you cannot have only {{ .Content }} in your index.html template and expect to get a valid HTML page in the browser.

Please have a look at the repository of the Ananke theme that is used in the Quick Start Guide to see how you need to structure your Hugo project templates for valid HTML.

5

Hi,

In addition to making sure you have valid HTML, you also need to be careful with spaces or indents in your content. I noticed your text is indented by 8 spaces; Markdown interprets 4-space indent as ‘this is a code block’.

2 Likes
6

Thanks @alexandros, I had my own theme in another hugo project that I created for learning purpose, markdown was not working and so I created a simple version for troubleshooting, but thanks for raising this up =)

7

thanks a lot @pointyfar, indentation is the cause, it is now working
newbie mistake =)

1 Like