Кнопка "Просмотр продукта", расположенная ниже, кнопка "Добавить в корзину" на страницах архивов WooCommerce.

Question

Большинство статей в интернете посвящены тому, как удалить / заменить кнопку "Просмотр продукта" или "Подробнее".
Я не смог найти что-то связанное с тем, чтобы обе кнопки работали вместе.

Я заинтересован в том, чтобы обе кнопки работали параллельно (одновременно). Первая отображаемая кнопка должна быть "Просмотреть товар" (должна быть открыта на той же странице), а затем под "Добавить в корзину".

На данный момент в моем магазине отображается только кнопка " Добавить в корзину". Я использую тему Storefront ( + пользовательская дочерняя тема).

Кто-нибудь будет так добр и скажет мне, как это сделать?

Answer 1

Используйте эту пользовательскую функцию, подключенную woocommerce_after_shop_loop_item Действие хук, чтобы добавить свою пользовательскую кнопку, связанную с продуктом:

add_action('woocommerce_after_shop_loop_item', 'add_a_custom_button', 5 );
function add_a_custom_button() {
    global $product;

    // Not for variable and grouped products that doesn't have an "add to cart" button
    if( $product->is_type('variable') || $product->is_type('grouped') ) return;

    // Output the custom button linked to the product
    echo '<div style="margin-bottom:10px;">
        <a class="button custom-button" href="' . esc_attr( $product->get_permalink() ) . '">' . __('View product') . '</a>
    </div>';
}

Код помещается в файл function.php вашей активной дочерней темы (или темы) или также в любой файл плагина.

Проверено и работает.

---

Встраивание ваших стилей (связанных с комментариями автора):

add_action('wp_head', 'custom_button_styles', 9999 );
function custom_button_styles() {
    if( is_shop() || is_product_category() || is_product_tag() ):

    // The styles
    ?>
    <style>
        .button.custom-button { background-color: white !important;
            color: black !important; border: 2px solid #4CAF50 !important; }
        .button.custom-button:hover { background-color: black !important;
            color: white !important; border: 2px solid black !important; }
    </style>
    <?php
    endif;
}

Код помещается в файл function.php вашей активной дочерней темы (или темы) или также в любой файл плагина.

Проверено и работает.