WooCommerce - How to remove sidebar - woocommerce

I need to remove sidebar into my woocommerce store.
I have tried with backend in option theme and in each category but resultless.
I tried also:
1.file wp-template-hooks.php
removed--> do_action(..
2.file archive-product.php
removed--> do_action(..
insert in file function.php in theme dir and function.php in woocommerce dir
remove_action( 'woocommerce_sidebar', 'woocommerce_get_sidebar', 10 );
into database there is 2 tables with 2 fields serialised but is a risk change this.
resulless.
I finished the ideas.
Where is saved into db the visibility of sidebar? or the variable?
Can you help me?
Thanks
Ale

I just wanted to update this post for WooCommerce version 3.2.3 - 2017
OK the WooCommerce Plugin includes a folder with all the template files if you want to make changes to the template on a custom theme or child theme you need to copy all of the desired template into a folder called woocommerce in your root theme folder. This will overwrite the plugin templates and will allow for WooCommerce updates with overwriting your custom changes. These templates have all of the do_actions and hooks in the comments so it makes it easy to understand how it's working.
That said WooCommerce has hooks that allow for you to add or remove blocks of code you can check out the API Docs here.
To remove the side bar you need to add this into your functions.php file in your theme setup function
remove_action( 'woocommerce_sidebar', 'woocommerce_get_sidebar', 10 );

Please, add this code to your functions.php
function mb_remove_sidebar() {
return false;
}
add_filter( 'is_active_sidebar', 'mb_remove_sidebar', 10, 2 );

Add to functions.php the following line:
add_action( 'init', function () {
remove_action( 'woocommerce_sidebar', 'woocommerce_get_sidebar', 10 );
} );

You have already integrated WooCommerce in your theme?
If not, try to do this three steps for integration WooCommerce in your theme.
After that, remove get_sidebar(); from your_theme/woocommerce.php
It works fine for me. Screenshot here.
Hope it helps.

Further to #maksim-borodov's answer, I wanted to hide the sidebar conditionally, i.e. only on Product pages. Here's how:
function remove_wc_sidebar_conditional( $array ) {
// Hide sidebar on product pages by returning false
if ( is_product() )
return false;
// Otherwise, return the original array parameter to keep the sidebar
return $array;
}
add_filter( 'is_active_sidebar', 'remove_wc_sidebar_conditional', 10, 2 );

Add to functions.php the following line:
remove_action( 'woocommerce_sidebar', 'woocommerce_get_sidebar', 10);

I am using GeneratePress (free version), so the other solutions didn't work for me.
This page gave me the answer: https://docs.generatepress.com/article/sidebar-layout/#sidebar-filter
add_filter( 'generate_sidebar_layout', function( $layout ) {
// If we are on a woocommerce page, set the sidebar
if ( function_exists( 'is_woocommerce' ) && is_woocommerce() ) {
return 'no-sidebar';
}
// Or else, set the regular layout
return $layout;
} );

This can be done by woocommerce sidebar plugin. If you want to remove by code add this code to functions.php,
if (!class_exists( 'WooCommerce' ) ) {return;}
if(is_cart() || is_checkout() || is_product() || is_shop() || is_account_page()){
?>
<style type="text/css">
#secondary {
display: none;
}
#primary {
width:100%;
}
</style>
<?php
}
}

Here is how to remove the sidebar :-
go to wp-content/plugins/woocommerce
in file single-product.php remove the following code -
<?php
/**
* woocommerce_sidebar hook
*
* #hooked woocommerce_get_sidebar - 10
*/
do_action('woocommerce_sidebar');
?>
next edit the file archive-product.php and remove the following code -
<?php
/**
* woocommerce_sidebar hook
*
* #hooked woocommerce_get_sidebar - 10
*/
do_action('woocommerce_sidebar');
?>
(tip* before deleting this, copy and paste the entire code from this page into a seperate text file on your HD...that way you can always paste the original code back into this folder if anything goes wrong)

