Question

如何让搜索介于标题第二行的 storefront_primary_navigation 和 storefront_header_cart 之间？使用下面的PHP代码。如果我在CSS中进行这些更改，它在移动设备上看起来很难看。这可以用PHP完成吗？如果是，我应该在哪个文件中进行更改？有哪些更改？

现在我在标题中有两行：
第一行：徽标| secondary_navigation | PRODUCT_SEARCH
第二行：primary_navigation | header_cart

现在标题如下：

PHP：

<header id="masthead" class="site-header" role="banner" <?php if ( get_header_image() != '' ) { echo 'style="background-image: url(' . esc_url( get_header_image() ) . ');"'; } ?>>
        <div class="col-full">

            <?php
            /**
             * @hooked storefront_skip_links - 0
             * @hooked storefront_social_icons - 5
             * @hooked storefront_site_branding - 10
             * @hooked storefront_secondary_navigation - 15
             * @hooked storefront_product_search - 20
             * @hooked storefront_primary_navigation - 25
             * @hooked storefront_header_cart - 30
             */
            do_action( 'storefront_header' ); ?>

        </div>

需要输出 第一行：徽标| secondary_navigation
第二行：primary_navigation | product_search | header_cart

Manoj更改：

Answer 1

您需要找到名为＆＃39; storefront_header＆＃39;的操作。搜索您的主题文件。如果您正在使用sublime text 2并打开主题目录，则可以使用ctrl-shift-f一次搜索所有文件。

Answer 2

这类似于问题/答案：Sample product, Change location of price并且很高兴您对那里的答案发表了评论;）

PHP编辑：

在下面的代码中，您将覆盖Storefront hook包含/优先级顺序。因此，storefront_product_search将包含在优先级值为25的storefront_primary_navigation之后。

在functions.php中包含以下代码。

remove_action( 'storefront_header', 'storefront_product_search', 20 );

add_action( 'storefront_header', 'storefront_product_search', 26 );

CSS编辑：

.woocommerce-active .site-header .main-navigation {
  width: 58.913%; /* Changed to occupy the Search in same line */
}

.site-search:nth-of-type(1) {
   display: none; 
}

第二个CSS规则是删除第一次出现的搜索栏的黑客，它不是标准解决方案。由于我无法访问您的PHP代码，因此很难预测两个搜索栏问题的原因。可能有其他操作干扰了钩子并撤消了remove_action PHP代码，或者优先级在其他地方发生了变化。

<强>输出：

header.php |改变搜索的位置

2 个答案: