Accordion 2 Columns

Description

07.26c28v6 Accordion 2 Columns

#1. Install Code

#1.1. Add text with symbol: ##break

Something like this

07.26c28v6 Accordion 2 Columns

so code can break it to 2 columns

07.26c28v6 Accordion 2 Columns

or something like this

07.26c28v6 Accordion 2 Columns

so code can break it to 3 columns

07.26c28v6 Accordion 2 Columns

#1.2. Hover on Page where you use Accordion Block > Click Gear icon

07.26c28v6 Accordion 2 Columns

#1.3. Click Advanced > Paste this code

  • If you use Personal/Basic Plan and your plan doesn’t support Injection, see #3.1
<!-- 07.26c28v6 Accordion 2 Columns -->
<script>
window.AccordionColumnsConfig = {
  fullWidth: true,
  breakMarker: '##break',
  maxColumns: 4,
  columnGap: '40px',
  columnMinWidth: '220px'
};
</script>
<script src="https://code.beaverhero.com/accordion/0726c28v6accordion2columns.js"></script>

07.26c28v6 Accordion 2 Columns

#2. Customize

some style options (line 06 – line 08)

maxColumns: 4,
columnGap: '40px',
columnMinWidth: '220px'

#3. Other

#3.1. If you use Personal/Basic Plan and your plan doesn’t support Injection, you can add a Markdown Block under Accordion Block

04.26c10v2 Header Sound Icon

Then add this code into Markdown Block

<script>
window.AccordionColumnsConfig = {
  fullWidth: true,
  breakMarker: '##break',
  maxColumns: 4,
  columnGap: '40px',
  columnMinWidth: '220px'
};
</script>
<script src="https://code.beaverhero.com/accordion/0726c28v6accordion2columns.js"></script>

07.26c28v6 Accordion 2 Columns

Buy me a coffee