wordpressのログインヘッダーが起こす表示崩れ

友人のサイトを作っていて少し前に一応完成したものを最近手直ししていたのですが、その時気が付いたCSSの表示崩れについて。

↑ログインするとワードプレスって上にこういう管理ヘッダー?が出て来るじゃないですか。これは修正済みの状態なんですが、この前その状態で見たら右上のハンバーガーナビが消えていることに気が付いたんですよね…。

多分この管理ヘッダーの下に隠れてるんだろうなということは分かったんですが、解決方法を探してみるとこちらのブログに解決方法が載っていました。

ワードプレスの管理者用バー(アドミンバー)がある場合のcss fixedの件

私の場合はfixedではなく、画面いっぱいに広がっている要素にabsoluteで位置指定してしまったために後ろへ行ってしまっていました。(「一仏両祖Web site」と書いてあるh1要素を入れたdiv内に一緒に入れておけば良かったんですけどね…うーんなんで外に出したんだろ。謎。)

とにかくこの記事に解決して頂いた感じなんですが、私の場合で補足すると、私はbody要素にbody_class()を指定していなかったのまずその指定が必要で(そうすればログインしたら自動的に.admin-barクラスが付く)、位置が画面最上部じゃなからか?top : 55pxで丁度良い感じになりました。

 

それとbody_class()ですが、実は指定していることは指定していたのでそこもまとめておきます。

WordPress Codex:テンプレートタグ/body class

bodyタグ内に追記することで、ワードプレスのページ属性などをクラス名で付与し、条件によってCSSを変える際などに有効なbody_class()ですが、引数に文字列を渡すことで、その任意の文字列をクラス名に追加することも可能です。

サイトではAndroidで見た時にウェブフォントで明朝体を表示するために(AndroidはシステムフォントのRobotoに明朝体がない)
ユーザーエージェントがAndroidかどうかを判定するis_android ()関数を定義して、クラス名に付与する用のbody_class()は付けていました。

 <body <?php 
if (is_android ())
{
body_class(android); 
}
?>
>
</body>

まぁでも見ての通りAndroidじゃなかったら何もクラス名付かないんですよね…
というわけで今回の件で修正しました。

 <body <?php 
body_class();
if (is_android ())
{
body_class(android); 
}
?>
>
</body>

超簡単ですけどこれで大丈夫で良かった。。この程度のプログラムもまだJSをかじった程度なのでドキドキです。
めでたしめでたし。

 


LINE漫画で読んでいた韓国漫画の「私は整形美人」、普通に良い感じであぁ~おもろかった!って感じでしたね。なんかあの恋敵?の女の子、私は最初からそんなに嫌いじゃなかったんですが、そこまでやり返されるわけでもなくかなりいい感じのエンドで良かったです。ていうかあの子性格悪いとかいう次元じゃなく普通に病名つくタイプのパーソナリティ障害的なアレなので、救いがあるにしても変に一途な男に慕われて救われるとかよりも、ちゃんと病院通って同性の友達が出来て過去の過ちを認めて終わりって超良心的なハッピーエンドですよね。
主人公の相手とか先輩とか異様に理想的な男性キャラがいないと話を進められないのかな…と感じさせるのは弱点だと感じたけど、生々しくなり過ぎずに人間のヤな感じを地に足ついて描くのは上手だったと思います。

あと何気ないシーンでしたが「好きなところ…黒が好きっていうところも好き」と返すところがなんか酷く純粋な感じがして妙に感動しました。

しかし比較するのもなんだけど、やっぱチートラの凄いところって「ヒロインが鈍感じゃない」っていうところだなと他の少女漫画読んでしみじみ感じます。
男性向けにしても女性向けにしても好意を向けられる方が物わかり良いと話が早くなりすぎるんで、主人公は鈍感にされることが多いんですけど、多すぎるから。。まぁチートラはその聡い雪すら分からなくなる青田先輩の謎っぷりで既にホラーかミステリーの領域に踏み込んでる感あるので少女漫画的には良し悪しではありますがw
噂によると今のペースで単行本出ると24巻でフルカラー本3万近く掛かる予想が出てましたが、そのくらい払う価値はあると思ってる。けど問題は金額よりスペースですね。あとペース。途中から読んでない分単行本で追いかけようと思ってるので早く続きを…

コメントを残す

メールアドレスが公開されることはありません。