Related

Custom product page layout by category ( Woocommerce )

I'm new to php and Woocommerce. I know this question has already been asked but i can't figure out how to make it work ... Right now, i have 3 different categories on my Woocommerce shop ( i'm developping using Understrap ). I've created my basic product page layout, everything works fine. Now, i'd like to create a custom layout for my products that are in my "cleaning" category.
What i did for now is add this to my functions.php child theme :
add_filter('template_include', 'cleaning_single_product_template_include', 10);
function cleaning_single_product_template_include($template)
{
if (is_product() && (has_term('cleaning', 'product_cat'))) {
$template = get_stylesheet_directory() . '/woocommerce/single-product-cleaning.php';
}
return $template;
}
Then i've created a single-product-cleaning.php file inside my woocommerce folder. For now, i've just pasted an <h1>LOREM</h1> to see if it shows up on the page, but it doesn't ..
Now in the code i've added to my functions.php, if i replace the content of my function with a simple
echo "test"; die();
It works, the "test" message appears on my cleaning product pages. But if i let the code i've written as is, then it just display the regular product page from single-product ... Any idea what i am missing here ?
EDIT : i've found this thread on stackoverflow where he seems to have found a solution (see his last comment) but i don't understand what code he moved or how he solved it ..
Finally fixed! For those having the same problem, i've just modified a little bit my functions.php function like this :
add_filter('template_include', 'cleaning_single_product_template_include', 50, 1);
function cleaning_single_product_template_include($template)
{
if (is_singular('product') && (has_term('cleaning', 'product_cat'))) {
$template = get_stylesheet_directory() . '/woocommerce/single-product-cleaning.php';
}
return $template;
}

Remove Gutenberg CSS

I have Gutenberg plugin installed in WordPress v4.9.8 and am trying to remove the CSS that comes with it so I can supply my own.
This is the sheet that gets included:
<link rel='stylesheet' id='wp-block-library-css' href='/wp-content/plugins/gutenberg/build/block-library/style.css?ver=1535795173' type='text/css' media='all' />
I have tried the following:
add_action( 'wp_print_styles', 'wps_deregister_styles', 100 );
function wps_deregister_styles() {
wp_dequeue_style( 'wp-block-library-css' );
wp_deregister_style( 'wp-block-library-css' );
}
As well as variations of this, but the file persists. How can I remove it?
I'm adding this as a more complete answer than my comment:
You need to remove the -css when trying to dequeue the script. That's added to the HTML markup and not the actual tag for the css file.
If you search the code (the location of the enqueue may change as Gutenberg gets rolled into core), you can find:
wp_enqueue_style( 'wp-block-library' );
As you can see, there is no -css. This solution may work for other plugins that people have trouble dequeuing styles.
Edit:
Since this still gets some traction, here is the code to handle it:
add_action( 'wp_print_styles', 'wps_deregister_styles', 100 );
function wps_deregister_styles() {
wp_dequeue_style( 'wp-block-library' );
}
I am use this code to to remove default style.
//Disable gutenberg style in Front
function wps_deregister_styles() {
wp_dequeue_style( 'wp-block-library' );
}
add_action( 'wp_print_styles', 'wps_deregister_styles', 100 );
I use Wordpress 5.1. Tried the most upvoted answers and they didn't work for me, 'wp_enqueue_scripts' instead of 'wp_print_styles' does the trick.
Here is my whole WordPress 5.1 solution to get rid of Gutenberg without bloat stylesheets loading:
// Disable Gutenberg editor.
add_filter('use_block_editor_for_post_type', '__return_false', 10);
// Don't load Gutenberg-related stylesheets.
add_action( 'wp_enqueue_scripts', 'remove_block_css', 100 );
function remove_block_css() {
wp_dequeue_style( 'wp-block-library' ); // Wordpress core
wp_dequeue_style( 'wp-block-library-theme' ); // Wordpress core
wp_dequeue_style( 'wc-block-style' ); // WooCommerce
wp_dequeue_style( 'storefront-gutenberg-blocks' ); // Storefront theme
}
Edit:
It works with WordPress 5.2 as well and because it handles the stylesheets added by WooCommerce and Storefront theme, I made this one of the settings in my new plugin:
https://wordpress.org/plugins/extra-settings-for-woocommerce/
Paste the following code on your functions.php file
function custom_theme_assets() {
wp_dequeue_style( 'wp-block-library' );
}
add_action( 'wp_enqueue_scripts', 'custom_theme_assets', 100 );
Please like if this has helped you.
As the wp_dequeue_style-approach did not work to disable wp-editor-font (wp-editor-font-css) I used the following code:
function my_remove_gutenberg_styles($translation, $text, $context, $domain)
{
if($context != 'Google Font Name and Variants' || $text != 'Noto Serif:400,400i,700,700i') {
return $translation;
}
return 'off';
}
add_filter( 'gettext_with_context', 'my_remove_gutenberg_styles',10, 4);
Also see https://github.com/dimadin/disable-google-fonts/blob/master/disable-google-fonts.php
In 2021 I tried variations of most of the approaches above and they all failed. Looking at the WordPress code, I believe the reason why is that Gutenberg styles are not enqueued anymore. The only way I have found to remove it is to remove it just before it is printed.
// This is what works for me.
add_action( 'wp_print_styles', 'wps_deregister_styles', 9999 );
function wps_deregister_styles() {
global $wp_styles;
$wp_styles->remove('wp-block-library');
}
This doesn't really answer the question, but I suspect others like me have ended up here trying to resolve something this question alludes to but doesn't address: how do you remove the inline (WP 5.5+) storefront-gutenberg-blocks-inline-css so you can use the editor even though it's using white on white or black on black in the storefront theme?
The following will do just that. Put it in your functions.php file or a plugin.
function clean_storefront_gutenberg_block_editor_customizer_css( $string ) {
// return empty so the editor doesn't suck
return '';
}
add_filter( 'storefront_gutenberg_block_editor_customizer_css', 'clean_storefront_gutenberg_block_editor_customizer_css' );
This just defuses the generated CSS so there's nothing appended to the back-end editor. The front-end remains unchanged.
Remove Gutenberg Block Library CSS from loading on the frontend
function smartwp_remove_wp_block_library_css()
{
wp_dequeue_style('wp-block-library');
wp_dequeue_style('wp-block-library-theme');
wp_dequeue_style('wc-block-style'); // Remove WooCommerce block CSS
}
add_action('wp_enqueue_scripts', 'smartwp_remove_wp_block_library_css', 999);
None of the above answers removed all the styles in the block editor, the following worked for me:
add_action( 'admin_print_styles', function() {
global $wp_styles;
$stylesToRemove = ["wp-reset-editor-styles", "wp-format-library", "wp-block-library", "wp-block-library-theme", "wp-block-directory", "wp-edit-blocks"];
foreach ($stylesToRemove as $styleToRemove) {
foreach ($wp_styles->registered as $style) {
$dep = array_search($styleToRemove, $style->deps);
if ($dep !== false) {
unset($style->deps[$dep]);
}
}
wp_deregister_style($styleToRemove);
}
}, 1 );
add_action('wp_enqueue_scripts', 'wps_deregister_styles', 200);
Works for me.
As the latest Gutenberg update has been released recently, a lot of people are wondering how to remove wp-block-library from WordPress. As the guide shows, below you need you to reference the 100 in your add_action.
Firslty, you must create a function that holds your wp_dequeue_style for wp-block-library and then call it as such:
add_action( 'wp_enqueue_scripts', 'custom_function', 100 );

Searchform not showing up

I have made a custom searchform.php to go with a Genesis child theme! However my custom form is being replaced by the Genesis Default Searchform.
In the child theme's functions.php page I have added this snippet....
function search_form_no_filters(){
// look for local searchform template
$search_form_template = locate_template( 'searchform.php' );
if ( '' !== $search_form_template ){
// searchform.php exists, remove all filters
remove_all_filters('get_search_form');
}
}
add_filter( 'get_search_form', 'genesis_search_form' );
This naturally should pull up my custom form and replace the Default Gensis one but for some reson it's not!
Have I missed something out here?
Many thanks.
I think add_filter part is the reason for the form not being displayed.
use add_filter( 'get_search_form', 'search_form_no_filters' );

Woocoomerce remove product count from attributes

On a WordPress installation with Woocommerce I have an issue with wrong number of product count on the frontend. That's why I decided to remove it. I have remove it from sidebars and anywhere with snippets but not on product attributes.
Is there any snipped to fix that?
If you want really remove (not just hide) you need to edit your theme function.php file by adding at the end this code:
add_filter( 'woocommerce_layered_nav_count', '__return_false' );
It's work for WOOCommerce v 3.4.3
Here is a quick snippet to remove products count after categories names using WooCommerce. It’s pretty useful in particular when your main shop page list categories instead of listing products. you can put it in 'functions.php' file in your theme.
add_filter( 'woocommerce_subcategory_count_html', 'woo_remove_category_products_count' );
function woo_remove_category_products_count() {
return;
}
Adding
small.count
{
display: none !important;
}
to your style sheet should work. It should hide the product count.
i think i allready have that.
See what functions.php file includes
<?php
define('ETHEME_DOMAIN', 'legenda');
require_once( get_template_directory() . '/framework/init.php' );
add_filter( 'woocommerce_subcategory_count_html', 'jk_hide_category_count' );
function jk_hide_category_count() {
// No count
}
add_filter( 'woocommerce_subcategory_count_html', 'woo_remove_category_products_count' );
function woo_remove_category_products_count() {
return;
}
you can swee live that is not worked at http://www.karadimos.gr/product-category/xalia/
BTW thanx for your reply!!!

WP Elegant Themes > hide tinymce buttons?

I have an elegant theme installed in my Wordpress website, and I am wondering how i can hide or remove the shortcode buttons in the tinymce (thing) that are generated by the Elegant Theme (admin area WP). I have been trying to look up the action hook and remove it and also play with the CSS of the buttons, but nothing helped. any idea's on how to remove these small buttons from the backend of my WP website?
This is the related code I've found:
add_filter('mce_buttons', 'et_filter_mce_button');
add_filter('mce_external_plugins', 'et_filter_mce_plugin');
function et_filter_mce_button($buttons) {
array_push( $buttons, '|', 'et_learn_more', 'et_box', 'et_button', 'et_tabs', 'et_author' );
return $buttons;
}
Create a plugin and remove the filters:
<?php
/**
* Plugin Name: Remove ET MCE Buttons
*/
add_action( 'admin_init', 'remove_et_so_19084867' );
function remove_et_so_19084867() {
remove_filter( 'mce_buttons', 'et_filter_mce_button' );
remove_filter( 'mce_external_plugins', 'et_filter_mce_plugin' );
}
A user from the Elegant Themes forum referenced this post: https://wordpress.stackexchange.com/questions/103347/removing-buttons-from-the-editor and said:
Place the following code in your child theme functions.php:
// HIDE TINYMCE CUSTOM BUTTONS
function tinymce_editor_buttons($buttons) {
return array();
}
function tinymce_editor_buttons_second_row($buttons) {
return array();
}
add_filter("mce_buttons", "tinymce_editor_buttons", 99);
add_filter("mce_buttons_2", "tinymce_editor_buttons_second_row", 99);
This removes all buttons inserted by Divi and other plugins. If you need to keep any buttons you can include the corresponding ID inside of return array();. Also, if you're using the plugin TinyMCE Advanced, the standard buttons stay in place anyway.

Resources