针对Woocommerce商店页面菜单

我试图隐藏/交换Woocommerce中的标志和菜单项颜色，但无济于事。基本上我的大多数网站使用标准的导航，但我想要一个不同的标志和不同的导航颜色出现在所有商店相关的页面。因此隐藏一个，然后显示另一个，具体取决于页面。针对Woocommerce商店页面菜单

由于我的导航是透明的，我只希望在商店页面上显示。我明白，我可以针对通过有条件代码的网页时，（例如

is_product_category()

，但不知道怎么写都针对那些页数和交换/隐藏上面了。我使用的是航空维修的主题。我可以供给图像澄清如果有必要...

欣赏的帮助从WordPress的头!!感谢

编辑>

<?php 
    // This is targeting the front page as set in Dashboard => Settings => Reading and uses the logo as setup in Divi Options. 
    if (is_front_page()) {  

?> 
    <?php 
     $logo = ($user_logo = et_get_option('divi_logo')) && '' != $user_logo 
      ? $user_logo 
      : $template_directory_uri . '/wp-content/uploads/2016/12/logo_WHITE_sm.png'; 
    ?> 
     <div class="logo_container"> 
      <span class="logo_helper"></span> 
      <a href="<?php echo esc_url(home_url('/')); ?>"> 
       <img src="<?php echo esc_attr($logo); ?>" alt="<?php echo esc_attr(get_bloginfo('name')); ?>" id="logo" data-height-percentage="<?php echo esc_attr(et_get_option('logo_height', '54')); ?>" /> 
      </a> 
     </div> 

<?php 
    //This is targeting the page with the slug page-name-slug. 
    } elseif (is_page('botanical-collection')) {  
?> 

    <div class="logo_container"> 
     <span class="logo_helper"></span> 
     <a href="<?php echo esc_url(home_url('/')); ?>"> 
      <img class="custom-logo" src="/wp-content/uploads/2016/12/logo_ORIGINAL_sm.png" /><!-- Replace image path with the url to you image --> 
     </a> 
    </div> 

<?php 
    //This is targeting the page with the id 724. 
    } elseif (is_page('724')) { //can use page id or slug 
?> 

    <div class="logo_container"> 
     <span class="logo_helper"></span> 
     <a href="<?php echo esc_url(home_url('/')); ?>"> 
      <img class="custom-logo" src="https://www.example.com/wp-content/uploads/2016/12/logo_ORIGINAL_sm.png" /><!-- Replace image path with the url to you image --> 
     </a> 
    </div> 

<?php 
    //This is what we show if previous conditions are not met. In this case, it defaults back to the logo as set in Divi options. 

} else { 
?> 
<?php 
    $logo = ($user_logo = et_get_option('divi_logo')) && '' != $user_logo 
     ? $user_logo 
     : $template_directory_uri . '/wp-content/uploads/2016/12/logo_WHITE_sm.png'; 
?> 
    <div class="logo_container"> 
     <span class="logo_helper"></span> 
     <a href="<?php echo esc_url(home_url('/')); ?>"> 
      <img src="<?php echo esc_attr($logo); ?>" alt="<?php echo esc_attr(get_bloginfo('name')); ?>" id="logo" data-height-percentage="<?php echo esc_attr(et_get_option('logo_height', '54')); ?>" /> 
     </a> 
    </div> 

<?php 
} 
?>

来源

2016-12-14 Gray

我知道2点的方式来做到这一点：

1）有条件标签：

与WordPress和woocommerce，你将在大呼过瘾函数使用（在function.php条件标签您活动主题的文件）或直接在wordpress或woocommerce模板中。

