モバイル機器では、画面が拡大/縮小されないように設定する
最近出てくるほとんどの WordPress反応型（Responsive）に出てくるので、モバイル機器では、自動的にモバイル版が表示されます。 モバイル版で指を広げたり、オムリ、画面が拡大/縮小されないように設定するには、次のコードをheader.phpファイルに追加するようにします。
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
もし メタタグが header.phpの ファイルに既に存在する場合 ユーザースケーラブル=いいえを追加するだけです。 Viewportをサポートするいないデバイスの場合、次のコードを追加します。
<meta name="HandheldFriendly" content="true" />
インターネットエクスプローラ（IE）10バージョンで正常に動作していない場合、 -ms-content-zooming：none | zoom 構文を使用します（ここ を参照）。 たとえば、次のようなCSSコードをスタイルシートファイルに追加するようにします。
html {
-ms-content-zooming: none;
-ms-touch-action: pan-x pan-y;
}
// Source: stackoverflow
モバイル機器から水平方向にスクロールされないようにする
モバイルデバイスから横（水平）にスクロールされないようにするには、次のようなコードを試してください。
body{ width:320px; // 혹은 적당한 크기 또는 100% overflow-x:hidden; }
これはもはや有効ではないとMatthewが教えてくれました。 iPhone、スマートフォンのメディアクエリは「iPad、iPhone、スマートフォンなどのモバイル機器に使用可能なメディアクエリ「を参考にしてください。
追加： WordPress OceanWP テーマのモバイルズーム
인기 WordPress テーマの一つである OceanWP テーマを使用している場合は、モバイルモードで拡大/縮小がされないようにするには、次のようなコードを使用しているテーマの関数ファイルに追加します。 必ずチャイルドテーマを作成作業してください。
// Disable Scaling in mobile mode
add_filter('ocean_meta_viewport', 'owp_child_viewport');
function owp_child_viewport( $viewport ){
$viewport = '<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">';
return $viewport;
}
こんにちは〜divi使用中です。
もしかしたら逆にviewportを使用する場合には、yesのみ変更してマキシマムを8に設定してheader.phpを変更したなら理由が難しいですね。
読んでいただきありがとうございます。
Diviテーマを使用する場合は、開発者への支援を要請することができます。
サポートリクエストの方法は、次の記事を参照してください。
https://avada.tistory.com/1591
1。 水平方向にスクロールダメするコードは、style.cssに入れるんですか？
2。 私 WordPress上のホームページの余白を指定したが、携帯電話でも余白がそのまま出てガジグㅠ
もしかしたら、携帯電話で見ると余白をなくす方法があるでしょう？
これのためにwptouchをインストールした消し、最初のコードを（header.phpの）消し入れたㅠㅠㅠ
こんにちは？
ブログを訪問していただきありがとうございます。
1。 CSSは、コードはスタイルシートファイル、すなわちstyle.cssファイルに配置します。 しかし、チャイルドテーマを作成したり、テーマ内でのCSSを入れるセクションがある場合、直接入れても良いです。
https://www.thewordcracker.com/basic/how-to-add-css-in-wordpress/ 文を参考にしてください。
2。 メディアクエリを使用してください。
https://www.thewordcracker.com/miscellaneous/how-to-modify-the-wordpress-layout-for-mobile-devices/ 記事で "// Only applies to mobile device screens whose minimum width is 768px" とされているコード部分に余白指定するコードを入れると、解像度が 768px 以上のデバイスでのみそのコードが適用されます。
回答ありがとうございます！ もっとさらにお尋ね見たく笑
1。 ユーチューブ映像の場合には、反応型にならず、固定されたサイズをそのまま維持しようとしてモバイルでは、ゾーンを外れたんですよ、私overflowコードを使用すると、解決になると思っていた、まだダメですね。 もしかしたら、他の方法があるでしょうか？
2。 ハムすでに WordPress- ページ上でvisual composerで余白が指定されていて、768px以下の機器に書かれた余白をなくすコードを挿入しようとし
@media only screen and（max-width：768px）{
.vc_row {
パディング - 右：0;
padding-left：0;
}
}
ヨロトゲスタイルシートに入れたのですがない理由はなにでしょうㅠ笑？
私の '.vc_row'にbodyも入れてみてelement.styleも入れて報告したのもダメですね
こんにちは？
1. https://www.thewordcracker.com/miscellaneous/make-youtube-and-vimeo-vides-responsive/ 文を参照してみてください。
2。 VCは予想外のバグが多くのプラグインです。 なるべく使用しないことをお勧めレイアウト作業に慣れていない場合、使用する必要がありすることがあります。 （https://www.thewordcracker.com/basic/pros-and-cons-of-page-builder-of-wordpress/ 参考）
まずpadding-right：0！important;のように！importantを指定してテストしてみてください。
そして、visual composer内での余白を指定することができそうです。 そのような部分をチェックしてみてください。
よくないと、VC販売者に支援を要請してみません？
1。 とありがとうございます！ すべての場合の解決方法が既に投稿がされていますね！ 笑
2。 ㅠネ、最初からvcを使用せずにいる場合を分けて、スタイルシートにすることを試みて見なければならなりません。
回答ありがとうございます！
ボングルに紹介されているcssは絶対に使用しないでください。 （ワード様は申し訳ありません）
文一つ作成している偶然このコメントを見るたが、iPhoneの6のwidthは375pxは、iPhone 6 +のwidthは414px。
このように機器ごとにdevice widthが異なりますので、ワードさんが作成したwidth：320pxそれは非常に長い時間前に（iPhoneの4時代）使用可能だったようであり、今ではあのようにcss作成といけません。
モバイル機器でwidthは、常に反応型で作成する必要があります。
「モバイルでも余白がそのまま出てくるなぁ」 - 「レスポンシブcss作成」のような単語でグーグルすると、cssの作成方法をお知らせする文がハングルでも検索されます。 特定のトラブルシューティングを行うのではなく、cssを理解しようとすることをお勧めします。
今解決ハシリョヌン問題はcssのmedia queryを理解すると、簡単に解決できる問題です。
こんにちは？
良い点ありがとうございます。
おそらく引用したワン文では、width：320px;となっているが、私はwidth：100％;にしてテストをしたようです。 （少し長くなって正確に思い出せないですね。）
一番最後にあるCSSコードは削除するようにします。
あなたの現在の余白をパーセントで調整して、携帯電話でも余白が多く見えないようにしてノトギンしたが、
お知らせいただいた方法で、一度検索して調べボギンなければなりませんね〜^^ありがとうございます。
横にスクロールしないようにすることはできませんか？ 拡大はできませんが、横にスクロールすると画面が横に移動します。
こんにちは？
モバイル機器から水平方向にスクロールされないようにする方法を追加しました。 楽しい一日を^^