WooCommerce: как сделать атрибут товара ссылкой + SEO

Опубликовано: 28.10.2021

1024

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

WooCommerce: как сделать атрибут товара ссылкой + SEO

Увеличить. Пример кликабельного атрибута товара

Клик по этому атрибуту ведет на страницу со всеми товарами компании H & M у нас на сайте. Такую ссылку можно сделать на любой атрибут: цвет, размер, вес, рост, что там еще у ваших товаров будет.

Своей жене сделал магазин на теме BONO. Но, даже не смотря на то, что она заточена под SEO и в ней почти все есть, мне пришлось кое-что добавлять и править. Без этого никуда, если делать проект индивидуальным.

Как добавить атрибуту товара ссылку

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

Включим архив, чтобы кидало на страницу с товарами этого атрибута:

Увеличить

А если зайдем в настройки самого атрибута, то получим вот такое поле:

Увеличить

В это поле можно вставлять произвольную ссылку на продвигаемую вами страницу. Если оставить пустым, то будет просто кидать на страницу со всеми товарами этого атрибута.

Зайдем в Yoast SEO и видим настройки для этих типов таксономий. Можно прописать дефолтное значение meta полей, чтобы руками все не обходить.

Увеличить

Что сделать

Надо просто вставить кусок кода в файл функций вашей темы functions.php. Если используете дочернюю тему, то через нее.

/**
 * Register term fields
 */
add_action( 'init', 'register_attributes_url_meta' );
function register_attributes_url_meta() {
        $attributes = wc_get_attribute_taxonomies();

        foreach ( $attributes as $tax ) {
            $name = wc_attribute_taxonomy_name( $tax->attribute_name );

            add_action( $name . '_add_form_fields', 'add_attribute_url_meta_field' );
            add_action( $name . '_edit_form_fields', 'edit_attribute_url_meta_field', 10 );
            add_action( 'edit_' . $name, 'save_attribute_url' );
            add_action( 'create_' . $name, 'save_attribute_url' );
        }
}

/**
 * Add term fields form
 */
function add_attribute_url_meta_field() {

    wp_nonce_field( basename( __FILE__ ), 'attrbute_url_meta_nonce' );
    ?>

    
        
        
    
    term_id, 'attribute_url', true );
    wp_nonce_field( basename( __FILE__ ), 'attrbute_url_meta_nonce' );
    ?>
    
        
        
            
        
    
    term_id, 'attribute_url', true );

            if ( ! empty( $url ) ) {
                $val = '' . $value . '';
                array_push( $new_values, $val );
            } else {
                array_push( $new_values, $value );
            }
        } else {
            $matched = preg_match_all( "/\[([^\]]+)\]\(([^)]+)\)/", $value, $matches );

            if ( $matched && count( $matches ) == 3 ) {
                $val = '' . sanitize_text_field( $matches[1][0] ) . '';
                array_push( $new_values, $val );
            } else {
                array_push( $new_values, $value );
            }
        }
    }

    $text = implode( ', ', $new_values );

    return $text;
}

Сам код найден на Гитхабе. Если у вас появились ошибки, то скорее всего используете старую версию WP или самого WooCommerce.

Знаете более простое решение как сделать атрибуты товара WooCommerce кликабельными?

WooCommerce