Description
- adding accordion dropdown in product description
- view demo – password: abc
- buy me a coffee
#1. Install Code
#1.1. Click Gear icon on Store Page
Next, click Advanced > Page Header Code Injection
#1.2. Add this code to right box
<!-- 08.26c21v9 Accordion in Product Description -->
<script>
window.ProductAccordionConfig = {
containerSelector: '.product-description',
marker: '@@',
titleTag: '',
contentFontSize: '',
arrowSize: '20px',
arrowColor: '',
lineColor: '',
lineThickness: '1px',
animationDuration: '0.35s'
};
</script>
<script src="https://code.beaverhero.com/productdetail/0826c21v9accordionproductdes.js"></script>
#1.3. Next, edit a Product > Enter text with symbol like this: @@ and @@
#2. Customize
#2.1. To change accordion title to h3, h4, h5…tag, change this line
titleTag: '',
to something like this
titleTag: 'h3',