Navigation Menu

Skip to content

Instantly share code, notes, and snippets.

@jasperf
Forked from johnmccole/tabs.php
Created September 18, 2020 02:34
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jasperf/8c4c55cee6b89e68953fa4408b6126be to your computer and use it in GitHub Desktop.
Save jasperf/8c4c55cee6b89e68953fa4408b6126be to your computer and use it in GitHub Desktop.
Add the below file to yourtheme/woocommerce/single-product/tabs/tabs.php. This will update the tabs to be an accordion. Update as required.
<?php
/**
* Single Product tabs
*
* This template can be overridden by copying it to yourtheme/woocommerce/single-product/tabs/tabs.php.
*
* HOWEVER, on occasion WooCommerce will need to update template files and you
* (the theme developer) will need to copy the new files to your theme to
* maintain compatibility. We try to do this as little as possible, but it does
* happen. When this occurs the version of the template file will be bumped and
* the readme will list any important changes.
*
* @see https://docs.woocommerce.com/document/template-structure/
* @author WooThemes
* @package WooCommerce/Templates
* @version 2.4.0
*/
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
/**
* Filter tabs and allow third parties to add their own.
*
* Each tab is an array containing title, callback and priority.
* @see woocommerce_default_product_tabs()
*/
$tabs = apply_filters( 'woocommerce_product_tabs', array() );
if ( ! empty( $tabs ) ) : ?>
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true"">
<div class="panel panel-default">
<?php $i = 0; foreach ( $tabs as $key => $tab ) : ?>
<div class="panel-heading" role="tab" id="heading-<?php echo $i; ?>">
<h4 class="panel-title">
<a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapse-<?php echo $i; ?>">
<?php echo apply_filters( 'woocommerce_product_' . $key . '_tab_title', esc_html( $tab['title'] ), $key ); ?>
</a>
</h4>
</div>
<div id="collapse-<?php echo $i; ?>" class="panel-collapse collapse <?php if ( $i == 0 ): echo 'in'; endif; ?>" role="tabpanel" aria-labelledby="headingOne">
<div class="panel-body">
<?php if ( isset( $tab['callback'] ) ) { call_user_func( $tab['callback'], $key, $tab ); } ?>
</div>
</div>
<?php $i++; endforeach; ?>
</div>
</div>
<?php endif; ?>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment