スマホでページヘッダー上のタイトルが少ない文字数で改行される

お忙しいところ、早々にありがとうございます。
記述するコードはカスタマイザーでGoogleフォントを設定した際にヘッダーに記載されるものを用いています。

add_action(
	'wp_head',
	function() {
		?>
<link rel='stylesheet' id='wp-google-fonts-css' href='https://hoge.com/hoge/wp-content/uploads/inc2734-wp-google-fonts/noto-serif-jp-400700.css' type='text/css' media='all' />
		<?php
	}
);

カスタマイザーでNoto Sans JPを設定しておいて、Noto Serif JPを個別で指定する、といった使い方をしています。
お手数ですがご確認のほど、よろしくお願いいたします。

キタジマさん、原因がわかりました。
まず、ご報告した内容に不備、誤りがあったことがわかりましたので、お詫びしなくてはいけません。すみません…。

結論としては、フォント指定をBIZ UDPMincho（およびBIZ UDGothic）にした場合に発生する問題で、カスタマイザーの設定で上記のフォントを一括指定した場合にも同様の現象が発生することがわかりました。

h1のフォント指定をNoto Serifにしていた中でのことだったのですが、.c-page-header__titleのフォント指定がBIZ UDPMinchoになったまま残っていたことが原因でした。

add_action～で、noto-serif-jp-400700.cssの指定のほかに、biz-udpmincho-400.cssの指定など他の記述も含めた状態だったので、その部分をまとめて削除することで解消したように見えていただけでした。

BIZ UDPMinchoとBIZ UDGothicを使う場合には注意が必要ですが、他のフォントの場合には大丈夫なようです。
お詫びして、ご報告いたします。

追加確認、ありがとうございます！
あ、キタジマさん、改行されてしまうのはスマホでの表示時です。
スマホだと、基本の文字サイズを12pxなどに下げても改行されてしまいます。

なるほど、iOSの不具合だったのですね。お忙しい中にご確認等々、本当にありがとうございます！
すでにNoto serifにしていたのですぐには問題ないのですが、もしBIZ UDPを使う際には注意しておきます。

なお余談ですが、iPhoneで横向き表示にした際には、SafariのほかFirefoxやEdgeでもレイアウトが大きく崩れることに気付きました。ブラウザのシミュレーターやAndroidでは大丈夫だったので、これもiOS側の不具合だろうと思っていましたが、ちょうど話題に出たので軽くご報告しておきますね。

なお、このフォーラムも全体に右側に寄ってしまいテキストが見切れたりハンバーガーメニューがほとんど表示されないようになっています。特にセクションのブロークングリッドやセクションのコンテンツの最大幅を指定した場合に影響が強く出るようなので、もう少し検証してみます。

♥ 1

いいねをした人:

あ、そうだったのですね。いま確認したところ、公式サイト、フォーラムでは改善されています！

セクション周りも見ていただいて解決するようでしたら、かなりホッとします☺️

早々にありがとうございます！解決しそうで何よりです。

iPhone側の問題だろうと、仕方ないかと諦めかけていたのでホッとしました。。

次回のアップデートに反映いただけると非常に助かります。

♥ 1

いいねをした人: