# Is admonition available in Franklin.jl?

**URL:** <https://discourse.julialang.org/t/is-admonition-available-in-franklin-jl/77727>\
**Category:** General Usage\
**Tags:** question, franklin\
**Created:** [March 10, 2022, 10:48pm UTC](https://discourse.julialang.org/t/is-admonition-available-in-franklin-jl/77727 "2022-03-10T22:48:34Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Natsulait](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/natsulait/32/29357_2.png) [@Natsulait](https://discourse.julialang.org/u/Natsulait)\
**Post date:** [March 10, 2022, 10:48pm UTC](https://discourse.julialang.org/t/is-admonition-available-in-franklin-jl/77727/1 "2022-03-10T22:48:34Z")

</div>

I found that in Franklin’s website:

 ![Screenshot_20220311-074342](https://global.discourse-cdn.com/julialang/original/3X/f/5/f5b4847ee2ff334bd992b18bd4d6712973283e36.png)

I wonder how I can do this.

---

<div class="post-metadata">

**Author:** ![suavesito](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/suavesito/32/34386_2.png) [@suavesito](https://discourse.julialang.org/u/suavesito)\
**Post date:** [March 10, 2022, 11:01pm UTC](https://discourse.julialang.org/t/is-admonition-available-in-franklin-jl/77727/2 "2022-03-10T23:01:23Z")

</div>

I think is written as is on Julia Markdown

```julia
!!! Note
    Whatever you want to write on that.

```

---

<div class="post-metadata">

**Author:** ![Natsulait](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/natsulait/32/29357_2.png) [@Natsulait](https://discourse.julialang.org/u/Natsulait)\
**Post date:** [March 11, 2022, 12:24am UTC](https://discourse.julialang.org/t/is-admonition-available-in-franklin-jl/77727/3 "2022-03-11T00:24:44Z")

</div>

Thank you for your reply.  
I tried it, but it seemed not to work in Minimal Mistakes theme in Franklin.jl.  
May this possibly be due to CSS in the theme? I’m gonna try to what you suggest in another theme.

---

<div class="post-metadata">

**Author:** ![suavesito](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/suavesito/32/34386_2.png) [@suavesito](https://discourse.julialang.org/u/suavesito)\
**Post date:** [March 11, 2022, 12:28am UTC](https://discourse.julialang.org/t/is-admonition-available-in-franklin-jl/77727/4 "2022-03-11T00:28:22Z")

</div>

I really haven’t used Franklin, but may be useful for you to check [this page](https://tlienart.github.io/FranklinTemplates.jl/).

---

<div class="post-metadata">

**Author:** ![Natsulait](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/natsulait/32/29357_2.png) [@Natsulait](https://discourse.julialang.org/u/Natsulait)\
**Post date:** [March 11, 2022, 12:36am UTC](https://discourse.julialang.org/t/is-admonition-available-in-franklin-jl/77727/5 "2022-03-11T00:36:42Z")

</div>

I tried to insert the following lines in the “basic” template of franklin.jl

```julia
!!! note
    this is a note!

```

Then, I got:

 ![image](https://global.discourse-cdn.com/julialang/original/3X/f/f/ff3962c01c17431f66e9169ba5f078972fb8ebee.png)  
Seemingly, admonition does not work ☹

---

<div class="post-metadata">

**Author:** ![Sukera](https://avatars.discourse-cdn.com/v4/letter/s/ce7236/32.png) [@Sukera](https://discourse.julialang.org/u/Sukera)\
**Post date:** [March 11, 2022, 8:00am UTC](https://discourse.julialang.org/t/is-admonition-available-in-franklin-jl/77727/6 "2022-03-11T08:00:56Z")

</div>

Judging from the [source of the docs](https://github.com/tlienart/Franklin.jl/blob/master/docs/styling/templates.md#adapting-a-theme-to-franklin), seems the incantation is

```julia
\note{Text you want to show up in the note}

```

I believe this is done via a combination of [custom commands](https://franklinjl.org/syntax/utils/index.html) and [div classes](https://franklinjl.org/syntax/divs-commands/) to create CSS stylable `div` objects in the DOM with a given name. The style will probably depend on your theme (and if it supports that command in its style sheets).

---

<div class="post-metadata">

**Author:** ![tlienart](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/tlienart/32/7640_2.png) [@tlienart](https://discourse.julialang.org/u/tlienart)\
**Post date:** [March 11, 2022, 8:15am UTC](https://discourse.julialang.org/t/is-admonition-available-in-franklin-jl/77727/7 "2022-03-11T08:15:24Z")

</div>

That’s correct, so the full story is:

1. In your `config.md` you can define a `note` command like so:

```markdown
\newcommand{\note}[1]{@@note @@title ⚠ Note@@ @@content #1 @@ @@}

```

1. You can use it on a page as @Sukera mentioned so `\note{You could have ...}`
2. the `@@` things indicate div blocks, so the correspondingHTML will be

```nohighlight
<div class="note">
  <div class="title">⚠ Note</div>
  <div class="content">You could have...</div>
</div> 

```

To style this you have to specify the style of `.note`, `.note .title` and `.note .content` so for instance in the docs this is what is used:

```css
.note {
  margin-top: 1.5em;
  width: 95%;
  margin-left:auto;
  margin-right:auto;
  background-color: aliceblue;
  border-radius: 5px;
  margin-bottom: 1em;
}
.note .content {
  padding: 10px;
  padding-left: 12px;
}
.note .title{
  font-size: 105%;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  padding-left: 7px;
  padding-top: 2px;
  color: white;
  background: cornflowerblue;
}

```

---

<div class="post-metadata">

**Author:** ![Natsulait](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/natsulait/32/29357_2.png) [@Natsulait](https://discourse.julialang.org/u/Natsulait)\
**Post date:** [March 11, 2022, 1:13pm UTC](https://discourse.julialang.org/t/is-admonition-available-in-franklin-jl/77727/8 "2022-03-11T13:13:47Z")

</div>

It works perfectly 🙂 Thanks !  
 ![image](https://global.discourse-cdn.com/julialang/original/3X/1/3/1396c48338883a4fc3703fa3dfcb77815356f386.png)
