サイドバーを折りたたむ

こんな感じにサイドバーを折りたたむプラグインを適用させてみた。

List Folder

ただ、そのままではちゃんと動作してくれないのでプラグインの編集で

add_action('wp_head', 'output_list_floder_js');

add_action('wp_footer', 'output_list_floder_js','99');

に変更する。

wp_headだとChromeで見た場合jQueryが先に読み込まれないので折りたたみが適用されず、footerにする事でjQueryを読み込む時間を稼いでいる。

ieとEdge、スマホなんかで折りたたみが上手く発動しないのでadd_actionのパラーメータを追加してとにかく優先度を落としてみた。
このプラグインは、サイドメニューの中身が全部表示されてから動かさないと上手く行かないわけで、ブラウザによって、サイドバーを読み切る時間がバラ付くのでなんとか設定で吸収する方法を模索して優先度を下げることでどのブラウザでも安定して折りたためる様になった。
ついでにタイプミスだと思うのだがfloderと言う綴りをfolderに直してみた(2箇所)

そして、Class名が「widget-title」になっているので「widget_title」に変更する。
これは、単純に開発当初のバージョンからClass名が変わっていると思うので変更

<?php
/*
Plugin Name: List Folder
Version: 0.2
Plugin URI: http://www.koikikukan.com/archives/2011/06/20-005555.php
Description: This is plugin for fold list.
Author: Yujiro Araki
Author URI: http://www.koikikukan.com/
*/
add_filter( 'pre_update_option_active_plugins', 'low_priority_active_plugins' );
function low_priority_active_plugins( $active_plugins, $old_value ) {
 $this_plugin = str_replace( wp_normalize_path( WP_PLUGIN_DIR ).'/', '', wp_normalize_path( __FILE__ ) );
 foreach ( $active_plugins as $no=>$path ) {
 if ( $path == $this_plugin ) {
 unset( $active_plugins[$no] );
 $active_plugins[] = $this_plugin;
 break;
 }
 }
 return $active_plugins;
}
if (!is_singular()){
 wp_enqueue_script('jquery');
}
//add_action('wp_head', 'output_list_folder_js');
add_action('wp_footer', 'output_list_folder_js','99');

function output_list_folder_js() {
?>
<style type="text/css">
.more, .hide {
 outline: none;
}
</style>
<script type="text/javascript" src="<?php echo WP_PLUGIN_URL ?>/wp_list_folder/jquery.listfolder.js"></script>
<script type="text/javascript">
jQuery(function() {
 jQuery('body').listfolder({
 sidebarClass: 'widget_title',
 });
});
</script>
<?php
}
?>

これで、サイドバーが折りたためる。
前のblogn+の時にややこしい設定をして同じ事をやっていたのだが、プラグインを見つけたので使わせていただいた。

サイドバーが冗長になるのが嫌いなのでこれでスッキリした。

しかし、プラグインの読み込み状態で、Chromeではほぼ99%は表示時に上手く折りたたまるのだが、IEとEdgeで初回表示時に上手く折りたたまない時があって、更新して再読み込みすると折りたたまる。

ちょっと適用タイミングを調整しないと安定して動作してくれず研究中
ただ、表示に問題がある訳では無いので気まぐれに折りたたみ機能が発動する感じだ。

偶に折りたたみが発動しないが、Chromeでほぼちゃんと動いていれば良いかな。

コメント