Shortcodes Ultimateのsu_tabで、別ページから直接タブを操作出来なかったためカレントタブを変更するjQueryを作成しました。
url: su_tabのページ?category=slug で呼出し
su_tab のタブにそれぞれcategoryのクラス class=”slug” を設定
カレントタブはページを表示した時のみ変更する。
urlパラメータが無い場合は、デフォルトのカレントを表示する。
jsの呼出し方法などは省略しています。
本人の覚書ですので責任は持ちません。
/**
* リンクurlのgetパラメータからカテゴリーを取得して
* su_tabのカレントを変更する
*
* リンク https://xxxxxxxxxxxxxxxxxx?category=カテゴリーslug
* ↓
* [su_tab class="カテゴリーslug"]
* コンテンツ部にはタブのクラスが付与される・・・たぶん
*/
jQuery(function($) {
$(document).ready( function(){
var pageParam;
pageParam = $(location).attr('search');
if(pageParam) {
// 「&」が含まれている場合は「&」で分割
var param = pageParam.split('&');
// パラメータを格納する用の配列を用意
var paramArray = [];
// 用意した配列にパラメータを格納
for (i = 0; i < param.length; i++) {
var paramItem = param[i].split('=');
paramArray[paramItem[0]] = paramItem[1];
//alert('Name:'+ paramItem[0]);
var getItem = paramItem[0].split('?');
//alert('Name:'+ getItem[1]);
if(getItem[1] == 'category' ) {
//カテゴリーを取得
var categoryParm = paramItem[1];
//alert('Param:'+ categoryParm);
}
}
// url?category=xxxならば
if(categoryParm) {
//カレントの.su-tabs-currentクラスを削除
//$('.su-tabs .su-tabs-nav span').removeClass('su-tabs-current');
$('.su-tabs .su-tabs-nav span.su-tabs-current').removeClass('su-tabs-current');
// su-tabs
// タブ su-tabs-nav の su-tabs-current を追加
$('.su-tabs .su-tabs-nav .'+ categoryParm).addClass('su-tabs-current');
// コンテンツ su-taabs-panes
//カレントの.su-tabs-pane-openクラスを削除
//$('.su-tabs-panes .su-tabs-pane').removeClass('su-tabs-pane-open');
$('.su-tabs-panes .su-tabs-pane.su-tabs-pane-open').removeClass('su-tabs-pane-open');
// タブ su-tabs-nav の su-tabs-current を追加
$('.su-tabs-panes .'+ categoryParm).addClass('su-tabs-pane-open');
}
}
});
});