ホテル・結婚式場などのホームページがつくれるエレガントなデザインのテンプレート「CANON」

ワードプレステーマ別

TCDテーマPrecious:スマホサイトでトップページスライダーを非表示にする方法

WordPressテーマ「NULL」

TCD LABOはWordPressテーマ「NULL」を使用して作られています。

ダウンロード

Q.スマホサイトではトップスライダーを表示しないようにするには?

スマートフォンではデータ受信量の都合上、サイト表示が遅くなる可能性があります。そこでスマホサイト表示でのみトップページスライダーを非表示にしたいのですが、方法はありますか。

A.下記のファイルをご編集ください

スライダーを表示する部分をif(!is_mobile()){・・・}で囲むとスマホでは非表示になります。

preciousの場合
編集するファイル:header.php
編集する箇所:
変更前

<?php if($options['index_main_image1']) { ?>
<?php if (!empty($options['index_main_image1'])) { ?><img id="slider_base" src="<?php esc_attr_e( $options['index_main_image1'] ); ?>" alt="" /><?php }; ?>
   <div id="slider">
    <?php for($i = 1; $i <= 5; $i++): ?>
    <?php if (!empty($options['index_main_image'.$i])) { ?><img src="<?php esc_attr_e( $options['index_main_image'.$i] ); ?>" alt="" /><?php }; ?>
    <?php endfor; ?>
   </div>
<?php }; ?>


変更後

 <?php if($options['index_main_image1']) { ?>
<?php if(!is_mobile()){ ?>
  <?php if (!empty($options['index_main_image1'])) { ?><img id="slider_base" src="<?php esc_attr_e( $options['index_main_image1'] ); ?>" alt="" /><?php }; ?>
  <div id="slider">
   <?php for($i = 1; $i <= 5; $i++): ?>
   <?php if (!empty($options['index_main_image'.$i])) { ?><img src="<?php esc_attr_e( $options['index_main_image'.$i] ); ?>" alt="" /><?php }; ?>
   <?php endfor; ?>
  </div>
<?php }; ?>
  <?php }; ?>

この記事は役に立ちましたか?

もし参考になりましたら、下のボタンで教えてください。
今後の記事作成の参考とさせて頂きます!

同じテーマのカスタマイズ記事