ショートコードを用いた3カラムボックスがPCでも縦に表示されてしまう
-
お世話になります。
ショートコード＞3カラム＞3カラム【タイトル＆背景色あり】
上記を挿入したところ、
添付スクリーンショットのようにPC版でも縦に並んでしまいます。きっかけとして思い当たることとしては、
ボックス内の文字を左寄せではなく中央寄せにしてから
このようになったように記憶しております。改善の仕方をご教授いただけますと幸いです。
※マニュアルを確認したところ、使い方の解説記事は（※準備中）となっておりました。
https://jin-theme.com/manual/shortcord/※別途稼働中のページがある為プラグインの停止ができかねますが、問題解消において全停止が必須の場合はその旨お伝えいただけますと幸いです。
マニュアル確認済み
キャッシュクリア済み
WordPressのバージョン : WordPress 6.3.1
ご利用のサーバー名 : Xserver
PHPのバージョン : 7.4.33 (64ビット値をサポートしています)
OS : macOS 13.5.2
ご利用のブラウザ : chrome
該当サイトのURL :
-
この投稿が削除されました！
-
@ueno さん
こんにちは！
詳細の共有、ありがとうございます。こちらの環境下での検証だと症状を再現できていない状態です。。
テキストを左寄せに戻して変化があるかご確認いただきたいのと、
編集画面のスクリーンショットをご共有いただけますか...？？よろしくお願いいたします！
-
@tsu_ さん
ありがとうございます！
左寄せにしましたが、
並列に戻らないばかりか、編集画面上に存在する改行までなくなってしまいます。。
編集画面のスクリーンショットとは、具体的にどの部分が必要でしょうか？お手数おかけしますがご確認お願いいたします。
-
-
@tsu_ さん
ご返信が遅れ申し訳ありません。
おっしゃる通り、クラシックエディタを利用しています！
-
@ueno さん
確認ありがとうございます！
試しに以下のコードを貼り付けてみていただけますか...？？
（「ここに画像」という箇所にはメディアを追加してください）直接的に関係があるかは何ともですが、ビジュアルタブではなく
テキストタブで作業をお願いいたします！[3col-box] [3-left bg_color="#f7f7f7" title="タイトル" style="1"] [jin-img-maruwaku] ここに画像 [/jin-img-maruwaku] 左のコンテンツ。テキストが入ります。[/3-left] [3-center bg_color="#f7f7f7" title="タイトル" style="1"] [jin-img-maruwaku] ここに画像 [/jin-img-maruwaku] 中央のコンテンツ。テキストが入ります。[/3-center] [3-right bg_color="#f7f7f7" title="タイトル" style="1"] [jin-img-maruwaku] ここに画像 [/jin-img-maruwaku] 右のコンテンツ。テキストが入ります。[/3-right] [/3col-box]
-
@tsu_ さん
ありがとうございます。
いただいたコードをサイトの一番上に挿入したところ、
以下のような並列の表示になりました
さらにビジュアルタブの方でフォントサイズを変更したところ、これもOKでした。
ですが、文章に改行を加え中央寄せにすると表示がおかしくなります。（作業はビジュアルタブで行っています）
これはどのように解消したら良いのでしょうか、、
お忙しい中恐れ入りますが、ご確認どうぞよろしくお願いいたします。
-
@ueno さん
詳細の画像ありがとうございます！
そうですね、、、何かが干渉してそうなのと、
ショートコードでの表示なので少し自由度は低いかもしれません。。。以下のコードだと、いかがですか？？
[3col-box] [3-left bg_color="#f7f7f7" title="タイトル" style="1"] [jin-img-maruwaku] ここに画像 [/jin-img-maruwaku] <div class="t-aligncenter">左のコンテンツ。 テキストが入ります</div> [/3-left] [3-center bg_color="#f7f7f7" title="タイトル" style="1"] [jin-img-maruwaku] ここに画像 [/jin-img-maruwaku] <div class="t-aligncenter">中央のコンテンツ。 テキストが入ります。</div> [/3-center] [3-right bg_color="#f7f7f7" title="タイトル" style="1"] [jin-img-maruwaku] ここに画像 [/jin-img-maruwaku] <div class="t-aligncenter">右のコンテンツ。 テキストが入ります。</div> [/3-right] [/3col-box]よろしくお願いいたします！
-
@tsu_ さん
ご返信が遅れ申し訳ございません。
いただいたコードにて作成後、フォントサイズを変更したところ無事解決いたしました。
わかりやすく丁寧にご回答いただきまして誠にありがとうございました！
