Snow Monkey のドロワーナビゲーションをドロップダウンナビゲーションに変えるアドオンをつくりました

Snow Monkey はタブレット/スマホサイズで表示したときにグローバルナビゲーションがドロワーナビゲーション(横からシュッとでてくる)な形で表示されます。これをドロップダウンナビゲーション(上からシュッとでてくる)な形に変更するだけのシンプルなアドオン、Snow Monkey Dropdown Navigation をつくりました。

対応バージョン

Snow Monkey v7.9 以上が必須です。v7.8 以下では動作しませんのでご注意ください。

デモ

Snow Monkey 公式サイトでアドオンを有効にするとこんな感じ。

仕様

  • .c-drawer.c-dropdown に書き換えます。
  • ドロワーを開くためのハッシュナビリンク #sm-drawer はドロップダウンになっても機能します。

今後やりたいこと(予定は未定)

  • ドロップダウンはドロワーより表示範囲が広くデザインの幅があると思うので、デザインのパターンをいくつかつくりたい
  • ドロップダウンの色がアクセントカラーになるようにしているけど、色や透明度を選べるようにしたい

ダウンロードについて

メンバー特典として、しばらくはサブスクリプションメンバーなら無料ダウンロードできるようにしようと思います。一定期間たったら有料販売に切り替えます(プロプランユーザーの場合はマイアカウントページから無料ダウンロード可能にします)。

下記よりダウンロードしてください。

メンバー特典ダウンロード期間は終了しました!

この記事を書いた人

アバター画像

キタジマ タカシ

長崎県長崎市在住。地元のWeb制作会社でWebデザイナー/エンジニアとして従事した後、2015年にフリーランス [ モンキーレンチ ] として独立。WordPress のテーマやプラグイン、ライブラリ、CSS フレームワーク等、多数のプロダクトをオープンソースで開発・公開しています。

Snow Monkey オンラインコミュニティ

Snow Monkey をより良いテーマにするために、今後の機能開発等について情報共有したりディスカッションをしたりする場所です。より多くのユーザーの交流があったほうがより良いプロダクトに育っていくと思いますので、ぜひご参加ください!