Question

我目前正在使用Wordpress网站。在导航栏中有菜单＆＃34;更多＆＃34;包含各种子菜单。如果视口等于或高于768px，我想要这个＆＃34;更多＆＃34;消失，而是显示其他子菜单。

这是代码块，负责＆＃34;更多＆＃34; functions.php中的按钮：

$more_button_options = apply_filters( 'monstroid2_theme_more_button_options', array(
'more_button_type'             => get_theme_mod( 'more_button_type', monstroid2_theme()->customizer->get_default( 'more_button_type' ) ),
'more_button_text'             => get_theme_mod( 'more_button_text', monstroid2_theme()->customizer->get_default( 'more_button_text' ) ),
'more_button_icon'             => get_theme_mod( 'more_button_icon', monstroid2_theme()->customizer->get_default( 'more_button_icon' ) ),
'more_button_image_url'        => get_theme_mod( 'more_button_image_url', monstroid2_theme()->customizer->get_default( 'more_button_image_url' ) ),
'retina_more_button_image_url' => get_theme_mod( 'retina_more_button_image_url', monstroid2_theme()->customizer->get_default( 'retina_more_button_image_url' ) ),
) );

wp_localize_script( 'monstroid2-theme-script', 'monstroid2', apply_filters(
'monstroid2_theme_script_variables',
array(
'ajaxurl'             => esc_url( admin_url( 'admin-ajax.php' ) ),
'labels'              => $labels,
'more_button_options' => $more_button_options,
) ) );

到目前为止，我的解决方案只是删除了这个块，但是它产生了另一个问题，因为汉堡图标（显示在768px下）不再可以点击并且弄乱我的整个导航栏。

我在functions.php中考虑了一个简单的IF / ELSE声明，具体取决于视口的宽度。但PHP是基于服务器的语言。我知道如何使用Javascript检测宽度，但我无法弄清楚如何将此信息发送给PHP。我已经搜索过，但确实找不到解决方案。

有人可以帮忙吗？

Answer 1

在如何提供网页的前端和后端流程之间存在根本的误解。 PHP（超文本预处理器）在服务器上运行，并生成由Web服务器提供给用户的HTTP响应。 HTTP响应（HTML，CSS，JS）由用户的浏览器解析，然后运行前端脚本（Javascript）。基于用户视口，您无法使用PHP执行任何操作（除非您使用AJAX使用此信息命中某个端点）。

Answer 2

使用PHP处理视口的过程太长而且非常糟糕。使用CSS隐藏＆gt;上的元素768px和其他尺寸相同：）

最好是CSS来完成这项工作。

Wordpress：我希望我的PHP表现不同，具体取决于视口的宽度

2 个答案: