ホームページ >CMS チュートリアル >&#&プレス >wordpressのサブテーマをモバイル端末のみに表示させる方法
次の手順に従って、モバイル デバイスでのみ表示される WordPress のセカンダリ テーマを作成できます。 モバイル スタイルを適用する特定のメディア クエリを含む子テーマを作成します。子テーマの style.css ファイル内のメディア クエリ ブロックを編集して、モバイル固有のスタイルを追加します。子テーマをアクティブ化して、モバイルデバイスで表示できるようにします。
WordPress でモバイル専用のセカンダリ テーマを作成する方法
WordPress では、モバイル専用のセカンダリ テーマを作成できます。 WordPress のセカンダリテーマで複数のトピックを管理します。これにより、デスクトップ、ラップトップ、モバイル デバイスなどのさまざまなデバイス向けにカスタマイズされたエクスペリエンスを作成できます。この記事では、モバイル専用のセカンダリ テーマを作成する方法について説明します。
ステップ 1: 子テーマを作成する
子テーマを作成すると、元のコードに影響を与えることなくメイン テーマを変更できます。 WordPress ダッシュボードに移動し、[外観] > [テーマ] に移動して、[新規追加] をクリックします。検索バーに「サブトピック」と入力し、「追加」を選択します。
ステップ 2: 子テーマの style.css ファイルを編集する
子テーマのディレクトリで、style.css ファイルを開きます。次のコードを追加します:
<code>@media screen and (max-width: 600px) { /* 在这里添加您的移动端特定样式 */ }</code>
これにより、画面幅が 600 ピクセル未満の場合にのみスタイルを適用するメディア クエリが作成されます。必要に応じて、最大幅の値を調整できます。
ステップ 3: モバイル固有のスタイルを追加する
メディア クエリ ブロック内に、モバイルに適用するスタイルを追加します。フォント サイズ、色、レイアウト、その他の要素をカスタマイズして、モバイル エクスペリエンスを最適化できます。
ステップ 4: 子テーマを有効にする
style.css ファイルを保存し、WordPress ダッシュボードに戻ります。 [外観] > [テーマ] で、新しい子テーマが表示されるはずです。アクティブ化すると、モバイル デバイスに表示されます。
ステップ 5: モバイル表示をテストする
モバイル デバイスまたはエミュレーターを使用してサイトをプレビューします。子テーマに追加したスタイルがモバイル ビューにのみ適用されることがわかります。
ヒント:
以上がwordpressのサブテーマをモバイル端末のみに表示させる方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。