前にフェイスブックでも触れているんですが、なんとグローバルメニューの文字の部分を画像にすることもできるんですよ!
しかもめっちゃ簡単に!
設定方法
- メニューに入れたい文字の画像を作成・アップロード
- 管理画面のメニューの設定から、各メニューのナビゲーションラベルというメニューの名前をいれるところにimgタグをそのまま書く
以上です!
↓図の赤枠部分に<img src=”●●●.jpg”> という具合にかきます。
すると…
▼テキストのメニューが…
なんと…!!
▼画像のメニューに!!
あら、おしゃれ(*´ω`*)
みなさんも是非、やってみてください♪
※これはメニューの枠全体を画像にするのではなく、文字の部分を画像にする説明です。
ではでは、これからもワードプレステンプレート、BizVektorをよろしくお願いします。
この記事を書いた人
-
スタッフのクノウです。
ワードプレス勉強中です!phpは苦手です…。
好きなことは絵をかくこと、お酒を飲むこと、カラオケです。よろしくお願いします。
クノウ様「グローバルメニューの文字の部分を画像にする」いいですね!!
質問ですが、最適なimgサイズを教えていただけますか?
よろしくお願いいたします。
画像サイズについては設定しているメニューの数や、適応させているデザインの種類、フォントなどによって、見栄えの良いサイズが異なりますので、いろいろ試してみて最適なサイズを見つけてみて下さい。今後ともBizVektorをよろしくお願いいたします。
すばらしいテーマ有難うございます!
いちいち個別の質問には答えられないかと思うのですが…
calmlyのグローバルメニューをカスタマイズ中に壁にぶちあたってます(><)
002.cssで、#gMenu のbackground-colorを変えてみたりしているのですが、メニューの背景に色をつけることができず、、、もしよろしければ教えていただけないでしょうか。
テストページ用に色々試しているのですが、
ナビゲーションラベルに<img src=”●●●.jpg”>を上記のようにいれますと、
メニューの部分に<img src=”●●●.jpg”>がそのまま出て来てしまいますが…。
はじめまして、ワードプレスを今年から始めたのですが、この裏技はワードプレスやBizvectorのバージョンには特に関係ないのでしょうか。やってみたのですが、うまくいかないわけでして、画像も普通にメディアをアップロード操作だけでいいのか、、。質問内容もうまく言えないのですが、お時間があればご回答よろしくお願いします。
hiroさん こんにちは。
画像をメディアにアップロードして、画像のパスのURLをコピーしてimgタグで囲ってください。
そして管理画面のメニューのナビゲーションラベルの箇所に張り付けてみてください。
これで出るはずなのですが、どうでしょうか。
ああああ、できましたーーーw。そういうことか、ひとつ賢くなれましたw。こんな素人に、本当にありがとうございます。ちょっと画像が荒かったのでもう少しかっこよく作ってから再度やってみます。 m(vv)m
でけましたw。やっぱり文字だけと違ってなにか華やかになるのでいいです。特にスマホのメニューはさみしかったのでやってよかった。これからもほどほどwよろしくお願いします。
ヘッダーメニューバー数:6分割
画像サイズ150x55でimg srcで読み込むと画像の両サイドにマージンが出来て2段になります。
同じような状態を回避された方いらっしゃいましたら、ご指導いただけないでしょうか;。;