How to center text?

Markdown doesn’t seem to support centering text on its own, so I believe that I have to use html. According to the documentation, this is best done using a shortcode. So I defined the following shortcode:

<p style="text-align: center;">{{.Inner}}</p>

And then I try to use it as follows:

{{% center %}}
*emphasized test*
{{% /center %}}

In the resulting html, I obtain <!-- raw HTML omitted -->. I gather that this is because by default the feature is disabled in goldmark. Therefore, I added the following to my config:

      unsafe = true

The resulting html is

<p style="text-align: center;">
*emphasized test*

Markdown is not processed (no new lines and no emphasized text). According to the shortcode documentation, using % instead of < as the shortcode symbol should process markdown. So I don’t know what I am doing wrong.

Any help is greatly appreciated! Thanks.

I haven’t tried this in a shortcode, but I have done something similar using HTML div tag wrapping around Markdown and using the Goldmark-version Hugo… Try putting a blank line above and below the Markdown you are trying to wrap, and may be use div tag instead of p tag.


Thank you @kaushalmodi, this works.

Here is the shortcode:

<div style="text-align: center;">

which outputs

<div style="text-align: center;">
<em>emphasized test</em></p>

Cool! But also show the Markdown content you typed to get that so that someone else who stumbles across the same can use that.

It’s given in the original post. I kept it the same.

Try to render a html file that is supported too. You can use pugjs in combination with hugo what I personally do also.

I think after the unsafe setting was turned off by default, your best bet is to create a shortcode that gets called as something that gets a raw string ({{<) and use markdownify within. So the shortcode would look like this:

<span class="text-center">{{ .Inner | markdownify }}</span>

Then you invoke the shortcode the following way, using {{< markdown tags:

{{< text-center >}}
Stuff to `process` in the *center*.

testing **123**

some other text
{{< /text-center >}}

This doesn’t need the unsafe setting set to true.

Or simpler, if you only inline elements (text and normal imgs):
put this in a css :

.center {

and use classs attributes on paragraphs:


The less we need shortcodes, the more portable, the cleaner and more easily written code imho.


CSS. This is literally what it was designed for.

A post was split to a new topic: Help with markdown attributes