私のブログのトップページを見て何か違和感はありませんか？
今回は、ボックスメニューを設置して
その代わりにグローバルメニューを非表示にしてみました。
という内容になります。
グローバルメニュー非表示についてはワードプレス一般のお話になっています。
ボックスメニューを設置は有料テーマ、アフィンガーの内容になります。
まずは結果からご覧ください。
グローバルメニュー非表示ビフォーアフター
ビフォー
アフター
プロフィール、サトマップなど、メニューが消えてますね。
グローバルメニューを非表示にした理由
私のブログテーマはアフィンガーです。
トップページではヘッダーカードが４つ配置のデザインです。
そのすぐ下には新着記事がスライドで表示されます。
アフィンガーのカスタマイズとしては定番デザインですが、何だかごちゃごちゃしてきたな〜という印象でした。
そこで今回グローバルメニューを消してみたいと思いました。
非表示にできたらなんかスッキリしました。（個人的感想）
グローバルメニューを非表示にする方法
『グローバルメニュー 非表示』などで検索かけても全然求めてる情報がヒットしない。
まさかメニューを消すなんて愚かな考えをひらめくのは私だけ？
『あり得ない選択肢なのか？』 と不安を感じつつも
色々調べて出てくるのはCSSをいじるとか…
知識のない私には絶対無理だから一度は諦めかけました。
しかし、結果的にはあっさりできました…
ダッシュボード ～ 外観 ～ メニュー から進み
この状態で一切左カラムからメニューを追加せずにメニューを保存すれば、はい完了。
メニュー項目の存在しないヘッダー用メニューの完成です。
グローバルメニューを非表示の注意点
この設定(グローバルメニューの非表示)はPCでの閲覧時のみにしました。
理由は、スマホ表示では（次の項で設定するボックスメニューでは）プロフィールにたどり着くまでかなりスクロールし続けなければならなくなってしまうからです。
PCでの閲覧時では、従来型のグローバルメニューでのプロフィール表示等が無くなっても問題ないと判断しました。
それはサイドバーのボックスメニューはすぐアクセスできる位置に表示されているためです。
私のサイトのトップページを見ていただければ、おわかりいただけると思います。
サイドバーにボックスメニューを設置
さて、ここからは有料ブログテーマ アフィンガー のカスタマイズのお話になってきます。
今回、グローバルメニューの非表示を考えたのはこれを導入することに決めたからです。
これです
サイト管理者自己紹介の下に設置しました。
参考にしたサイト
コチラのサイトを参考にさせていただきました。
今回のカスタマイズだけに限らず、私にとってアフィンガーのカスタマイズに関する有益な情報がいくつかあり大変ありがたいサイトになっています。
まずこのデザインと配置を見てこれだと思いました。
前々からあまり気に入らなかったグローバルメニューの項目をここに表示させいという閃きとともに動き出しました。
コチラのサイトのショートコードもそのままいただきまして,アイコンやURLなどいじっていきました。
６つ項目があるのですが、私が今回ボックスメニューを設置した段階ではまだそのうち２つしかリンクが機能していないような状態です…
設置したものの全く使いこなせてない…
完全に見切り発車でしたが
デザイン的には大満足です。
もっとコンテンツを増やしていかないと！
ボックスメニューで自分なりにプラスαやってみた
アイコンのサイズは色々入力してみて微調整しました。
数字を変えるだけで簡単です。
ただ参考サイトそのままじゃ味気ないので、自分なりにプラスした点もあります。
それはコード内の subtext です
subtext は サブテキストで
コチラの参考にしたサイトのショートコードには何も入力されていませんでしたが、試しに入力してみました。
アイコンの下のテキストのさらに下に、ちょっとした説明を入れることができました。
細い字のテキストがサブテキストにあたります。
（必要性があったかどうかはわかりませんが…）
とにかく
- ショートコード
- ショートコードの意味
- 画像、アイコンの入れ方
- カラーの設定
これらに関しては今回紹介したサイトを参考にしてください。
非常に分かり易かったです。
おかげさまでコード知識ゼロの私でもできました。
ショートコードをどこに貼り付けるのか
最後にこのショートコードをどこに貼り付けるのかだけ
画像でどうぞ
ダッシュボード 〜 カスタマイズ 〜 ウィジェット に進み
サイドバーウィジェット
スティンガーカスタムHTMLを追加で設定してからそこに貼り付けます。
こんな感じですね。
ショートコードをコピペするだけの簡単なお仕事です。
今回はありきたりなグローバルメニューを思い切って消滅させるという思い切った行動に出ました。
その代わりとして、アフィンガー でサイドバーにボックスメニューを設置してみたという内容でした。
いかがでしたでしょうか？
ブログサイトには、グローバルメニューがあって当然という感覚の人たちにはちょっとなんか違うぞ？という感じの印象を与えられるかもしれません。
そこは自己満レベルですけど。
今回導入した 『ボックスメニューを設置』はアフィンガー利用してるブロガーで導入されていない方は試してみる価値ありではないでしょうか？
今回は以上になります
ありがとうございした。