php - 在使用 PHP 构建的网站上构建 DIV 布局

标签 php html css

我们刚刚为即将推出的 Woocommerce 网站购买了股票主题 Blockshop。这里的团队熟悉 HTML 和 CSS,我们对 PHP 的用途了解不多,但没有应用或更改它的真正知识。

在我们的类别页面上,有一个包含两个过滤器的 DIV - 一个产品过滤器和一个按过滤器排序 - 我们希望将其重新定位在类别描述下方,以使页面更易于理解。

这是一个填充类别页面的示例:https://onemanmusic.co.uk/yamaha-clp-clavinova/ - 你会从页面源代码中看到有问题的 DIV 是“shop-header-wrapper visible” - 理想情况下,我们希望它显示在 woocommerce-products-header DIV 下方(如果有的话)可能,但我们都不知道在主题文件中的何处找到相关的 HTML。

我对 PHP 正在调用过滤器函数以显示的内容有一个模糊的理解,但我不知道如何让它显示在所需的位置。

我找到了有问题的脚本,我可以更改它并将它从显示中删除,但我似乎无法重新定位它:

if ( ! function_exists( 'blockshop_shop_archive_header' ) ) :
    /**
     * Header area for Shop Archive
     */
    function blockshop_shop_archive_header() {
        if ( is_shop() || is_product_category() || is_product_tag() ) :
            $categories = get_terms(
                'product_cat',
                array(
                    'hide_empty' => 0,
                    'parent'     => 0,
                )
            );
            if ( woocommerce_get_loop_display_mode() === 'subcategories' || woocommerce_get_loop_display_mode() === 'both' ) {
                $subcategories = $categories;
            }

            $current_cat = 0;
            if ( is_product_category() ) {
                global $wp_query;
                $current_cat    = $wp_query->get_queried_object();
                $current_cat_id = isset( $current_cat->term_id ) ? $current_cat->term_id : 0;
                if ( 0 !== $current_cat_id ) {
                    $subcategories = get_terms(
                        'product_cat',
                        array(
                            'hide_empty' => 0,
                            'parent'     => $current_cat_id,
                        )
                    );
                }
            }
            ?>
        <div class="shop-header-wrapper">
            <div class="shop-header-block">
                <div class="filter">
                    <?php if ( is_active_sidebar( 'shop-filters-widgets' ) ) : ?>
                        <span class="toggle-filter">
                            <i class="icon-filter"></i><span><?php esc_html_e( 'Filter', 'block-shop' ); ?></span>
                        </span>
                    <?php endif; ?>
                </div>
                <?php if ( 'yes' === BlockShop_Opt::get_option( 'category_menu' ) ) : ?>
                <div class="shop-categories">
                    <ul class="shop-list">
                    <?php
                    $shop_page_url = get_permalink( wc_get_page_id( 'shop' ) );
                    if ( ! empty( $shop_page_url ) ) :
                        ?>
                        <li class="cat-item 
                        <?php
                        if ( is_shop() ) {
                            echo 'current-cat';}
                        ?>
                        ">
                            <?php
                            if ( is_shop() ) {
                                echo '<h1>';}
                            ?>
                            <a href="<?php echo esc_url( $shop_page_url ); ?>"><?php echo esc_html( get_the_title( wc_get_page_id( 'shop' ) ) ); ?></a>
                            <span class="count"><?php echo esc_html( wc_get_loop_prop( 'total' ) ); ?></span>
                            <?php
                            if ( is_shop() ) {
                                echo '</h1>';}
                            ?>
                        </li>
                        <?php
                    endif;
                    if ( ! empty( $categories ) ) :
                        foreach ( $categories as $cat ) :
                            if ( 0 === $cat->count ) {
                                continue;
                            }
                            ?>
                            <li class="cat-item 
                            <?php
                            if ( isset( $current_cat_id ) && $current_cat_id === $cat->term_id ) {
                                echo 'current-cat';}
                            ?>
                            ">
                                <?php
                                if ( isset( $current_cat_id ) && $current_cat_id === $cat->term_id ) {
                                    echo '<h1>';}
                                ?>
                                <a href="<?php echo esc_url( get_term_link( $cat->slug, 'product_cat' ) ); ?>"><?php echo esc_html( $cat->name ); ?></a>
                                <span class="count"><?php echo esc_attr( $cat->count ); ?></span>
                                <?php
                                if ( isset( $current_cat_id ) && $current_cat_id === $cat->term_id ) {
                                    echo '</h1>';}
                                ?>
                            </li>
                            <?php
                        endforeach;
                    endif;
                    ?>
                    </ul>
                    <?php the_widget( 'WC_Widget_Layered_Nav_Filters' ); ?>
                </div>
                <?php endif; ?>
                <div class="sort-products">
                        <?php do_action( 'blockshop_woocommerce_catalog_ordering' ); ?>
                </div>
            </div>
                <?php if ( is_active_sidebar( 'shop-filters-widgets' ) ) : ?>
            <div class="expanded-filter">
                <div class="woocommerce-widgets-wrapper">
                    <?php dynamic_sidebar( 'shop-filters-widgets' ); ?>
                </div>
            </div>
            <?php endif; ?>
        </div>
            <?php
        endif;
    }
endif;
add_action( 'woocommerce_before_main_content', 'blockshop_shop_archive_header', 10 );

我原以为能够简单地将代码剪切并粘贴到正确的位置,但显然这不是有问题的布局。

如果这非常明显,请提前致歉。

最佳答案

要修改它,您需要从您的代码中更改渲染顺序

add_action( 'woocommerce_before_main_content', 'blockshop_shop_archive_header', 10 );

此代码块将优先级设置为 10,因此为了使其出现在 woocommerce-products-header 之后,您需要为 blockshop_shop_archive_header 分配更高的优先级。

请参阅文档摘录

add_action(string $tag, callable $function_to_add, int $priority = 10, int $accepted_args = 1)

$priority

(int) (Optional) Used to specify the order in which the functions associated with a particular action are executed. Lower numbers correspond with earlier execution, and functions with the same priority are executed in the order in which they were added to the action.

Default value: 10

执行顺序由 $priority 决定,因此在您的实例中,如果您将大于 woocommerce-products-header 的优先级分配给 blockshop_shop_archive_header 它应该出现在它之后。

请参阅documentation了解更多信息

关于php - 在使用 PHP 构建的网站上构建 DIV 布局,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58339798/

相关文章:

php - 如何在 CodeIgniter 中执行我的 SQL 查询

php - 按 XXX 排序按 ASC 或 DESC 排序,动态排序,mysql ...

javascript - 在我的图标上方绘制蓝色小方 block

javascript - 更改 HTML 行中单元格的索引

javascript - jQuery 根据月份显示日期

php - 如何根据数组的长度循环数组

php - 以某个字符串开头并忽略那些包含特定字符串的正则表达式

javascript - 两个 Onclick 函数,ajax/php 或 JS。首先调用什么?

python - 如何从网页python获取所有可复制文本

javascript - 无法设置 css 权限属性