分享笔记:

结合WooCommerce所有设置到同个界面

方便WooCommerce设置

文章目录

如果你觉得在WooCommerce调整各种不同的设置要切换不同的界面很麻烦,那么你可以用 Rodolfo Melogli 想出了一个办法,将所有的WooCommerce设置放在同一个页面上,这样可以更快捷、更简便地浏览设置它的全部选项。

通过点击上方的tabs它就会自动移动到对应的设置界面。

集成全部WooCommerce设置到一页

add_action( 'woocommerce_before_settings_general', 'bbloomer_woo_settings_tabs_navbar_replacement' );
 
function bbloomer_woo_settings_tabs_navbar_replacement() {
    
   $tabs = apply_filters( 'woocommerce_settings_tabs_array', [] );
    
   ?>
      <nav class="nav-tab-wrapper woo-nav-tab-wrapper infinite">
         <?php
 
         foreach ( $tabs as $slug => $label ) {
            echo '<a href="#' . $slug . '" class="nav-tab">' . esc_html( $label ) . '</a>';
         }
    
         ?>
      </nav>
             
      <style>
            .woocommerce nav.woo-nav-tab-wrapper:not(.infinite) { display: none }
            .woocommerce nav.woo-nav-tab-wrapper.infinite { background: Cornsilk; box-sizing: border-box; padding: 5px; position: sticky; top: 50px; z-index: 1001; margin: 0; width: calc(100% - 100px); }
      </style>
             
   <?php
}
 
add_action( 'woocommerce_after_settings_general', 'bbloomer_display_settings_tabs_content_after_general_one' );
 
function bbloomer_display_settings_tabs_content_after_general_one() {
    
   $tabs = apply_filters( 'woocommerce_settings_tabs_array', [] );
   unset( $tabs['general'] );
    
   foreach ( $tabs as $current_tab => $label ) {   
    
      echo '<hr id="' . $current_tab . '">';
      echo '<h1 style="text-transform:capitalize">' . $label . ' ' . __( 'Settings', 'woocommerce' ) . '</h1>';
 
      // SAVE SETTINGS
      if ( ! empty( $_POST[ 'save' . $current_tab ] ) ) {
         check_admin_referer( 'woocommerce-settings' );
         do_action( 'woocommerce_settings_save_' . $current_tab );
         do_action( 'woocommerce_update_options_' . $current_tab );
         do_action( 'woocommerce_update_options' );
         update_option( 'woocommerce_queue_flush_rewrite_rules', 'yes' );
         WC()->query->init_query_vars();
         WC()->query->add_endpoints();
         do_action( 'woocommerce_settings_saved' );
      }
 
      do_action( 'woocommerce_before_settings_' . $current_tab );
      ?>
         <form method="<?php echo esc_attr( apply_filters( 'woocommerce_settings_form_method_tab_' . $current_tab, 'post' ) ); ?>" id="mainform<?php echo $current_tab; ?>" action="" enctype="multipart/form-data">
      <?php
      do_action( 'woocommerce_sections_' . $current_tab );
      do_action( 'woocommerce_settings_' . $current_tab );
      ?>
         <p class="submit">
            <button name="save<?php echo $current_tab; ?>" class="woocommerce-save-button components-button is-primary" type="submit" value="<?php esc_attr_e( 'Save changes', 'woocommerce' ); ?>"><?php esc_html_e( 'Save changes', 'woocommerce' ); ?></button>
            <?php wp_nonce_field( 'woocommerce-settings' ); ?>
         </p>
         </form>
      <?php 
      do_action( 'woocommerce_after_settings_' . $current_tab );
    
   }
    
}

使用以上代码后就是以下效果:

集成全部WooCommerce设置到一页

为笔记评分

平均评分 5 / 5. 摘星者: 2

有疑问?留个言吧!

更多结果...

Generic selectors
Exact matches only
Search in title
Search in content
Post Type Selectors

更多结果...

Generic selectors
Exact matches only
Search in title
Search in content
Post Type Selectors