WP Responsive Menu

WordPress

WP Responsive Menu – スマホ対応のレスポンシブメニューを追加する、WordPressプラグインはこれで決まり!

ぺんです。

サイトを運営する上で、スマホ対応はとても重要です。
その意味では、小さな画面でも迷わないように、分かりやすいナビゲーションメニューを提供することは重要ですね。

今回は、スマホ対応のレスポンシブメニューを追加する、WordPressプラグイン「WP Responsive Menu」をご紹介します。

WP Responsive Menuの特徴

今回、このWP Responsive Menuを見つけるまでに、いろいろなプラグインを試してみました。
その際に重視したポイントは以下の通りです。
WP Responsive Menuは、無料バージョンでも実に様々な機能を提供してくれます。

メニューの表示位置など、簡単にカスタマイズが行える

WP Responsive Menuの設定画面です。メニューの表示位置や背景画像など細かい設定が可能です。
より細かい設定は、有料のProバージョンで!という話なのですが、個人的には無料バージョンで十分に満足してしまいました。

設定画面

無料バージョンでもメニューのアニメーションに対応

これも、本日10月29日の、バージョン: 3.0.2 で対応してくれました! それ以前は、無料バージョンでは、ハンバーガーメニューをクリックしても、アニメーションが無かったので、少々華やかさに欠けていました。

ハンバーガーメニューとは?

ハンバーガーメニューとは、スマホアプリやモバイルウェブ画面でおなじみの、画面右上や左上に表示される、三本線のアイコンです。よく、CSSでアニメーション表示されることが多いですね。
ハンバーガーメニュー
この三本線が、ハンバーガーの様に見えることから、名づけられたようです。
ハンバーガー

 

無料バージョンでもメニューの背景に画像を貼れる

他のツールも調べていたのですが、無料版でメニュー部分に背景画像を貼れるツールは見つかっていませんでした。これも今回のアップデートでサポートされました!

まとめ

いかがでしたか?

今回ご紹介したWP Responsive Menuプラグインは、無料バージョンでも美しいメニューを簡単に追加できます。
本サイト「あふぃぶ」でも、早速採用してみました。画面の幅を小さくすると、WP Responsive Menuのメニューが表示されますのでお試しください。

関連記事

  1. Jetpack

    WordPress

    JetpackのPhoton(CDN)機能をONにすると、楽天のサムネイルサイズがおかしくなる

    ぺんです。商品紹介のリンクを貼るときに、サムネイルのサイズ…

  2. 洗練されたWebサイトで集客につなげる - 失敗市内WordPressテーマの選び方

    WordPress

    失敗しないWordPress(ワードプレス)テーマの選び方

    ぺんです。前回、このブログをエックスサーバー上で運営することは…

  3. WordPress

    OGPタグ設定-2017年最新版:FacebookとTwitterに記事を自動投稿する方法

    ぺんです。ブログ記事を投稿した際に、FacebookとTwit…

  4. Font Awesomeの使い方

    WordPress

    Font Awesome CDN – 追加された新しいフォント(Ver.4.7.0)のW…

    ぺんです。立ち上げ途中のサイトで、Font Awesomeのア…

  5. MagCast ワードプレステーマ

    WordPress

    MagCast ワードプレステーマのカスタマイズ方法

    ぺんです。以前ご紹介した、ニュースメディア風のワードプレステー…

  6. 洗練されたWebサイトで集客につなげる - 失敗市内WordPressテーマの選び方

    WordPress

    失敗しないWordPress(ワードプレス)テーマの選び方2 TDC 「MAG」を選んだ3つの理由

    ぺんです。前回のエントリーからずいぶんと間が空いてしまいました…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

  1. ツール

    Compressor.io (圧倒的に使いやすいオンライン画像圧縮ツール)
  2. Server

    アフィリエイト収益ブログの始め方(1)- ブログのテーマを決定する方法
  3. 読み込みが遅いWebサイト

    Server

    mod_pagespeed設定で、ウェブのパフォーマンスを大幅に向上する方法
  4. 洗練されたWebサイトで集客につなげる - 失敗市内WordPressテーマの選び方

    WordPress

    失敗しないWordPress(ワードプレス)テーマの選び方
  5. あふぃぶ 運営情報

    ようこそ、Affiliate-biz.jpへ
PAGE TOP