ワードプレスで入力した内容がパソコンでは綺麗に表示されているのですが、カスタマ…

WordPress
ユーザー1213さん
ユーザー1213

ワードプレスで入力した内容がパソコンでは綺麗に表示されているのですが、カスタマイズのモバイルプレビューや、自身のiPhoneでは文字ズレが生じてしまいます。
ネットで調べてcssなど入力してみたのですが、綺麗な改行になりません。
解決策を教えて頂きたいです。
よろしくお願いします。

添付された画像

みんなのコメント 10件

ユーザー660さん
ユーザー660さん

添付画像のみでは何もわかりません。
ブログ URL を教えてください。

ユーザー660さん
ユーザー660さん

ありがとうございます。

添付画像の赤丸の部分、全角スペース(6 個)を入れて文字頭をズラしていますね?
これではスマートフォン表示などで文が折り返される場合、折り返された文の頭はズレます。

全角スペースで文字頭をズラすのではなく、インデントを入れましょう。これで解決します。
https://wp-1.club/indent-visual-editor/

添付された画像

ユーザー1213さん
ユーザー1213さん質問者

すいません。
内容は理解したのですが、固定ページからプロフィールの編集を使用としもツール切り替えやインデントが表示されないのですが何故でしょうか?
文字の編集、テンプレート、ショートコードなどはでできています。
さらにブロックツールを表示を押してもでできません。
初歩的な質問ですいません。

ユーザー660さん
ユーザー660さん

ブロックエディタを利用されているということですね?
TinyMCE Advanced プラグインを利用すると簡単に解決できます。
https://zakkuri.info/2019/04/25/how-to-add-tools-to-toolbar-of-classic-block/

また TinyMCE Advanced プラグインを利用しなくても、「クラシック」ブロックを利用すればツールバーが表示されるので、そのツールバーから「インデント」を利用可能です。(添付画像参照)

もしコードエディターを利用できるのであれば、文字頭をズラす部分に <p style="padding-left: 40px;"> タグを挿入します。
※文字化け対策のために <> を全角にしているので、実際に使用する場合は半角にしてください

添付された画像

ユーザー1213さん
ユーザー1213さん質問者

返信が遅れてしまい申し訳ありません。
クラシックブロックにしたら表示されましたが、インデントを増やしたい行で押しても全行移動してましまう
のですが、移動さしたい行だけ移動するにはどうしたら良いのでしょうか?
何度も質問すいませんが教えていただきたいです。

ユーザー660さん
ユーザー660さん

とりあえず、1 行空けて改行してください。

また言葉だけでは状況がわかりにくいので、テスト記事の URL を添付いただくか、せめて画像を添付していただけますでしょうか。

あなたの経験や知識を共有しませんか?

ほかのユーザーの相談に、コメントで参加してみましょう。

ログインしてコメントするはじめての方は無料登録