私は私のWordpressサイトのフロントページに固定幅のコンテンツスライダーを貼り付けました。私はスライダーを表示するためにindex.phpに含まれる小さなコードでTwenty Elevenテーマを使っています。テーマがモバイルブラウザを処理する方法のため残念なことに、それはそれに続くテーマの残りなしでスライダーがスクリーンを横切ってプッシュする原因となります。それで、私はスライダーをモバイルブラウザから隠す方法があるかと思いましたか?
テーマに挿入されたコードは次のとおりです。
<?php if (function_exists('rps_show')) echo rps_show(); ?>
そして文脈では:
<?php
get_header(); ?>
<p><h1 style="font-size:200%">Todays' featured posts</h1>
<?php if (function_exists('rps_show')) echo rps_show(); ?>
</br>
<div id="primary">
<div id="content" role="main">
<?php if ( have_posts() ) : ?>
<?php twentyeleven_content_nav( 'nav-above' ); ?>
<?php /* Start the Loop */ ?>
<?php while ( have_posts() ) : the_post(); ?>
<?php get_template_part( 'content', get_post_format() ); ?>
<?php endwhile; ?>
何か案は?
私は実際にCSSでそれを隠すことをお勧めします。これは必要なPHPコードを追加するよりもはるかに簡単です。
これを行うには、単にスタイルシートにメディアクエリーを追加します。
@media only screen and (max-device-width: 480px) {
.SliderClass{
display:none;
}
}
その後、モバイル版を正しく表示するために必要なCSSを追加することができます。メディアクエリに関する詳細情報は、次のURLにあります。
これはWP質問というよりはphpの質問ですが、すばらしい機能があります - ここ それはあなたが探していることをするものです。
function is_mobile() {
// Get the user agent
$user_agent = $_SERVER['HTTP_USER_AGENT'];
// Create an array of known mobile user agents
// This list is from the 21 October 2010 WURFL File.
// Most mobile devices send a pretty standard string that can be covered by
// one of these. I believe I have found all the agents (as of the date above)
// that do not and have included them below. If you use this function, you
// should periodically check your list against the WURFL file, available at:
// http://wurfl.sourceforge.net/
$mobile_agents = Array(
// List of mobile agents
);
// Pre-set $is_mobile to false.
$is_mobile = false;
// Cycle through the list in $mobile_agents to see if any of them
// appear in $user_agent.
foreach ($mobile_agents as $device) {
// Check each element in $mobile_agents to see if it appears in
// $user_agent. If it does, set $is_mobile to true.
if (stristr($user_agent, $device)) {
$is_mobile = true;
// break out of the foreach, we don't need to test
// any more once we get a true value.
break;
}
}
return $is_mobile;
}
その後、この関数を呼び出して、必要なものをすべてラップすることができます。
if (is_mobile()) {
// Place code you wish to execute if browser is mobile here
}
else {
// Place code you wish to execute if browser is NOT mobile here
}