CODEWITHSUNDEEP
csswordpresswoocommercehook-woocommercewoothemes
Ferna
Ferna

Reputation: 97

Remove header from the WooCommerce administrator panel

Using the storefront theme, I want to remove breadcrumbs when logged in to the administrator panel WooCommerce |Products Store Activity| Inbox| Orders| Stock| Reviews| Notices| breadcrumbs.

Please note this: I need if you are logged in as the current user, not an administrator. The code I used using CSS:

.woocommerce-layout__header-breadcrumbs {
   display: none !important;
}
.woocommerce-layout {
   display: none !important;
}

Screenshot

Upvotes: 5

Views: 5948

Answers (7)

Mizuho Ogino
Mizuho Ogino

Reputation: 384

After WooCommerce 5.2, we have to cancel the margin of #wpbody. This code snippet is the revised version of itzmekhokan's and still is active.

add_action( 'admin_head', function (){
  remove_action( 'in_admin_header', array( 'Automattic\WooCommerce\Admin\Loader', 'embed_page_header' ) );
  echo '<style>#wpadminbar + #wpbody { margin-top:0; }</style>';
});

---Addition---

The class name has changed from around version 6.5.

add_action( 'admin_head', function (){
  remove_action( 'in_admin_header', array( 'Automattic\WooCommerce\Internal\Admin\Loader', 'embed_page_header' ) );
  echo '<style>#wpadminbar + #wpbody { margin-top:0; }</style>';
});

Upvotes: 3

Chris Stewart
Chris Stewart

Reputation: 81

As of 28 March 2020, for all users, the following code removes the new Woocommerce Header added into the WordPress Admin. Put the following in your theme's functions.php file:

// Disable WooCommerce Header in WordPress Admin
add_action('admin_head', 'Hide_WooCommerce_Breadcrumb');

function Hide_WooCommerce_Breadcrumb() {
  echo '<style>
    .woocommerce-layout__header {
        display: none;
    }
    .woocommerce-layout__activity-panel-tabs {
        display: none;
    }
    .woocommerce-layout__header-breadcrumbs {
        display: none;
    }
    .woocommerce-embed-page .woocommerce-layout__primary{
        display: none;
    }
    .woocommerce-embed-page #screen-meta, .woocommerce-embed-page #screen-meta-links{top:0;}
    </style>';
}

Upvotes: 8

itzmekhokan
itzmekhokan

Reputation: 2768

Add the following code snippet to your active theme's functions.php file -

remove_action( 'in_admin_header', array( 'WC_Admin_Loader', 'embed_page_header' ) );

Upvotes: -2

m4n0
m4n0

Reputation: 32345

That code would work fine, but the question is where do you use it? The CSS would affect only the frontend while the Admin End has a different style sheet source. You can try adding an Add Admin CSS plugin to post that code or use a custom action like this below in your function.php file:

add_action('admin_head', 'Hide_WooCommerce_Breadcrumb');

function Hide_WooCommerce_Breadcrumb() {
  echo '<style>
    .woocommerce-layout__header-breadcrumbs {
      display: none;
    }
  </style>';
}

Output:

Enter image description here

Upvotes: 3

babakfp
babakfp

Reputation: 334

// Removing the embedded element.
#woocommerce-embedded-root {
  display: none !important;
}
// Removing the empty spacing after removing the embedded element.
#wpbody {
  margin-top: unset !important;
}

Upvotes: 0

WP Development
WP Development

Reputation: 21

function wp_custom_css() {
    echo '<style>
    .woocommerce-embed-page #wpbody .woocommerce-layout, .woocommerce-embed-page .woocommerce-layout__notice-list-hide+.wrap {
        padding-top: 10px;
    }
    .woocommerce-embed-page #screen-meta, .woocommerce-embed-page #screen-meta-links {
        top: 0px;
    }
    .woocommerce-layout__header {
        display: none;
    }
    .woocommerce-layout__activity-panel-tabs {
        display: none;
    }
    .woocommerce-layout__header-breadcrumbs {
        display: none;
    }
    </style>';
}
add_action('admin_head', 'wp_custom_css');

Upvotes: 2

M Osama Amin
M Osama Amin

Reputation: 1

UPDATED 2020:

function Hide_WooCommerce_Breadcrumb() {
    echo '<style>
    .woocommerce-layout__header {
        display: none;
    }
    .woocommerce-layout__activity-panel-tabs {
        display: none;
    }
    .woocommerce-layout__header-breadcrumbs {
        display: none;
    }
    </style>';
}

Upvotes: 0

Related Questions