Buy me a coffee

Combine 2 Accordion Blocks on Mobile

To combine 2 Accordion Block into 1 Accordion on Mobile, you can follow these.

#1. Use this free tool to find the ID of 2 Accordion Blocks.

In my example, we will have: #block-yui_3_17_2_1_1722935850341_3420, #block-yui_3_17_2_1_1723417893645_4683

Combine 2 Accordion Blocks On Mobile 01 Min

#2. Use this code to Code Injection > Footer

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script>
jQuery(document).ready(function($) {
function run() {
    if ($(window).width() <= 767) {
$('#block-yui_3_17_2_1_1723417893645_4683 li.accordion-item').appendTo('#block-yui_3_17_2_1_1722935850341_3420 ul.accordion-items-container');
} else {

}
}
    run();
    window.addEventListener('resize', run)
});
</script>

Combine 2 Accordion Blocks On Mobile 02 Min

#3. Result

Combine 2 Accordion Blocks On Mobile 03 Min

#4. To remove the bold line between 2 accordions, use this code to Custom CSS box

#block-yui_3_17_2_1_1722935850341_3420 li:nth-child(4) .accordion-divider.accordion-divider--top {
    display: none !important;
}

Combine 2 Accordion Blocks On Mobile 04 Min