Get 2024 Templates Mega Bundle!$1000 worth of 19 Bootstrap HTML, Vue & React Templates + 3 Vector Sets for just $99
Get for 99$

Accordion doesn't work


I'm working with Metronic 8.0.35 in my React app
I want to add an accordion element according to this example (just copied it):
https://preview.keenthemes.com/metronic8/react/demo1-docs/docs/accordion

But it doesn't work. Seems like it static and without Javascript


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (5)


Hi,

Try to use https://react-bootstrap.github.io/components/accordion/ instead. All our styles will be fitted also.

Regards,
Keenthemes support



Seems Metronic is just a Bootstrap's wrapper and has nothing with React. Their demo for React uses the additional library for accordion..



I have the same problem, when I copy+paste code mentioned before nothing happend. What am I doing wrong?



Hi,

Code in code preview is everything that you need to use an accordion.

It will work without javascript, you just need to include bs attributes and classes to your element as it is shown in our doc:
https://preview.keenthemes.com/metronic8/react/demo1-docs/docs/accordion



Hi, same for me. I copied the content of this:
https://getbootstrap.com/docs/5.0/components/accordion/
to end of e.g. dashboard page, and it does nothing.

My code is running Angular Demo1.

Can you please advise?


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(