# FAQ module won't open

**URL:** <https://community.hubspot.com/t/faq-module-wont-open/13323>\
**Category:** CMS Development\
**Tags:** javascript\
**Created:** [March 4, 2019, 10:07am UTC](https://community.hubspot.com/t/faq-module-wont-open/13323 "2019-03-04T10:07:55Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![CandiceLloyd](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/candicelloyd/32/31851_2.png) [@CandiceLloyd](https://community.hubspot.com/u/CandiceLloyd)\
**Post date:** [March 4, 2019, 10:07am UTC](https://community.hubspot.com/t/faq-module-wont-open/13323/1 "2019-03-04T10:07:55Z")

</div>

On many webapges we make use of the FAQ modules.

Previously they expanded no problem, suddenly it has broken across every page that makes use of this module and I am not sure how to fix it.

I do not have much knowledge of JavaScript so would need some assistance please in regards to fixing it and where to add it!

This is the current code I have for the FAQ module:

\<div class=“accordion”\>  
\<div class=“accordion\_group {% if widget.expanded %}expanded{% endif %}”\>  
\<div class=“accordion\_header”\>\<span class=“accordion\_icon”\>\<i class=“far fa-plus-square”\>\</i\>\</span\> {{ widget.faq\_question }}\</div\>  
\<div class=“accordion\_content”\>  
{{ widget.faq\_answer }}  
\</div\>  
\</div\>  
\</div\>

---

<div class="post-metadata">

**Author:** ![stefen](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/stefen/32/29274_2.png) [@stefen](https://community.hubspot.com/u/stefen)\
**Post date:** [March 4, 2019, 1:22pm UTC](https://community.hubspot.com/t/faq-module-wont-open/13323/2 "2019-03-04T13:22:32Z")

</div>

@CandiceLloyd you’re probably missing the javascript. Add this and it should start working:

```auto
$('.accordion_header').on('click', function() {
 $(this).parent().toggleClass('expanded');
});

```

If it still doesn’t work, check the console for any other JS errors.

---

<div class="post-metadata">

**Author:** ![CandiceLloyd](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/candicelloyd/32/31851_2.png) [@CandiceLloyd](https://community.hubspot.com/u/CandiceLloyd)\
**Post date:** [March 5, 2019, 1:27pm UTC](https://community.hubspot.com/t/faq-module-wont-open/13323/3 "2019-03-05T13:27:34Z")

</div>

Hey Stefan,

Thank you very much for your input!

This worked well!

Kind regards,

Candice

---

<div class="post-metadata">

**Author:** ![Ibis](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/ibis/32/14279_2.png) [@Ibis](https://community.hubspot.com/u/Ibis)\
**Post date:** [August 29, 2019, 2:10pm UTC](https://community.hubspot.com/t/faq-module-wont-open/13323/4 "2019-08-29T14:10:25Z")

</div>

I have the same issue.

Where do i paste that code and how?

thanks in advance!

---

<div class="post-metadata">

**Author:** ![stefen](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/stefen/32/29274_2.png) [@stefen](https://community.hubspot.com/u/stefen)\
**Post date:** [August 29, 2019, 2:15pm UTC](https://community.hubspot.com/t/faq-module-wont-open/13323/5 "2019-08-29T14:15:57Z")

</div>

@Ibis you could add it directly below the HTML inside of a script tag.:

```auto
<script>
... script goes here ...
</script>

```

---

<div class="post-metadata">

**Author:** ![Ibis](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/ibis/32/14279_2.png) [@Ibis](https://community.hubspot.com/u/Ibis)\
**Post date:** [August 29, 2019, 2:22pm UTC](https://community.hubspot.com/t/faq-module-wont-open/13323/6 "2019-08-29T14:22:07Z")

</div>

Hi stefen,

thanks for your fast response. Do you mean like this?

\<div class=“accordion”\>  
\<div class=“accordion\_group {% if widget.expanded %}expanded{% endif %}”\>  
\<div class=“accordion\_header”\>\<span class=“accordion\_icon”\>\<i class=“far fa-plus-square”\>\</i\>\</span\> {{ widget.faq\_question }}\</div\>  
\<div class=“accordion\_content”\>  
{{ widget.faq\_answer }}  
\</div\>  
\</div\>  
\</div\>  
\<script\> $(‘.accordion\_header’).on(‘click’, function() {  
$(this).parent().toggleClass(‘expanded’);  
}); \</script\>

Because it did not work. I really do not know a lot about it unfortunately.

best

Giorgio

---

<div class="post-metadata">

**Author:** ![stefen](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/stefen/32/29274_2.png) [@stefen](https://community.hubspot.com/u/stefen)\
**Post date:** [August 29, 2019, 2:23pm UTC](https://community.hubspot.com/t/faq-module-wont-open/13323/7 "2019-08-29T14:23:53Z")

</div>

@Ibis if that didn’t work you might have other javascript errors on the page causing this script not to run because what you posted should work. Do you have a preview link to share?

---

<div class="post-metadata">

**Author:** ![Ibis](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/ibis/32/14279_2.png) [@Ibis](https://community.hubspot.com/u/Ibis)\
**Post date:** [August 29, 2019, 2:46pm UTC](https://community.hubspot.com/t/faq-module-wont-open/13323/8 "2019-08-29T14:46:13Z")

</div>

[https://info.ibis.nl/iso-webpagina?hs\_preview=hqRLzXaL-12519305069](https://info.ibis.nl/iso-webpagina?hs_preview=hqRLzXaL-12519305069)

> **[Edit Page | HubSpot](https://app.hubspot.com/pages/2804826/editor/12519305069/content)**

Hi Stefen,

do you mean that one?

best,

Giorgio

---

<div class="post-metadata">

**Author:** ![stefen](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/stefen/32/29274_2.png) [@stefen](https://community.hubspot.com/u/stefen)\
**Post date:** [August 29, 2019, 8:31pm UTC](https://community.hubspot.com/t/faq-module-wont-open/13323/9 "2019-08-29T20:31:12Z")

</div>

@Ibis yes, that first one. It looks like you mixed up the javascript with the HTML. Are you not using the FAQ module?

---

<div class="post-metadata">

**Author:** ![Ibis](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/ibis/32/14279_2.png) [@Ibis](https://community.hubspot.com/u/Ibis)\
**Post date:** [September 9, 2019, 1:46pm UTC](https://community.hubspot.com/t/faq-module-wont-open/13323/10 "2019-09-09T13:46:43Z")

</div>

hi stefen, apologies for the late respone. I had a flight to catch for vacation!

I did use the FAQ module but it shows as a flat template 😞

---

<div class="post-metadata">

**Author:** ![stefen](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/stefen/32/29274_2.png) [@stefen](https://community.hubspot.com/u/stefen)\
**Post date:** [September 10, 2019, 2:37pm UTC](https://community.hubspot.com/t/faq-module-wont-open/13323/11 "2019-09-10T14:37:56Z")

</div>

![Screen Shot 2019-09-10 at 10.36.53 AM.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/a/8/a88afdfae6baac220e52137c3ab7294eb98a7b0e.png)  
You should remove the HTML from the script tag. This HTML should be in the body where you want the tabs to appear on the page..

---

<div class="post-metadata">

**Author:** ![CandiceLloyd](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/candicelloyd/32/31851_2.png) [@CandiceLloyd](https://community.hubspot.com/u/CandiceLloyd)\
**Post date:** [August 29, 2019, 2:29pm UTC](https://community.hubspot.com/t/faq-module-wont-open/13323/12 "2019-08-29T14:29:00Z")

</div>

Hey Giorgio

I am attaching a screenshot of my code where I have gone in to the pages’ template.

On the right side panel to the Additional \<head\> markup.

You will see the code I used starting beneath: \<script type=“text/javascript”\>

 ![Screenshot 2019-08-29 at 16.27.39.jpg](https://d2qpr2jzcazej7.cloudfront.net/original/2X/d/df08cf2db97ee97a2b39b545ded909b8876d232e.jpeg)

---

<div class="post-metadata">

**Author:** ![jessebeginbound](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jessebeginbound/32/106254_2.png) [@jessebeginbound](https://community.hubspot.com/u/jessebeginbound)\
**Post date:** [June 1, 2020, 6:07pm UTC](https://community.hubspot.com/t/faq-module-wont-open/13323/13 "2020-06-01T18:07:36Z")

</div>

Hi everyone!

If you’re still struggling with this issue, as we have in the past, we made a simple, feature-rich HubSpot Module for FAQ’s that should work great for any HubSpot CMS page or website if you get fed up with the code.

Check it out here if you’re interested: [https://marketplace.hubspot.com/products/begin-bound/beginbound-ultimate-faq-module-live](https://marketplace.hubspot.com/products/begin-bound/beginbound-ultimate-faq-module-live)

Happy HubSpotting!
