# Question about using shortcodes on Jekyll

**URL:** <https://talk.jekyllrb.com/t/question-about-using-shortcodes-on-jekyll/3737>\
**Category:** Help\
**Created:** [December 26, 2019, 5:01pm UTC](https://talk.jekyllrb.com/t/question-about-using-shortcodes-on-jekyll/3737 "2019-12-26T17:01:35Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![miracleofweb](https://avatars.discourse-cdn.com/v4/letter/m/cdc98d/32.png) [@miracleofweb](https://talk.jekyllrb.com/u/miracleofweb)\
**Post date:** [December 26, 2019, 5:01pm UTC](https://talk.jekyllrb.com/t/question-about-using-shortcodes-on-jekyll/3737/1 "2019-12-26T17:01:35Z")

</div>

Hello!

I want to create several shortcodes for my website. Before I researching and found this topic: [Are there short-codes in Jekyll?](https://talk.jekyllrb.com/t/are-there-short-codes-in-jekyll/2910/3)

I can create `/includes/someShortcode.html` file. Then pass some content to the included file: `{% include someShortcode.html content="Some Shortcode Content" %}`

But if I want to display several paragraphs, headlines into my shortcode content. How I can do that?

I should do something like this?

`{% include alert.html content=" \<p>Paragraph</p> \<h2>Headline</h2> " %}`

It’s correct way? And what, if my content into a shortcode so big? Write HTML-tags without spaces so hard.

And can I use markdown into includes content instead of HTML-tags?

---

<div class="post-metadata">

**Author:** ![rdyar](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/rdyar/32/710_2.png) [@rdyar](https://talk.jekyllrb.com/u/rdyar)\
**Post date:** [December 27, 2019, 3:14am UTC](https://talk.jekyllrb.com/t/question-about-using-shortcodes-on-jekyll/3737/2 "2019-12-27T03:14:57Z")

</div>

> [@miracleofweb](#):
>
> if I want to display several paragraphs

that is not so short.

You could just make an include with all that info in it and use that without passing the data to it. I do that where I need to use the same alert type thing on multiple pages.

I think you can do a little trick to have markdown work in an include:

```auto
{% capture myinclude %}{% include amarkdownfile.md %}{% endcapture %}
{{ myinclude | markdownify } }

```

---

<div class="post-metadata">

**Author:** ![miracleofweb](https://avatars.discourse-cdn.com/v4/letter/m/cdc98d/32.png) [@miracleofweb](https://talk.jekyllrb.com/u/miracleofweb)\
**Post date:** [December 28, 2019, 7:10am UTC](https://talk.jekyllrb.com/t/question-about-using-shortcodes-on-jekyll/3737/3 "2019-12-28T07:10:48Z")

</div>

Thank you for the answer, but that’s not what I want.

> You could just make include with all that info in it and use that without passing the data to it. I do that where I need to use the same alert type thing on multiple pages.

Yes, if I want to display a single text (block) on the difference pages, I could do that.

But in my case, I want to display introducing block for each post. Here is a screenshot, what I mean: [Screenshot by Lightshot](https://prnt.sc/qgpsdc). Every article will have a introducing block, there will be custom Headline, description and image. How I can do something like that with shortcodes? Please, rdyar, give me advice.

---

<div class="post-metadata">

**Author:** ![rdyar](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/rdyar/32/710_2.png) [@rdyar](https://talk.jekyllrb.com/u/rdyar)\
**Post date:** [December 28, 2019, 5:11pm UTC](https://talk.jekyllrb.com/t/question-about-using-shortcodes-on-jekyll/3737/4 "2019-12-28T17:11:28Z")

</div>

if all that is custom why do you want a shortcode type thing? why not just put it in the post?

You could also use a data file if every post is going to have that same format - you can have fields of:

- post short name (or maybe just use the actual name)
- title
- image
- description

then in the posts front matter you put the post short name, then you test if that is which page it is and then loop thru the items to fill out the section.

For repetitive things that are identical in format but not content data files can work really well.

For your example if there were going to be more than a dozen or so posts with that same exact format I would do it with a data file.

---

<div class="post-metadata">

**Author:** ![mmistakes](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/mmistakes/32/2169_2.png) [@mmistakes](https://talk.jekyllrb.com/u/mmistakes)\
**Post date:** [December 28, 2019, 6:34pm UTC](https://talk.jekyllrb.com/t/question-about-using-shortcodes-on-jekyll/3737/5 "2019-12-28T18:34:27Z")

</div>

I think you’re over complicating things.  
If all you’re trying to do is add an intro block to each post then add that logic to your layout and then add any custom fields as YAML front matter.

```auto
---
custom_headline: Your custom headline
image: path-to-your-image.jpg
description: your description
---

```

Then pull those into the page like any other liquid variable

```auto
<div class="intro">
  <h2>{{ page.custom_headline }}</h2>
  <p>{{ page.description }}</p>
  <img src="{{ page.image }}" alt="">
</div>

```

---

<div class="post-metadata">

**Author:** ![rdyar](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/rdyar/32/710_2.png) [@rdyar](https://talk.jekyllrb.com/u/rdyar)\
**Post date:** [December 28, 2019, 8:00pm UTC](https://talk.jekyllrb.com/t/question-about-using-shortcodes-on-jekyll/3737/6 "2019-12-28T20:00:24Z")

</div>

yeah, that is a better idea than mine. I did something like this in a data file and it is nice to have it all in one place, but then when I go to edit something on a particular page it isn’t there cause it is in the data file.

---

<div class="post-metadata">

**Author:** ![miracleofweb](https://avatars.discourse-cdn.com/v4/letter/m/cdc98d/32.png) [@miracleofweb](https://talk.jekyllrb.com/u/miracleofweb)\
**Post date:** [December 28, 2019, 8:36pm UTC](https://talk.jekyllrb.com/t/question-about-using-shortcodes-on-jekyll/3737/7 "2019-12-28T20:36:11Z")

</div>

Thank you for the answer!

But in description on Front Matter I can write several paragraphs (\<p), lists (ol\>li or ul\>lI) and something else?

And you right, that it’s bit over complicating. I think the best way is just put a HTML-block code in the markdown posts, then just write intro block content inside.

---

<div class="post-metadata">

**Author:** ![mmistakes](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/mmistakes/32/2169_2.png) [@mmistakes](https://talk.jekyllrb.com/u/mmistakes)\
**Post date:** [December 28, 2019, 11:36pm UTC](https://talk.jekyllrb.com/t/question-about-using-shortcodes-on-jekyll/3737/8 "2019-12-28T23:36:44Z")

</div>

Yes you can write multiple lines in the front matter. Take a look at the [YAML spec](https://yaml.org/spec/1.2/spec.html#id2760844)

If you use a `>` you can write multiline content. Along with Jekyll’s `markdownify` filter you can convert it into HTML.

Example

```auto
---
custom_variable: >
  This will be a paragraph.

  This will be another paragraph.

```

`{{ custom_variable | markownify }}` will then be converted into:

```auto
<p>This will be a paragraph.</p>
<p>This will be another paragraph.</p>

```

---

<div class="post-metadata">

**Author:** ![miracleofweb](https://avatars.discourse-cdn.com/v4/letter/m/cdc98d/32.png) [@miracleofweb](https://talk.jekyllrb.com/u/miracleofweb)\
**Post date:** [December 29, 2019, 12:27am UTC](https://talk.jekyllrb.com/t/question-about-using-shortcodes-on-jekyll/3737/9 "2019-12-29T00:27:35Z")

</div>

Thank you, mmistakes! It’s seems what I need.

Your advices is very helpful for me. Thank you again!

I try it, it’s very convenient to my case.