※画像はクリックすると大きくなります。

Server WordPress

WordPressテーマ【AFFINGER6】でメニューをヘッダー画像に透過させるのは結構難しい

ヘッダーメニュー透過

メニューをヘッダー画像上にのせてメニューの回りを透過させる
設定は結構複雑ですね。同じ設定がいろいろな所に点在しているせいでしょうね。
まずは一番先にチェックするポイントは【AFFINGER5管理】→【ヘッダー】で
【下層ページにもヘッダー画像を表示する】にチェックを入れる。



続いて確認するところは、【外観】→【カスタマイズ】→【ヘッダー画像】の
項目でこちらには一切ヘッダー画像をいれてはダメ ヘッダー画像の高さだけ入れときましょう。



続いて【基本エリア設定】で【headerエリア】のところにヘッダー画像を挿入



一つ前のメニューに戻り【メニューのカラーの設定】の項目へ
ここがいろんなサイトを見てもなかなか理解が難しかったのですが
【ヘッダーメニュー】の【背景色】を【透明】にするのですが
もちろんカラーの中には【透明】はないので色のコードの所を
空白にてオッケーボタンがないので欄外をクリックして色コードを
空白で確定するとメニューバーが透過するはずです。



これでアイキャッチ画像のようなヘッダー画像上にメニューが透過されると思います。


これでできたサイトがこちら


このエントリーをはてなブックマークに追加 ブログランキング・にほんブログ村へ