質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

2回答

2323閲覧

ワードプレス SWITCHのテーマでスマホも動画が再生出来るようにしたい

satomisan

総合スコア5

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2021/06/03 05:23

編集2021/06/03 07:34

ワードプレスでSWITCHのテーマでサイトを作っているのですが、PC用ではトップは動画で、スマホでは画像が表示されるようになっています。これをスマホでも動画で見れるようにしたいのですがどうしたらいいでしょうか。

試したこと
.p-header-videoの部分のbackground-image:url()を消してみましたが、動画が表示されません。
display:noneも探してみましたが、見つからずでした。

わかる方がいれば教えて下さい。
https://demo.tcd-theme.com/tcd063/

php

1<?php $dp_options = get_design_plus_options(); ?> 2 3<?php if ( 'type1' === $dp_options['header_content_type'] ) : // Image ?> 4<div id="js-header-slider" class="p-header-slider" data-speed="<?php echo esc_attr( $dp_options['header_slider_animation_time'] * 1000 ); ?>"> 5 6 <?php 7 for ( $i = 1; $i <= 5; $i++ ) : 8 if ( ! $dp_options['header_slider_img' . $i] ) continue; 9 ?> 10 <div class="p-header-slider__item p-header-slider__item--<?php echo esc_attr( $i ); ?> p-header-content"> 11 <div class="p-header-content__inner"> 12 <div class="p-header-content__title<?php if ( 'type1' === $dp_options['header_slider_catch_writing_mode' . $i] ) { echo ' p-header-content__title--vertical'; } ?>"> 13 <span><?php echo nl2br( esc_html( $dp_options['header_slider_catch' . $i] ) ); ?></span> 14 </div> 15 </div> 16 <div class="p-header-slider__item-img p-header-slider__item-img--<?php echo esc_attr( $dp_options['header_slider_img_animation_type' . $i] ); ?>" data-animation="<?php if ( 'type3' !== $dp_options['header_slider_img_animation_type' . $i] ) { echo '1'; } ?>"></div> 17 </div> 18 <?php endfor; ?> 19 20</div> 21 22<?php elseif ( 'type2' === $dp_options['header_content_type'] ) : // Video ?> 23<div id="js-header-video" class="p-header-video p-header-content is-active"> 24 25 <?php if ( ! wp_is_mobile() ) : ?> 26 <video autoplay loop muted> 27 <source src="<?php echo esc_attr( wp_get_attachment_url( $dp_options['header_video'] ) ); ?>"> 28 </video> 29 <?php endif; ?> 30 31 <div class="p-header-content__inner"> 32 <div class="p-header-content__title<?php if ( 'type1' === $dp_options['header_video_catch_writing_mode'] ) { echo ' p-header-content__title--vertical'; } ?>"> 33 <span><?php echo nl2br( esc_html( $dp_options['header_video_catch'] ) ); ?></span> 34 </div> 35 </div> 36</div> 37 38<?php elseif ( 'type3' === $dp_options['header_content_type'] ) : // YouTube ?> 39<div id="js-header-youtube" class="p-header-youtube p-header-content is-active"> 40 41 <?php if ( ! wp_is_mobile() ) : ?> 42 <div id="js-header-youtube__player" class="p-header-youtube__player" data-video-id="<?php echo esc_attr( $dp_options['header_youtube_id'] ); ?>"></div> 43 <?php endif; ?> 44 45 <div class="p-header-content__inner"> 46 <div class="p-header-content__title<?php if ( 'type1' === $dp_options['header_youtube_catch_writing_mode'] ) { echo ' p-header-content__title--vertical'; } ?>"> 47 <span><?php echo nl2br( esc_html( $dp_options['header_youtube_catch'] ) ); ?></span> 48 </div> 49 </div> 50</div> 51<?php endif; ?>

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

ベストアンサー

モバイルからのアクセスかどうかを判定して、モバイル以外のときにVIDEOを再生してるので、無条件にVIDEOを再生するのであれば、
判定をしている部分の

<?php if ( ! wp_is_mobile() ) : ?>

<?php endif; ?>

をそれぞれ削除してあげれば、VIDEOが再生されるはずです。

投稿2021/06/07 10:04

flannel

総合スコア38

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

直接の回答になっていませんが、gif動画をアップロードすることでSWITCHのテーマでスマホも動画が再生出来るようになります。

投稿2023/05/02 02:50

sssbbb123

総合スコア2

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問