# Multiple Markdown-text-sections

**URL:** <https://discourse.gohugo.io/t/multiple-markdown-text-sections/4238>\
**Category:** support\
**Created:** [October 5, 2016, 7:53am UTC](https://discourse.gohugo.io/t/multiple-markdown-text-sections/4238 "2016-10-05T07:53:03Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![halloalexkern](https://avatars.discourse-cdn.com/v4/letter/h/2bfe46/32.png) [@halloalexkern](https://discourse.gohugo.io/u/halloalexkern)\
**Post date:** [October 5, 2016, 7:53am UTC](https://discourse.gohugo.io/t/multiple-markdown-text-sections/4238/1 "2016-10-05T07:53:04Z")

</div>

I’d like to get multiple divs containing Markdown in a single post for a multi-column-post-layout.

e.g. in [post1.md](http://post1.md) --\>

```
+++
title ="post1"

+++
#Headline 1
Text 1

+++
#Headline 2
Text 2

```

in layout --\>  
…  
\< div \>  
{{.Content[1]}} --\> renders Headline 1 and Text 1  
\< /div \>  
\< div \>  
{{.Content[2]}} --\> renders Headline 2 and Text 2  
\< \div \>  
…

Well i could wrap parts before/after \< hr \> with javascript… but that wouldn’t be very nice…

Unfortunately i couldn’t find anything about this “basic?” use-case or i was searching for the wrong things.

Thanks!!

🙂 AK

---

<div class="post-metadata">

**Author:** ![bep](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/bep/32/3332_2.png) [@bep](https://discourse.gohugo.io/u/bep)\
**Post date:** [October 5, 2016, 3:15pm UTC](https://discourse.gohugo.io/t/multiple-markdown-text-sections/4238/2 "2016-10-05T15:15:46Z")

</div>

[http://www.w3schools.com/css/css3\_multiple\_columns.asp](http://www.w3schools.com/css/css3_multiple_columns.asp)

---

<div class="post-metadata">

**Author:** ![halloalexkern](https://avatars.discourse-cdn.com/v4/letter/h/2bfe46/32.png) [@halloalexkern](https://discourse.gohugo.io/u/halloalexkern)\
**Post date:** [October 5, 2016, 5:49pm UTC](https://discourse.gohugo.io/t/multiple-markdown-text-sections/4238/3 "2016-10-05T17:49:01Z")

</div>

[http://caniuse.com/#feat=multicolumn](http://caniuse.com/#feat=multicolumn)

support is buggy… AND i want the text to break at a specific point. So its more two texts…  
🙂 AK

---

<div class="post-metadata">

**Author:** ![bep](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/bep/32/3332_2.png) [@bep](https://discourse.gohugo.io/u/bep)\
**Post date:** [October 5, 2016, 8:54pm UTC](https://discourse.gohugo.io/t/multiple-markdown-text-sections/4238/4 "2016-10-05T20:54:57Z")

</div>

There is an open issue or two about content sections on GitHub, but I wouldn’t be too hopeful about that getting solved anytime soon.

In the meantime …

- You solve this by being creative with shortcodes with your divs.
- Or maybe put the columns in to a markdown table …

---

<div class="post-metadata">

**Author:** ![rdwatters](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/rdwatters/32/2848_2.png) [@rdwatters](https://discourse.gohugo.io/u/rdwatters)\
**Post date:** [October 5, 2016, 10:09pm UTC](https://discourse.gohugo.io/t/multiple-markdown-text-sections/4238/5 "2016-10-05T22:09:17Z")

</div>

@halloalexkern

I think I’d need to see what you’re trying to do, but if the content in one section is only headings, you could get clever with the front matter as well. Or you could do something with .Next or . Prev maybe…?

---

<div class="post-metadata">

**Author:** ![digitalcraftsman](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/digitalcraftsman/32/4142_2.png) [@digitalcraftsman](https://discourse.gohugo.io/u/digitalcraftsman)\
**Post date:** [October 6, 2016, 4:28pm UTC](https://discourse.gohugo.io/t/multiple-markdown-text-sections/4238/6 "2016-10-06T16:28:42Z")

</div>

You could use the `split` template function. Just insert a custom delimiter in the content files at each point where the content should continue in the next column.

Your code would look as follows. I have not tested it but you should get at least a foundation. `<split>` is our custom delimiter.

```auto
{{ $cols := split .Content "<split>" }}

{{ range $cols }}
   <div class="content-column">
   {{ . }}
   </div>
{{ end }}

```

---

<div class="post-metadata">

**Author:** ![rdwatters](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/rdwatters/32/2848_2.png) [@rdwatters](https://discourse.gohugo.io/u/rdwatters)\
**Post date:** [October 6, 2016, 4:58pm UTC](https://discourse.gohugo.io/t/multiple-markdown-text-sections/4238/7 "2016-10-06T16:58:55Z")

</div>

@digitalcraftsman That is _awesome_ and something I never would have thought of.

---

<div class="post-metadata">

**Author:** ![halloalexkern](https://avatars.discourse-cdn.com/v4/letter/h/2bfe46/32.png) [@halloalexkern](https://discourse.gohugo.io/u/halloalexkern)\
**Post date:** [October 6, 2016, 8:04pm UTC](https://discourse.gohugo.io/t/multiple-markdown-text-sections/4238/8 "2016-10-06T20:04:38Z")

</div>

@digitalcraftsman Wow, that seems to be thing i was looking for! I’ll going to try it soon and report back. Thanks!! 🙂

---

<div class="post-metadata">

**Author:** ![elJefe](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/eljefe/32/4487_2.png) [@elJefe](https://discourse.gohugo.io/u/elJefe)\
**Post date:** [November 2, 2017, 8:39pm UTC](https://discourse.gohugo.io/t/multiple-markdown-text-sections/4238/9 "2017-11-02T20:39:07Z")

</div>

Hey

I found this post when searching for a a way to place an image next to text (in a two colomn way), and it helpt me achieve this by creating a partial like this:

```auto
{{ $cols := split .RawContent "||" }}

{{ range $cols }}
   <div class="content-column">
   {{ . | markdownify }}
   </div>
{{ end }}

```

thanks @digitalcraftsman

---

<div class="post-metadata">

**Author:** ![batpigandme](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/batpigandme/32/5603_2.png) [@batpigandme](https://discourse.gohugo.io/u/batpigandme)\
**Post date:** [June 23, 2018, 4:23pm UTC](https://discourse.gohugo.io/t/multiple-markdown-text-sections/4238/10 "2018-06-23T16:23:25Z")

</div>

Trying to do the same thing now, do you have a link to your blog so I can take a look at the implementation? Thanks!