フォーラムへの返信
-
投稿者投稿
-
パーマリンクの設定はどうなってますか?
♥ 0いいねをした人: 居ませんこちらの「ロゴ差し替え」のコードで差し替え条件の所を
wp_is_mobile
に変更すれば、スマホ/タブレットの場合のロゴを差し替えできます。こちらの記事のコメントにもあるように、青い枠はブラウザのアクセシビリティ対応(要素にフォーカスが当たったらアウトラインを表示する)で表示されているものです。キーボードの
TAB
キーでフォーカスを移動させたときに、どの要素にフォーカスがあたっているのかが分かるように、などの理由で表示されています。
これを表示させないというのは、例えて言うと「点字ブロックがあると歩きにくいので外したい」と言っているようなものです。
基本的にはそのままにしておくのがベストなのですが、iPhoneなどスマホ表示の時にフォーカスが分かるようにする必要があるのかどうかは、もっと詳しい人に聞いてみないと私もよく分かりません。以上の理由から、単純に
a
タグやli
タグに対してoutline: none;
を当てるスタイルを追加CSSに記述するのではなく、My-Snowmonkeyにコードを書いてwp_is_mobile()
等で PCとそれ以外のデバイスできちんと条件分岐させた上で、PC以外の時にoutline: none;
にする必要があります。<?php if ( wp_is_mobile() ) { // PC以外の場合 // wp_enqueue_style で読み込むCSSを指定する // または、アクションフックでヘッダーにインラインCSSを追加 } ?>
アウトラインの表示は
a:focus-visible { outline: none; }
で消えると思います。
管理者宛メールの設定を変更するためのフィルターフックがあるので、チェックボックスの状態によって条件分岐させれば、出来そうなかんじですね。
こちらのコードを参考にされた方がよいと思います。
wp_enqueue_style
の第4引数にfilemtime( MY_SNOW_MONKEY_PATH . '/style.css' )
が入っているのは、バージョン番号を出力するためです。この場合は、ファイルの更新日時をバージョン番号として表示します。
style.css を更新すれば、キャッシュに関係なく新しいファイルが読み込まれるようになっているので、変に手を加える必要は無いですよ。どの要素にどんな class があたっているのかは、chrome のデベロッパーツールを使って調べるといいですよ。
デベロッパーツールの使い方に関しては、「css デベロッパーツール」等で検索すれば、情報はたくさん見つかると思います。参考記事
参考サイトのように固定背景にするだけなら、デフォルトのカバーブロックでメディア設定を固定背景にすると実現できますが、PCとスマホで高さの調整が必要になったりするので、CSSで背景画像を指定して
fixed
にすれば、同じようなことができます。質問の意味がよくわからないのですが
TOPページのOGP
というのは、何のことを指していますか?
♥ 0いいねをした人: 居ません -
投稿者投稿