如何在自定义 Wordpress 主题中添加 Responsive.css

Question

我是 wordpress 的新手。我创建了一个包含style.css、header.php 和index.php 和footer.php 的wordpress 主题。现在我想让我的index.php 页面响应，因为在调整 index.php 的浏览器窗口布局后变得很糟糕（在移动设备和其他手柄设备上无法正确查看）。

我想借助 @media 查询或引导程序使 index.php 响应。

请建议我如何使 index.php 成为响应式页面？

Answer 1

您需要在主题文件夹中的 functions.php 文件中使用 wp_enqueue_style() 函数注册您的 responsive.css 工作表。如果您没有此文件，只需创建它：

<?php

// Enqueue your files
function theme_enqueue_styles() {
    // If the current page is the homepage, then load the responsive.css file
    if(is_home()) {
        wp_enqueue_style( 'responsive', get_stylesheet_directory_uri() . '/css/responsive.css' );
    }
}

// Add action
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles', 15 );

然后您需要创建您的theme/css/responsive.css 文件并为您编写媒体查询和样式。

希望这会有所帮助！