WEB広告運用の困りごとが集まる場所 コミュニティ コミュニティ 画像が被って表示されるので調整したい

タグ付き: ,

  • 画像が被って表示されるので調整したい

    トピックス by xina ユーザーランク 83 pt  2023年10月3日 11:26 180 PV

    widget名:複数枚の画像を切り替える

    の下に画像を配置したいのですが、上の画像に被ってしまいます。

    別のwidgetと組み合わせたいので同一ページ内で作成したいのですが可能でしょうか。

    widgetマスター   7 月, 4 数週間前 2 人 · 14 コメント
  • 14 コメント
  • widgetマスター

    モデレータ
    2023年10月3日 11:49

    ご相談ありがとうございます!

    試しに同じWidgetで同じ状況を再現してみたのですが、同じ現象は確認できませんでした・・・。

    ページ:https://sb-draft-preview.squadbeyond.com/articles/xogVMpCpBCPDvCMiA/draft?token=28ead252ccc850e5f9bf8a1585af7250

    xinaさんが作成しているページのプレビューをご共有いただけますか?

    よろしくお願いします!

    • xina

      メンバー
      2023年10月3日 11:53

      https://sb-preview.squadbeyond.com/articles/ZGtjGzWsjbWFIPXgsNdg/preview

      こちらがプレビューになりますmm

      2枚目を切り替えずに表示させ続けるように調整したのですがそれが影響しているんでしょうか、、??

    • widgetマスター

      モデレータ
      2023年10月3日 11:55

      ご共有ありがとうございます!

      修正方法を確認させていただきます!

    • xina

      メンバー
      2023年10月3日 14:40

      お忙しいところ失礼いたします。

      こちらの方いかがでしたでしょうか、、??

    • widgetマスター

      モデレータ
      2023年10月3日 14:42

      確認中でございます!

    • widgetマスター

      モデレータ
      2023年10月3日 16:20

      お待たせいたしました!ご共有いただいたページで修正するとこのようになります!

      イメージ通りでしょうか?

      https://sb-draft-preview.squadbeyond.com/articles/MEVNOFRrZ-odWmazuIBJA/draft?token=6eb21b06714e2066f72a751c59981a0a

      それとも、下の画像を固定させたいのであれば、別のWidgetを使う必要があります。

      その場合、理想のページがあれば共有ください!(文字だけですと認識の齟齬が起きやすいので)

      よろしくお願いします!

    • xina

      メンバー
      2023年10月3日 16:27

      https://sb-preview.squadbeyond.com/articles/eLytHfeOFakgzBi-KpMag/preview

      ありがとうございますmm

      クーポンの画像の下(裏ではなく)に、アマギフの画像が来るようにしたいです。

      こちらのアンケート3つ目の質問回答後に、先ほどのWidgetを組み込みたく、

      別ウィジェットにしてしまうと回答後に表示ができなくなってしまうなと…

    • widgetマスター

      モデレータ
      2023年10月3日 16:47

      このようなイメージでしょうか!?

      https://t.gyazo.com/teams/squadbeyond/93df2b6ceab7292f6b4d9555af3ee7f3.png

    • xina

      メンバー
      2023年10月3日 16:51

      そのイメージになります、、!!

      更にその下に画像が連なってるのが理想になります🙇‍♂️

    • widgetマスター

      モデレータ
      2023年10月3日 17:06

      ご確認ありがとうございます!

      修正方法確認します!

    • xina

      メンバー
      2023年10月3日 17:09

      お手数おかけいたしますmm

  • widgetマスター

    モデレータ
    2023年10月3日 17:20

    お待たせいたしました!

    CSSを修正してください!!!

    【変更前】

    .img__box:before {
      /* ..省略... */
      padding-top: calc((800 / 800) * 100%); 
    } 

    【変更後】

    .img__box:before {
      /* ..省略... */
      padding-top: calc((1300 / 750) * 100%); /* 縦: 1300px / 横750px という形にします。切り替え後の画像に合わせてここを調整して下さい */
    } 

    プレビュー:https://sb-draft-preview.squadbeyond.com/articles/uCRUF-EjOdvdrAepTxA/draft?token=054da2579f7cc8dbe769a7d6d4f8ae8d

  • xina

    メンバー
    2023年10月3日 17:50

    できましたーーー!!!

    長い時間対応いただきありがとうございました;;

    • widgetマスター

      モデレータ
      2023年10月3日 17:52

      よかったです!

      こちらこそお待ちいただきましてありがとうございました!