FROM CACHE - jp_header

動画の幅を広げる方法【Debut】

shinma
新規メンバー
7 0 0

 

利用しているテーマ【Debut】で、

動画の幅がブラウザの幅よりも狭くなっています。

(画像の場合はブラウザの幅と同じ)

image.png

 

動画の幅を広げたいのですが、

他のトピックを参考にして、

下記のCSSを追加しましたが、動画の幅は広くなっていません。

#shopify-section-16130811791aaff9c7 .wrapper {
width: 100%; max-width: 100%; padding: 0; }

 

shinma_1-1613599076147.png

 

動画の幅を広げる方法をご教授いただけますと幸いです。

6件の返信6
Jizo_Inagaki
Shopify Partner
580 238 551

動画の場所と参考にされたトピックが不明なのであっているかわかりませんが、ホームページの動画セクション(テーマのカスタマイズで追加できる箇所)のことでしたら以下の指定で実現できるのではと思われます。
※ID部分はご質問に記載されているそのままをペーストしています

#shopify-section-16130811791aaff9c7 .page-width{
 padding-left:0;
 padding-right:0;
 max-width:none;
}

 

見当違いでしたら申し訳ありません。

Jizo_Inagaki | フリーランスのwebデザイナー
- テーマのカスタム承れます。
- 記載した回答で解決できましたらベストソリューションの承認をお願いします。
- DMや指名による対応はご依頼として有料でのみ承ります。
shinma
新規メンバー
7 0 0

jizo様

ありがとうございます。

はい、動画は動画セクションで追加したTOP動画です。

最初の投稿では上にも画像があるように見えますが、

TOP動画にしたいです。

参考にしたページは英語でvideo widthなどと検索したのですが、ブックマークなどしていなかったので今ぱっと見つかりません…

theme.css

@import "custom.css"

custom.css

#shopify-section-16130811791aaff9c7 .page-width{
padding-left:0;
padding-right:0;
max-width:none;
}

としているのですが、

動画の幅はブラウザより短くなっています。

 

 

 

Jizo_Inagaki
Shopify Partner
580 238 551

確認いただきありがとうございます。

スクリーンショット 2021-02-23 7.25.52.png

こちらで初期状態のDebutを用いて試した際には、上記画像のように全幅で表示されていましたので、残念ながらこれ以上はお役に立てないように思います。

なお現状お伝えできるアドバイスとしては以下になります。

  • ブラウザの開発者ツールを使って幅制限をしている要素を見つけ、そこを変更できるようなCSSを書く

 

お役に立てず申し訳ありません。

 

Jizo_Inagaki | フリーランスのwebデザイナー
- テーマのカスタム承れます。
- 記載した回答で解決できましたらベストソリューションの承認をお願いします。
- DMや指名による対応はご依頼として有料でのみ承ります。
shinma
新規メンバー
7 0 0

jizo様

アドバイスありがとうございます。

こちらでも初期状態では全幅になっておりましたが、

どの要素が制限しているのか、

もう一度最初から試して確認してみます。

shinma
新規メンバー
7 0 0

jizo様

度々失礼いたします。

jizo様に画像で提示していただいた状態を再現できませんので、

手順を詳しく教えていただけますと幸いです。

 

もう一度、テーマを探すからDebutをダウンロードしました。

カスタマイズ>セクションを追加する のところで「動画」を選択されたのでしょうか。

 

Jizo_Inagaki
Shopify Partner
580 238 551

スクリーンショット 2021-02-24 8.50.25.png

上記画像の赤枠となりますので、書かれている場所と同じかと思います。

あとは最初の記載しました記述をtheme.cssに追加しています。

Jizo_Inagaki | フリーランスのwebデザイナー
- テーマのカスタム承れます。
- 記載した回答で解決できましたらベストソリューションの承認をお願いします。
- DMや指名による対応はご依頼として有料でのみ承ります。