YITH WooCommerce Compare Shortcode

Below, you’ll find a detailed guide on how to add the YITH WooCommerce Compare Shortcode to your WordPress website, including its parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the YITH WooCommerce Compare Plugin shortcode not to show or not to work correctly.

Before starting, here is an overview of the YITH WooCommerce Compare Plugin and the shortcodes it provides:

YITH WooCommerce Compare

"YITH WooCommerce Compare is a WordPress plugin that allows your customers to compare different products in your WooCommerce store. Enhance user experience and boost sales with this powerful tool."

★★★★✩ (33) Active Installs: 200000+ Tested with: 6.3.2 PHP Version: false

Included Shortcodes:

• [yith_compare_button]

YITH WooCommerce Compare [yith_compare_button] Shortcode

The YITH WooCommerce Compare plugin shortcode allows users to add a compare button to their products. The shortcode retrieves the product ID and displays a comparison button. If a product ID isn’t specified, it defaults to the current product loop. The button text can be customized, and the button can be wrapped in a container for styling purposes.

Shortcode: [yith_compare_button]

Parameters

Here is a list of all possible yith_compare_button shortcode parameters and attributes:

• product – Specifies the WooCommerce product by ID, slug, or title
• type – Determines the style of the compare button, ‘default’ or custom
• container – If ‘yes’, the compare button is wrapped in a div container
• button_text – Custom text to display on the compare button

Examples and Usage

Basic example – An instance where the compare button is added without any specific product ID, hence it will take the ID of the current product in the loop.

[yith_compare_button]

Advanced examples

Adding the compare button for a specific product by providing the product ID, post slug, or post title. In this case, the product with ID 123 will be used.

[yith_compare_button product=123]

Displaying the compare button without a container by setting the ‘container’ attribute to ‘no’.

[yith_compare_button container=no]

Customizing the compare button text by providing the ‘button_text’ attribute. In this example, the button text will be “Compare this product”.

[yith_compare_button button_text="Compare this product"]

Using the shortcode with multiple attributes. This will display the compare button for the product with ID 123, without a container, and with “Compare this product” as the button text.

[yith_compare_button product=123 container=no button_text="Compare this product"]

PHP Function Code

In case you have difficulties debugging what causing issues with [yith_compare_button] shortcode, check below the related PHP functions code.

Shortcode line:

add_shortcode( 'yith_compare_button', array( $this, 'compare_button_sc' ) );

Shortcode PHP function:

function compare_button_sc( $atts, $content = null ) {
			$atts = shortcode_atts(
				array(
					'product'   => false,
					'type'      => 'default',
					'container' => 'yes',
                    'button_text' => false,
				),
				$atts
			);

			$product_id = 0;

			/**
			 * Retrieve the product ID in these steps:
			 * - If "product" attribute is not set, get the product ID of current product loop
			 * - If "product" contains ID, post slug or post title
			 */
			if ( ! $atts['product'] ) {
				global $product;
				$product_id = $product instanceof WC_Product ? $product->get_id() : 0;
			} else {
				global $wpdb;
				$product = $wpdb->get_row( $wpdb->prepare( "SELECT ID FROM $wpdb->posts WHERE ID = %d OR post_name = %s OR post_title = %s LIMIT 1", $atts['product'], $atts['product'], $atts['product'] ) ); // phpcs:ignore
				if ( ! empty( $product ) ) {
					$product_id = $product->ID;
				}
			}

			// Make sure to get always the product id of current language.
			if ( function_exists( 'wpml_object_id_filter' ) ) {
				$product_id = wpml_object_id_filter( $product_id, 'product', false );
			}

			if ( YITH_Woocompare_Helper::is_elementor_editor() ) {
				$products   = wc_get_products(
					array(
						'limit'  => 1,
						'return' => 'ids',
					)
				);
				$product_id = ! empty( $products ) ? array_shift( $products ) : 0;
			}

			// If product ID is 0, maybe the product doesn't exists or is wrong.. in this case, doesn't show the button.
			if ( empty( $product_id ) ) {
				return '';
			}

			ob_start();
			if ( 'yes' === $atts['container'] ) {
				echo '<div class="woocommerce product compare-button">';
			}

            $content = $atts['button_text'] ? : $content;

			$this->add_compare_link(
				$product_id,
				array(
					'button_or_link' => ( 'default' === $atts['type'] ? false : $atts['type'] ),
					'button_text'    => empty( $content ) ? 'default' : $content,
				)
			);
			if ( 'yes' === $atts['container'] ) {
				echo '</div>';
			}

			return ob_get_clean();
		}

Code file location:

yith-woocommerce-compare/yith-woocommerce-compare/includes/class.yith-woocompare-frontend.php

Conclusion

Now that you’ve learned how to embed the YITH WooCommerce Compare Plugin shortcode, understood the parameters, and seen code examples, it’s easy to use and debug any issue that might cause it to ‘not work’. If you still have difficulties with it, don’t hesitate to leave a comment below.