# Intro & TIP: How to Create a Markdown Accordian to Show/Hide Stuff

**URL:** https://community.glideapps.com/t/intro-tip-how-to-create-a-markdown-accordian-to-show-hide-stuff/2250
**Category:** Ask for Help
**Created:** [November 21, 2019, 6:43pm UTC](https://community.glideapps.com/t/intro-tip-how-to-create-a-markdown-accordian-to-show-hide-stuff/2250 "2019-11-21T18:43:31Z")
**Posts on this page:** 11
**Page:** 1

<div class="post-metadata">

### Author: ![Jaybird\_Farrow](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jaybird_farrow/32/135_2.png) [@Jaybird\_Farrow](https://community.glideapps.com/u/Jaybird_Farrow)
#### Post date: [November 21, 2019, 6:43pm UTC](https://community.glideapps.com/t/intro-tip-how-to-create-a-markdown-accordian-to-show-hide-stuff/2250/1 "2019-11-21T18:43:32Z")

</div>

My first post here on the new community

Hi…  
I’m Justin  
I love Glide. i just crossed 80 apps in my dashboard…all experiments and [cool stuff for one of my communities to use](https://landsurveyorsunited.com/apps) Eventually I will go pro with the best parts of apps the community is using the most… I [also encourage other community creators](https://creators.ning.com/members/JFarrow) to use Glide

My tip for you today is how to create a cell inside a Details Layout which holds a SHOW/HIDE accordian style dropdown using Markdown and a Rich Text module. Like so:

 ![markdown-accordian](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/2X/4/4568bc97ddff2d6335d244f1d690fe21372f3982.gif)

## collapsible markdown?

> **CLICK ME**
>
> #### yes, even hidden code blocks!
> 
> ```python
> print("hello world!")
> 
> ```

I hope this is helpful to some of you out there.. hope the code comes through ok…first time on Discourse..

---

<div class="post-metadata">

### Author: ![Jaybird\_Farrow](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jaybird_farrow/32/135_2.png) [@Jaybird\_Farrow](https://community.glideapps.com/u/Jaybird_Farrow)
#### Post date: [November 21, 2019, 6:44pm UTC](https://community.glideapps.com/t/intro-tip-how-to-create-a-markdown-accordian-to-show-hide-stuff/2250/2 "2019-11-21T18:44:33Z")

</div>

Here is a [link to the pen with the code](https://codepen.io/JFarrow/details/gOOEGGr) you need…

---

<div class="post-metadata">

### Author: ![NataliaGo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/nataliago/32/1317_2.png) [@NataliaGo](https://community.glideapps.com/u/NataliaGo)
#### Post date: [November 21, 2019, 7:16pm UTC](https://community.glideapps.com/t/intro-tip-how-to-create-a-markdown-accordian-to-show-hide-stuff/2250/3 "2019-11-21T19:16:07Z")

</div>

Awesome stuff @Jaybird_Farrow 😀 thanks for sharing, I didn’t understand how to use your code pen, so simply googled it, Here is a code if somebody is interested how to reproduce it.  
**NB:** Make sure you have an **empty line** after the closing `</summary>` tag.

**NB** : Make sure you have an **empty line** after the closing `</details>` tag if you have multiple collapsible sections.

 ![com-gif-maker](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/2X/5/57e1fc7234f56278dee926809120c42f2a8848e8.gif)

```
    # A collapsible section with markdown
<details>
  <summary>Click to expand!</summary>
  
  ## Heading
  1. A numbered
  2. list
     * With some
     * Sub bullets
</details>
```

---

<div class="post-metadata">

### Author: ![George\_B](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/george_b/32/534_2.png) [@George\_B](https://community.glideapps.com/u/George_B)
#### Post date: [November 21, 2019, 7:49pm UTC](https://community.glideapps.com/t/intro-tip-how-to-create-a-markdown-accordian-to-show-hide-stuff/2250/4 "2019-11-21T19:49:39Z")

</div>

That is really cool. I hate however to sound like a broken record but just be aware that support for html within the Rich Text component could go away at any time according to the Glide team.

---

<div class="post-metadata">

### Author: ![Jaybird\_Farrow](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jaybird_farrow/32/135_2.png) [@Jaybird\_Farrow](https://community.glideapps.com/u/Jaybird_Farrow)
#### Post date: [November 22, 2019, 6:54pm UTC](https://community.glideapps.com/t/intro-tip-how-to-create-a-markdown-accordian-to-show-hide-stuff/2250/5 "2019-11-22T18:54:28Z")

</div>

Thank you George…

---

<div class="post-metadata">

### Author: ![Jaybird\_Farrow](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jaybird_farrow/32/135_2.png) [@Jaybird\_Farrow](https://community.glideapps.com/u/Jaybird_Farrow)
#### Post date: [November 22, 2019, 6:54pm UTC](https://community.glideapps.com/t/intro-tip-how-to-create-a-markdown-accordian-to-show-hide-stuff/2250/6 "2019-11-22T18:54:42Z")

</div>

Awesome…

---

<div class="post-metadata">

### Author: ![Muhammad\_iqbal](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/muhammad_iqbal/32/246_2.png) [@Muhammad\_iqbal](https://community.glideapps.com/u/Muhammad_iqbal)
#### Post date: [November 23, 2019, 3:03am UTC](https://community.glideapps.com/t/intro-tip-how-to-create-a-markdown-accordian-to-show-hide-stuff/2250/7 "2019-11-23T03:03:00Z")

</div>

Cool stuf @Jaybird_Farrow

---

<div class="post-metadata">

### Author: ![Christophe\_HK](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/christophe_hk/32/4161_2.png) [@Christophe\_HK](https://community.glideapps.com/u/Christophe_HK)
#### Post date: [December 15, 2019, 7:16pm UTC](https://community.glideapps.com/t/intro-tip-how-to-create-a-markdown-accordian-to-show-hide-stuff/2250/8 "2019-12-15T19:16:56Z")

</div>

@david and the Glide team, could you please let me/us know if the use of such summary and detail html tag in rich text components may be revicated in a near or far future? I do need such a way to hide/show inline help for my users. Making them going to another screen to get some help would not be efficient from a UI point of view.

I am close to get a mvp and go to meet potential customers to sell them a fully customizable app for their business, so I would like to avoid changing the app structure for such a thing.

Many thanks for your feedback, even if negative. I just need to know how to make my app stable enough to be able to sell it as a product and not a demo or prototype.

Cheers!

---

<div class="post-metadata">

### Author: ![david](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/david/32/62831_2.png) [@david](https://community.glideapps.com/u/david)
#### Post date: [December 15, 2019, 8:00pm UTC](https://community.glideapps.com/t/intro-tip-how-to-create-a-markdown-accordian-to-show-hide-stuff/2250/9 "2019-12-15T20:00:49Z")

</div>

HTML tags in Rich Text are totally unsupported and we have no plans to support them. I discourage you from telling your clients that apps built with Glide are “fully customizable.”

---

<div class="post-metadata">

### Author: ![Christophe\_HK](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/christophe_hk/32/4161_2.png) [@Christophe\_HK](https://community.glideapps.com/u/Christophe_HK)
#### Post date: [December 15, 2019, 9:45pm UTC](https://community.glideapps.com/t/intro-tip-how-to-create-a-markdown-accordian-to-show-hide-stuff/2250/10 "2019-12-15T21:45:55Z")

</div>

Thanks for your feedback @david. 👍🏻

Regarding customization, the apps are customizable, up to the limit we set.

My current prototype is using only supported glides features, no html tags in rich text. Was just searching for a way to enhance a bit the UX/UI to not overload screens.

---

<div class="post-metadata">

### Author: ![Nadir\_Abdelrahman\_MD](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/nadir_abdelrahman_md/32/5237_2.png) [@Nadir\_Abdelrahman\_MD](https://community.glideapps.com/u/Nadir_Abdelrahman_MD)
#### Post date: [September 27, 2021, 2:52am UTC](https://community.glideapps.com/t/intro-tip-how-to-create-a-markdown-accordian-to-show-hide-stuff/2250/11 "2021-09-27T02:52:49Z")

</div>

Thanks
