<ul class="accordion"> <li class="accordion-item is-active"> <h3 class="accordion-thumb">{{ product.metafields.my_fields.first_tab_title }}</h3> <p class="accordion-panel">{{ product.metafields.my_fields.first_tab_description }}</p> </li> <li class="accordion-item"> <h3 class="accordion-thumb">{{ product.metafields.my_fields.second_tab_title }}</h3> <p class="accordion-panel">{{ product.metafields.my_fields.second_tab_description }}</p> </li> <li class="accordion-item"> <h3 class="accordion-thumb">{{ product.metafields.my_fields.third_tab_title }}</h3> <p class="accordion-panel">{{ product.metafields.my_fields.third_tab_description }}</p> </li> </ul>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter