metisMenuはSB Admin 2等bootstrapベースのAdmin向けテーマのメニュー表示によく使われています。
RailsでTurbolinksを有効にしている場合、ページ遷移時にmetisMenuが有効になるようにする必要があります。これは参考サイトのやり方でできます。
$(document).on('page:load', function () {
// ページ遷移したときmetisMenuを有効にする
$('#side-menu').metisMenu();
});
ただ、画面が狭い時のスマホ向け表示ではページ遷移時にmetisMenuが表示されたままになってしまいます。
metisMenuのDOM要素は
.navbar-collapse.collapse.in が表示状態
.navbar-collapse.collapse が非表示状態
で、Turbolinks環境でのページ遷移後は
.navbar-collapse
となっているので'collapse'クラスを付与してあげるとメニューが非表示になります。
$(document).on('page:load', function () {
// ページ遷移したときmetisMenuを有効にする
$('#side-menu').metisMenu();
// ページ遷移したときcollapseクラスを付与することでメニューを閉じた状態にする
$(".sidebar-nav.navbar-collapse").addClass('collapse');
});