例：is_shop()，is_product_category()，is_product_tag(），is_product()，is_cart()，is_checkout() ...

您将可以有条件地添加类或ID的例如，模板中的html标签。

用例：

<?php 
// Shop page 
if (is_shop()) 
    $class = ' the-shop'; 

// single products 
if (is_product()) 
    $class = ' single-product'; 

// Cart page 
if (is_cart()) 
    $class = ' the-cart'; 
?> 

<div class="some-class<?php $class; ?>"> 
    <a href="/some-link">Click me</a> 
</div>

再比如说，对店铺页面，你会得到这样生成的代码：

<div class="some-class the-shop"> 
    <a href="/some-link">Click me</a> 
</div>

然后，你将能够使用the-shop类在你的CSS文件来显示/隐藏，进行更改...

也可以构建您的自定义条件功能...

2）CSS类：基于身体的CSS类（和其他一些CSS类），特定于woocommerce页面

随着CSS。在您的网站的WooCommerce前端页面中导航时，您可以使用浏览器的开发人员工具发现它们。

在特定WoocommerCe店铺页面，你得到这个类例如体类：

<body class="archive post-type-archive post-type-archive-product woocommerce woocommerce-page">

，你可以在style.css文件的子主题的使用显示/隐藏DOM元素...

建议：使用儿童主题要好得多。

根据您的UPDATE UPDATE

我插入了is_shop()有条件的标签在你的代码

<?php // This is targeting the front page as set in Dashboard => Settings => Reading and uses the logo as setup in Divi Options. if (is_front_page()) { ?> <?php $logo = ($user_logo = et_get_option('divi_logo')) && '' != $user_logo ? $user_logo : $template_directory_uri . '/wp-content/uploads/2016/12/logo_WHITE_sm.png'; ?> <div class="logo_container"> <span class="logo_helper"></span> <a href="<?php echo esc_url(home_url('/')); ?>"> <img src="<?php echo esc_attr($logo); ?>" alt="<?php echo esc_attr(get_bloginfo('name')); ?>" id="logo" data-height-percentage="<?php echo esc_attr(et_get_option('logo_height', '54')); ?>" /> </a> </div> <?php // ### HERE ==> THE WOOCOMMERCE SHOP PAGE (YOU CAN EDIT THE CODE BELOW) } elseif (is_shop()) { ?> <div class="logo_container"> <span class="logo_helper"></span> <a href="<?php echo esc_url(home_url('/')); ?>"> <img class="custom-logo" src="/wp-content/uploads/2016/12/logo_ORIGINAL_sm.png" /> </a> </div> <?php //This is targeting the page with the slug page-name-slug. } elseif (is_page('botanical-collection')) { ?> <div class="logo_container"> <span class="logo_helper"></span> <a href="<?php echo esc_url(home_url('/')); ?>"> <img class="custom-logo" src="/wp-content/uploads/2016/12/logo_ORIGINAL_sm.png" /> </a> </div> <?php //This is targeting the page with the id 724. } elseif (is_page('724')) { //can use page id or slug ?> <div class="logo_container"> <span class="logo_helper"></span> <a href="<?php echo esc_url(home_url('/')); ?>"> <img class="custom-logo" src="https://www.example.com/wp-content/uploads/2016/12/logo_ORIGINAL_sm.png" /> </a> </div> <?php //This is what we show if previous conditions are not met. In this case, it defaults back to the logo as set in Divi options. } else { ?> <?php $logo = ($user_logo = et_get_option('divi_logo')) && '' != $user_logo ? $user_logo : $template_directory_uri . '/wp-content/uploads/2016/12/logo_WHITE_sm.png'; ?> <div class="logo_container"> <span class="logo_helper"></span> <a href="<?php echo esc_url(home_url('/')); ?>"> <img src="<?php echo esc_attr($logo); ?>" alt="<?php echo esc_attr(get_bloginfo('name')); ?>" id="logo" data-height-percentage="<?php echo esc_attr(et_get_option('logo_height', '54')); ?>" /> </a> </div> <?php } ?>

参考文献：

WooCommerce conditional tags

Template Structure + Overriding Templates via a Theme

来源

2016-12-14 16:24:18 LoicTheAztec

谢谢好心的帮助卢瓦克。即时通讯使用儿童主题，所以我很好。我的问题是我对PHP不熟悉，但设法摆弄这个代码（虽然它没有工作！） – Gray

嘿Loic，CSS不是正确的目标是这个网页的问题是非常具有挑战性的。无论如何谢谢 – Gray

感谢您的帮助Loic ...我修改了代码，如果我放在funtions.php中，它会打破我的网站。但是，当我在header.php中使用上面示例1中的初始代码时，它会出现在所有页面上，但不知道如何定位divi徽标，隐藏它，并在每个woocommerce页面上显示一个新的代码！ – Gray

针对Woocommerce商店页面菜单

回答

相关问题