Получение правильной ссылки на продукт в цикле WooCommerce при использовании ветки и древесины

#php #wordpress #woocommerce #twig #timber

Вопрос:

Я настроил некоторые шаблоны WooCommerce и использую систему шаблонов Twig, а также древесину.

На страницах категорий я только что заметил, что все изображения продуктов правильно ссылаются на соответствующие продукты, но заголовок под ними ссылается на первый продукт на странице.

Разница между ними заключается в том, что правильный раздел ссылки с фотографией настраивается, а неправильный заголовок ссылки создается с помощью крючков WooCommerce.

Вот мои соответствующие файлы:

archive-product.php

 defined( 'ABSPATH' ) || exit;

$context            = Timber::get_context();
$context['shop-sidebar'] = Timber::get_widgets( 'shop-sidebar' );

$posts = Timber::get_posts();
$context['products'] = $posts;

$context['search_str'] = (get_search_query()) ? get_search_query() : '';

if ( is_product_category() ) {
    $queried_object = get_queried_object();
    $term_id = $queried_object->term_id;
    $context['category'] = get_term( $term_id, 'product_cat' );
    $context['title'] = single_term_title( '', false );
} elseif (is_shop()) {

    $shop_id = get_option( 'woocommerce_shop_page_id' );
    $post = new TimberPost($shop_id);

    $alt_title = (!empty($post->get_field('alt_page_title')['title'])) ? $post->get_field('alt_page_title')['title'] : '';
    $context['title'] = ($alt_title) ? $alt_title : $post->post_title;

}

Timber::render( 'views/woo/archive.twig', $context );
 

просмотры/woo/архив.twig

 {% extends 'archive.twig' %} {# Base Archive File #}

{% block before_article %}
    {% do action('woocommerce_before_main_content') %}
{% endblock %}

{% block below_h1 %}
    {{ fn('woocommerce_result_count') }}
{% endblock %}

{% block intro_content %}
    {% do action('woocommerce_archive_description') %}
{% endblock %}

{% block primary_block %}

    {% if products|length > 0 %}

        <div class="before-products">
            {% do action('woocommerce_before_shop_loop') %}
        </div>

        <div class="products-wrap">
            <div class="products row flex">
                {% for post in products %}
                    <div class="product-holder col-xs-6 col-md-4">
                        {% do action('woocommerce_shop_loop') %}
                        {% include ["woo/partials/tease-product.twig"] %}
                    </div>
                {% endfor %}
            </div>
        </div>

        {% if fn('show_products_nav') %}
            <nav class="pagination" role="navigation">
                {{ fn('wp_paginate') }}
            </nav>
        {% endif %}

        <div class="after-products">
            {% do action('woocommerce_after_shop_loop') %}
        </div>

    {% else %}

        <div class="no-products">
            {% do action('woocommerce_no_products_found') %}
        </div>

    {% endif %}

{% endblock  %}

{% block after_article %}
    {% do action('woocommerce_after_main_content') %}
    {{ parent() }}
{% endblock %}
 

woo/partials/tease-product.twig

 <article {{ fn('post_class', ['entry'] ) }}>

    {{ fn('timber_set_product', post) }}

    {% set title = (post.title) ? post.title : fn('the_title') %}

    <div class="photo {% if not post.thumbnail %}placeholder{% endif %}">
        <a href="{{ post.link }}" class="link">
            {% if post.thumbnail %}
                <img src="{{ post.thumbnail.src|resize(600)|e('esc_url') }}" class="img-responsive" alt="{{ fn('esc_attr', title) }}" />
            {% else %}
                <img src="{{ fn('wc_placeholder_img_src') }}" class="img-responsive" alt="Awaiting product image" />
            {% endif %}
        </a>
    </div>

    <div class="details">

        <h3 class="entry-title">

            {% do action('woocommerce_before_shop_loop_item') %}
            {% do action('woocommerce_before_shop_loop_item_title') %}
                {{ title|e2 }}
            {% do action( 'woocommerce_after_shop_loop_item_title' ) %}
            {% do action( 'woocommerce_after_shop_loop_item' ) %}

        </h3>

    </div>

</article>
 

Проблемной областью является этот бит:

 <h3 class="entry-title">

    {% do action('woocommerce_before_shop_loop_item') %}
    {% do action('woocommerce_before_shop_loop_item_title') %}
        {{ title|e2 }}
    {% do action( 'woocommerce_after_shop_loop_item_title' ) %}
    {% do action( 'woocommerce_after_shop_loop_item' ) %}

</h3>
 

Из того, что я могу понять, я могу изменить тег привязки с помощью этого:

 remove_action( 'woocommerce_before_shop_loop_item', 'woocommerce_template_loop_product_link_open', 10 );
add_action( 'woocommerce_before_shop_loop_item', 'myprefix_woocommerce_template_loop_product_link_open', 10 );

function myprefix_woocommerce_template_loop_product_link_open() {
    echo '<a href="https://www.google.com.au/">';
}
 

Я просто не уверен, где лучше всего разместить этот код и как передать ему правильную постоянную ссылку.

Ответ №1:

Постоянная ссылка доступна через глобальную переменную продукта, как определено в вашем частичном через {{ fn('timber_set_product', post) }}

Поместите код в свой functions.php.

 remove_action( 'woocommerce_before_shop_loop_item', 'woocommerce_template_loop_product_link_open', 10 );
add_action( 'woocommerce_before_shop_loop_item', 'myprefix_woocommerce_template_loop_product_link_open', 10 );

function myprefix_woocommerce_template_loop_product_link_open() {
    global $product;
    $link = $product->get_permalink();
    echo '<a href="' . esc_url( $link ) . '" class="woocommerce-LoopProduct-link woocommerce-loop-product__link">';
}
 

Комментарии:

1. Спасибо, но это не сработало. 🙁 По-прежнему отображается та же ссылка.

2. Хорошо, я заметил $product , что у меня были правильные детали, поэтому $link = $product->get_permalink(); вместо этого я смог их получить 🙂