删除 Wordpress WooCommerce StoreFront 标题样式

Question

Wordpress WooCommerce StoreFront 主题在 WooCommerce StoreFront 定制器的标题中排列样式；

<style id='storefront-woocommerce-style-inline-css' type='text/css'></style>
<style id='storefront-style-inline-css' type='text/css'></style>

我似乎花更多的时间来纠正这些风格，而不是定义我想要的东西。有谁知道如何删除它们或禁用 Storefront 定制器？

Answer 1

对于任何与之抗争的人，这是我找到的解决方案：

function my_theme_remove_storefront_standard_functionality() {

//remove customizer inline styles from parent theme as I don't need it.
set_theme_mod('storefront_styles', '');
set_theme_mod('storefront_woocommerce_styles', '');  

}

add_action( 'init', 'my_theme_remove_storefront_standard_functionality' );

Answer 2

在class-storefront-customizer.php中添加了两个内联CSS。

对于注销店面样式内联css：

add_filter('storefront_customizer_css', '__return_false');

对于注销店面-woocommerce-style-inline-css：

add_filter('storefront_customizer_woocommerce_css', '__return_false');

Answer 3

我最近不得不删除这些，最好的方法是使用Ngoc Nguyen's method。

只需将下面的代码放在你的functions.php中

function wpcustom_deregister_scripts_and_styles(){
    wp_deregister_style('storefront-woocommerce-style');
    wp_deregister_style('storefront-style');
}
add_action( 'wp_print_styles', 'wpcustom_deregister_scripts_and_styles', 100 );

Answer 4

这在 Storefront 2.0.4 中有效吗？

因为我有这些过滤器：

add_filter( 'storefront_customizer_enabled', '__return_false' );
add_filter( 'storefront_customizer_css', '__return_false' );
add_filter( 'storefront_customizer_woocommerce_css', '__return_false' );

但我仍然有内联 css。

主题中提到了第一个过滤器： https://wordpress.org/support/topic/remove-inline-css-1?replies=8

Answer 5

试试这个：

add_filter( 'storefront_customizer_enabled',   'woa_storefront_disable_customizer' );

function woa_storefront_disable_customizer() {
    return false;
}

https://github.com/FrancySanchez/storefront-child/blob/master/functions.php

Answer 6

我一直有这个问题，虽然我的解决方案是针对我自己的应用程序的，但你可能会发现它有用。

我的问题是我想要带有浅灰色悬停颜色的白色菜单文本。默认情况下，您遇到问题的内联 css 似乎采用您的菜单文本颜色，将其变亮一个因子并将该颜色设置为悬停颜色。显然白色不能变亮，所以我的菜单在悬停时保持不变。这是我解决这个问题的方法：

在位于 wp-content/themes/storefront_child/inc/customizer 的文件“class-storefront-customizer.php”中，定义了关于主题编辑器界面如何工作的函数。首先，我采用了以下功能：

public static function get_storefront_default_setting_values() {
        return apply_filters( 'storefront_setting_default_values', $args = array(
            'storefront_heading_color'               => '#333333',
            'storefront_text_color'                  => '#6d6d6d',
            'storefront_accent_color'                => '#aeaeae',
            'storefront_header_background_color'     => '#ffffff',
            'storefront_header_text_color'           => '#6d6d6d',
            'storefront_header_link_color'           => '#333333',
            'storefront_footer_background_color'     => '#f0f0f0',
            'storefront_footer_heading_color'        => '#333333',
            'storefront_footer_text_color'           => '#6d6d6d',
            'storefront_footer_link_color'           => '#333333',
            'storefront_button_background_color'     => '#eeeeee',
            'storefront_button_text_color'           => '#333333',
            'storefront_button_alt_background_color' => '#333333',
            'storefront_button_alt_text_color'       => '#ffffff',
            'storefront_layout'                      => 'right',
            'background_color'                       => 'ffffff',
        ) );
    }

我将 storefront_accent_color 变量设置为我想要的偏移颜色，在我的例子中是 #aeaeae。这会将默认颜色设置为编辑器的该值。此步骤不是必需的，但确实更容易。

我也将此选项设置为相同的值，因为我不确定哪个会真正生效...

$wp_customize->add_setting( 'storefront_accent_color', array(
            'default'               => apply_filters( 'storefront_default_accent_color', '#aeaeae' ),
            'sanitize_callback'     => 'sanitize_hex_color',
        ) );

该文件的第 501 行是函数 get_css() 的定义，它设置了您看到的要摆脱的内联 css。对我来说，我需要改变的值在这个部分：

.main-navigation ul li a:hover,
        .main-navigation ul li:hover > a,
        .site-title a:hover,
        a.cart-contents:hover,
        .site-header-cart .widget_shopping_cart a:hover,
        .site-header-cart:hover > li > a,
        .site-header ul.menu li.current-menu-item > a {
            color: ' . storefront_adjust_color_brightness( $storefront_theme_mods['header_link_color'], 80 ) . ';
        }

我把这个css属性的值改为：

color: ' . $storefront_theme_mods['accent_color'] . ';

这并没有改变悬停时偏移的设置颜色。然而，它所做的只是改变了编辑器。

所以最后一步是进入编辑器，进入排版选项卡，选择强调色，点击默认颜色按钮（现在应该作为我的颜色出现）然后保存。之后我的菜单运行良好。

这有点长，并不完全符合您的要求，但我将其全部用于说明如何操作输出到该内联 css 中的值。希望这些信息对您有所帮助。

Answer 7

如果其他人偶然发现这个问题，这是我设法解决的方法：

1. 从父店面主题创建子主题。 （请参阅此链接了解如何操作：https://developer.wordpress.org/themes/advanced-topics/child-themes/）

2. 在子主题的functions.php文件中放入以下代码：

   remove_action( 'wp_enqueue_scripts', array( $storefront->customizer, 'add_customizer_css' ), 130 );
   

它基本上从 Storefront_Customizer 类中获取函数“add_customizer.css”，该类添加了内联 css，并从“wp_enqueue_scripts”中删除了该挂钩函数。 在店面主题的functions.php文件中有如下代码：

    $storefront = (object) array(
    'version'    => $storefront_version,

    /**
     * Initialize all the things.
     */
    'main'       => require 'inc/class-storefront.php',
    'customizer' => require 'inc/customizer/class-storefront-customizer.php',
);

它的作用是将文件“class-storefront-customizer.php”中的 Storefront_Customizer 类存储在 $storefront 数组中，然后将该数组转换为对象。

通过创建子主题，您将能够更新父店面主题，并且更改不会丢失。

Answer 8

经过多次试验，我得到了解决问题的最终解决方案！ 这很容易相信:-) 删除“class-storefront-customizer.php”中的以下行，它可以工作：

    add_action( 'wp_enqueue_scripts',array( $this, 'add_customizer_css' ), 130 );

问候 赫伯特