# Squarespace Accordion 2 Columns

**URL:** <https://community.elfsight.com/t/squarespace-accordion-2-columns/169835>\
**Category:** Platform Tips\
**Tags:** squarespace\
**Created:** [July 31, 2026, 12:14pm UTC](https://community.elfsight.com/t/squarespace-accordion-2-columns/169835 "2026-07-31T12:14:21Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![tuanphan](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/tuanphan/32/3165_2.png) [@tuanphan](https://community.elfsight.com/u/tuanphan)\
**Post date:** [July 31, 2026, 12:14pm UTC](https://community.elfsight.com/t/squarespace-accordion-2-columns/169835/1 "2026-07-31T12:14:21Z")

</div>

**Description**

- split accordion content to 2 columns, 3 columns, 4 columns

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/0/b/0bfc0c62677eb863e10c0859e325e3fc08fd61ce.jpeg)

**#1.1.** Add text with symbol: ##break

Something like this

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/5/b/5bf6db6e818371dd74ec601ec49c134cabc2d432.jpeg)

so code can break it to 2 columns

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/0/b/0bfc0c62677eb863e10c0859e325e3fc08fd61ce.jpeg)

or something like this

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/0/f/0fbf751382cdb367c4186d4698ab21560bd79354.jpeg)

so code can break it to 3 columns

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/e/2/e20617a9fe36af354af1373740b8348635687136.png)

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

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/0/0/005720fb15f97a8cfd8499fdd0885f6f797812f9.png)

**#1.3.** Click Advanced \> Paste this code

- If you use Personal/Basic Plan and your plan doesn’t support Injection, see #3.1
- You can also use **[this Accordion FAQ widget](https://go.elfsight.io/click?pid=9&offer_id=4&path=/accordion-faq-widget/)**[](https://go.elfsight.io/click?pid=9&offer_id=4&path=/accordion-faq-widget/)to create accordion into Squarespace, so you can adjust style easier.

```auto
<!-- 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>

```

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/e/4/e435054535e5f85fab1d4df32a1d2fad4f9f4d4b.jpeg)

**#2. Customize**

some style options (line 06 – line 08)

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

```

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

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/a/5/a5b7c63b8bf5d6bd492784a712cbb1709ce8e8e0.png)

Then add this code into Markdown Block

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

```

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/4/7/4742f42de5f2c29a76aa6f8e65b4025875d40812.png)