Q.トップページスライダーをPCにだけ設定し、スマホでは表示させないようにしたい
トップページスライダーをスマホでは非表示にして、第2ブロックから表示させたいです。変更方法を教えてください。
A.下記のphpファイルの該当箇所を編集してください
編集するファイル:page-welcome.php
編集する箇所:
<div id="site-cover"></div> <?php if(!is_mobile()): ?> <section> <div class="slider heightasviewport has-background" data-order='0' data-parallax="scroll" data-image-src="<?php echo $options['slider_image1']; ?>"></div> <div class="slider heightasviewport has-background" data-order='1' data-parallax="scroll" data-image-src="<?php echo $options['slider_image2']; ?>"></div> <div class="slider heightasviewport has-background" data-order='2' data-parallax="scroll" data-image-src="<?php echo $options['slider_image3']; ?>"></div> <div id="topcover" class="topcover heightasviewport"> <div class="text-center verticalcentersplash amore-welcome-center"> <?php if($options['first_auto_br']): ?> <h2 class="first-h1"><?php echo nl2br($options['h1_text']); ?></h2> <?php else: ?> <h2 class="first-h1"><?php echo $options['h1_text']; ?></h2> <?php endif; ?> </div> </div> <div class="topcover heightasviewport" style="opacity:1;-ms-transform:translate(0px,0px);-webkit-transform:translate(0px,0px);transform:translate(0px,0px);"></div> <div id="top" class="heightasviewport" style="opacity:1; background:transparent"> <a href="#third" class="animate"><div class="down-arrow bounce"><span class="fa fa-angle-down"></span></div></a> </div> </section> <?php else: ?> <?php endif; ?>
※ハイライト部分を追加します。
この記事は役に立ちましたか?
もし参考になりましたら、下のボタンで教えてください。
今後の記事作成の参考とさせて頂きます!