Expandable content, how do you accomplish that?

[Cristina Silva]

Hi,

Does anyone have knowledge or any tips and trix on how to create expandable content (Q&A) in a knowledge article? Is there a specific HTML-code to accomplish that?

Kind regards,

Cristina

[Community Alums]

Hi @Cristina Silva ,

Ability to expand/collapse within a knowledge article is in the roadmap.

The use case for expanding collapsing entire field was majorly targeted at templated articles e.g. a KCS article has fields environment, issue, cause, resolution. So a user interested in just the resolution can expand and view only the resolution.

Here is a blog on how to do this via summary and details tags:

https://community.servicenow.com/community?id=community_blog&sys_id=5faa87a3db3cc8d0190dfb2439961904

I found some code that seems to create a simple yet functional expand/collapse menu :

      <div class="panel list-group"><a class="list-group-item" style="color: #646464 !important;" href="#a1" data-toggle="collapse" data-target="#a1">General IT Related changes</a>

      <div id="a1" class="collapse">

      <div class="list-group-item">

      <p>Content</p>

      <ul>

      <li>List Item 1</li>

      <li>List Item 2</li>

      <li>List Item 3</li>

      </ul>

      </div>

      </div>

      </div>

[Lauren Methena]

Good morning, @Cristina Silva ! There's a simpler way to create collapsible content. Here's a link to a reply I made in another thread. It provides quite a few details.

https://www.servicenow.com/community/knowledge-managers/need-help-with-formatting-options-available-...

But in the meantime, you can code with this:

<details>
<summary>This is your TITLE. Click this text to expand</summary>
<p>And then here is more info. This way, people can scan the headers and then open up the content they need. Easier on the eyes if you want them to scan the page. A little more coding but it's not too hard.</p>
</details>
<p>&nbsp;</p>
<p>Next section ...</p>

Go to the link I provided for more context and discussion.

Thank you! Let me know if this was helpful or the answer to your solution. And feel free to reply with follow-up questions. 

[sharan16]

Hi Sandeep,

Is it possible to use this collapsible menu in the work note field?  I have a requirement where i am copying emails from a source table to target table's work notes field. I am able to copy the emails. However the emails should be stacked and only when clicked it needs to expand.