[ 解決済 ] モバイル表示すると、katawara トップページスライドショーのスライドテキストが表示されなくなってしまう

VWSとは フォーラム Katawara [ 解決済 ] モバイル表示すると、katawara トップページスライドショーのスライドテキストが表示されなくなってしまう

[ 解決済 ] モバイル表示すると、katawara トップページスライドショーのスライドテキストが表示されなくなってしまう

  • このトピックには5件の返信、3人の参加者があり、最後にricにより2年、 2ヶ月前に更新されました。
6件の投稿を表示中 - 1 - 6件目 (全6件中)
  • 投稿者
    投稿
  • #68503

    ric
    参加者

    ■ WordPress のバージョン
    wordpress 6.0.2

    ■ テーマ・プラグインは全て最新版で確認してください。
    確認しました。

    ■ テーマの種類
    Katawara

    ■ テーマのバージョン
    バージョン: 1.18.1

    ■ 関連しそうなプラグインを一つづつ停止して症状が改善するか確認してください。
    確認しました。

    ■ プラグインの種類・バージョン

    ■ 期待する動作
    モバイル版でのトップページスライドショー表示を、パソコン版と同様にしたい。

    ■ 自分で試した事
    CSSの消去

    ■ 症状が発生するブラウザ
    chrome

    ■ 実際の症状
    モバイルで表した時に、トップページスライドショーのスライドテキストが全部表示しきれず、1部のみの表示となってしまっています。(スライドテキストの中間部分の80文字程度の表示となっております)
    katawaraさんのサンプルページのスライドショーをモバイル表示したときの文字サイズと比べると、大きい表示となっています。

    スライドタイトルで53文字、スライドテキストで240文字使用しており、下記CSSを使っています。

    .slide-text-caption {
    font-size: 17px;
    }

    このCSSを消去しても、表示状態に変化はありませんでした。

    モバイルの場合も、CSSセレクタをデベロッパーツールで探すのかと推測しているのですが、その方法がわかりません。。

    よろしくお願い致します。

    #68520

    うなこ
    モデレーター

    見当違いでしたらすみません。
    【カスタマイズ】→【Katawara トップページスライドショー】→の「スライド」設定項目の「モバイル用スライド画像 (任意)」は設置されていますか?
    ここが設置されていなくて、PCと同じスライド画像のため、見切れてしまっているのではないかと思いました。
    スマホは横幅が狭いので、スライドショーの画像は、ちょっと縦長サイズにしておくと文字が見切れないかもしれませんがいかがでしょうか。

    症状の確認できるサイトが見れると回答が得られやすくなりますので、差し支えなければURLを教えていただけると良いかもしれません。

    #68529

    うんと縦長のモバイル用スライド画像を使えば欠けないようにできるかもしれませんが…

    もしスライドが複数あるとしたら、240文字を読み終わる前に切り替わってしまうのではないか心配です。

    もしスライドが1枚だけなら、スライドショーを使わずに、Outer ブロックとかカバーブロックを使った方がいいのかもしれません。

    #68676

    ric
    参加者

    うなこさま、対馬様

    ご連絡ありがとうございました。遅くなりまして、すみません。

    モバイル用画像スライドは画像は同じですが、サイズがパソコン用2560 x 1707 ピクセル、モバイル用800 x 533のものを使っています。

    outerカバーも使用してみたのですが、パソコンではスライドショーと同様に表示されるのですが、モバイルでは画像右半分が表示されなくなってしまいました。

    画像サイズの調整方法がイマイチわかっていません。。
    よろしくお願い致します。

    HPアドレスです。https://sr-matsushima.com/

    #68680

    スライドが1枚だけなので、スライドショーを使わない方がレイアウトが楽だと思います。

    パターンライブラリーを探してみると、たぶん用途に合うものがあると思います。
    コピペだけで納得いくレイアウトができるかもしれません。

    HOME

    outerカバーも使用してみたのですが、パソコンではスライドショーと同様に表示されるのですが、モバイルでは画像右半分が表示されなくなってしまいました。

    Outer ブロックの場合、PC・タブレット・モバイルで別々の背景画像を使えば対応できそうです。

    カバー ブロックの場合、焦点ピッカーという機能を使えば表示位置の調整ができます。

    画像サイズの調整方法がイマイチわかっていません。

    WordPress トリミング」でググってみてください。やり方が紹介されています。

    または、お使いのパソコンに合わせて「Windows トリミング」「Mac トリミング」などで調べてみてください。

    それでは… 健闘を祈ります😊

    #68897

    ric
    参加者

    対馬さま

    たびたび、ありがとうございます。

    カバーブロックでやってみました!
    おかげ様で、モバイルでも文章全体が表示されました。

    Wordpressトリミング、トライしてみます!

6件の投稿を表示中 - 1 - 6件目 (全6件中)
  • このトピックに返信するにはログインが必要です。