• Resolved ingenuitor

    (@ingenuitor)


    @bycrik For your consideration, I propose a straightforward short-code injection option to dynamically display the available choices on the product archive page.

    The code implementation appears to function effectively and could serve as an additional toggle feature for global application across product archive displays. It’s worth noting that while this concept has not undergone comprehensive testing or vetting, there are currently no apparent issues, that I have found yet.

    However, as with any development, caution is advised when implementing it. Nonetheless, this solution may provide utility to others and could be seen as a contribution (add-on) to the plugin’s functionality, regardless of the license ownership.

    /*
    Snippet Name: Tiered Pricing - Archive Page(s) - Display as (layout): Description: This feature introduces a refined shortcode tailored for displaying tiered pricing tables on the product archive display. It comes with built-in styling to enhance visual appeal. Furthermore, it simplifies the user experience by automatically adjusting product quantities for seamless integration into the shopping cart system, while using the archive page display.
    Version: 1.0.0 | 02/28/2024
    */
    
    // Add the shortcode to display tiered pricing table on product listing page
    function display_tiered_pricing_table_on_listing() {
        global $product;
    
        // Check if it's a product listing page
        if (is_shop() || is_product_category() || is_product_tag() || is_front_page()) {
            $product_id = $product->get_id();
            echo do_shortcode('[tiered-pricing-table product_id="' . $product_id . '"]');
        }
    }
    
    // Hook the shortcode to the WooCommerce product listing page
    add_action('woocommerce_after_shop_loop_item', 'display_tiered_pricing_table_on_listing');
    
    // Add custom CSS
    function custom_css_for_tiered_pricing_table() {
        echo '<style>
            .products.wd-products .tpt__tiered-pricing .tiered-pricing-wrapper>h3 {
                display: none;
            }
        </style>';
    }
    
    // Hook the custom CSS to the wp_head
    add_action('wp_head', 'custom_css_for_tiered_pricing_table');
    
    // Add Custom JS
    function custom_js_for_tiered_pricing_table(){
        ?>
        <script>
            jQuery(document).ready(function($) {
    			//For block display of tiered pricing
                $('.tiered-pricing-block').on('click', function(){
                    var priceRuleBoxId = $(this).parent()[0].id;
                    $('#'+priceRuleBoxId + ' .tiered-pricing-block').removeClass('tiered-pricing--active');
    				$(this).addClass('tiered-pricing--active');
    				
    				var clickedTieredBaseQuantity = $(this).attr('data-tiered-quantity');
    				$(this).parent().parent().parent().parent().find('.wd-add-btn').find('input[type=number]').val(clickedTieredBaseQuantity);
    				
    				
    				var addToCartAnchor = jQuery(this).parent().parent().parent().parent().find('.wd-add-btn').find('a.add_to_cart_button');
    				var addToCartAnchorhref = addToCartAnchor.attr('href');
    				var currentQuantity = addToCartAnchorhref.match(/quantity=(\d+)/);
    
    				if (currentQuantity == null) {
    					var newHref = addToCartAnchorhref + '?quantity=' + clickedTieredBaseQuantity;
    				} else {
    					var currentQuantityValue = currentQuantity[1]; // Extract the matched quantity
    					var newHref = addToCartAnchorhref.replace('quantity=' + currentQuantityValue, 'quantity=' + clickedTieredBaseQuantity);
    				}
    
    				addToCartAnchor.attr('href', newHref);
    				addToCartAnchor.attr('data-quantity', clickedTieredBaseQuantity);
    
                });
    			
    			//For table display of tiered pricing
    			$('.tiered-pricing-wrapper tbody tr').on('click', function(){
                    var priceRuleBoxId = $(this).parent().parent()[0].id;
                    $('#'+priceRuleBoxId + ' tr').removeClass('tiered-pricing--active');
    				$(this).addClass('tiered-pricing--active');
    				
    				var clickedTieredBaseQuantity = $(this).attr('data-tiered-quantity');
    				$(this).parent().parent().parent().parent().parent().find('.wd-add-btn').find('input[type=number]').val(clickedTieredBaseQuantity);
    				
    				
    				var addToCartAnchor = jQuery(this).parent().parent().parent().parent().parent().find('.wd-add-btn').find('a.add_to_cart_button');
    				var addToCartAnchorhref = addToCartAnchor.attr('href');
    				var currentQuantity = addToCartAnchorhref.match(/quantity=(\d+)/);
    
    				if (currentQuantity == null) {
    					var newHref = addToCartAnchorhref + '?quantity=' + clickedTieredBaseQuantity;
    				} else {
    					var currentQuantityValue = currentQuantity[1]; // Extract the matched quantity
    					var newHref = addToCartAnchorhref.replace('quantity=' + currentQuantityValue, 'quantity=' + clickedTieredBaseQuantity);
    				}
    
    				addToCartAnchor.attr('href', newHref);
    				addToCartAnchor.attr('data-quantity', clickedTieredBaseQuantity);
    
                });
    			
    			//For option display of tiered pricing
                $('.tiered-pricing-option').on('click', function(){
                    var priceRuleBoxId = $(this).parent()[0].id;
                    $('#'+priceRuleBoxId + ' .tiered-pricing-option').removeClass('tiered-pricing--active');
    				$(this).addClass('tiered-pricing--active');
    				
    				var clickedTieredBaseQuantity = $(this).attr('data-tiered-quantity');
    				$(this).parent().parent().parent().parent().find('.wd-add-btn').find('input[type=number]').val(clickedTieredBaseQuantity);
    				
    				
    				var addToCartAnchor = jQuery(this).parent().parent().parent().parent().find('.wd-add-btn').find('a.add_to_cart_button');
    				var addToCartAnchorhref = addToCartAnchor.attr('href');
    				var currentQuantity = addToCartAnchorhref.match(/quantity=(\d+)/);
    
    				if (currentQuantity == null) {
    					var newHref = addToCartAnchorhref + '?quantity=' + clickedTieredBaseQuantity;
    				} else {
    					var currentQuantityValue = currentQuantity[1]; // Extract the matched quantity
    					var newHref = addToCartAnchorhref.replace('quantity=' + currentQuantityValue, 'quantity=' + clickedTieredBaseQuantity);
    				}
    
    				addToCartAnchor.attr('href', newHref);
    				addToCartAnchor.attr('data-quantity', clickedTieredBaseQuantity);
    
                });
    			
    			//For plain text display of tiered pricing
                $('.tiered-pricing-plain-text').on('click', function(){
                    var priceRuleBoxId = $(this).parent()[0].id;
                    $('#'+priceRuleBoxId + ' .tiered-pricing-plain-text').removeClass('tiered-pricing--active');
    				$(this).addClass('tiered-pricing--active');
    				
    				var clickedTieredBaseQuantity = $(this).attr('data-tiered-quantity');
    				$(this).parent().parent().parent().parent().find('.wd-add-btn').find('input[type=number]').val(clickedTieredBaseQuantity);
    				
    				
    				var addToCartAnchor = jQuery(this).parent().parent().parent().parent().find('.wd-add-btn').find('a.add_to_cart_button');
    				var addToCartAnchorhref = addToCartAnchor.attr('href');
    				var currentQuantity = addToCartAnchorhref.match(/quantity=(\d+)/);
    
    				if (currentQuantity == null) {
    					var newHref = addToCartAnchorhref + '?quantity=' + clickedTieredBaseQuantity;
    				} else {
    					var currentQuantityValue = currentQuantity[1]; // Extract the matched quantity
    					var newHref = addToCartAnchorhref.replace('quantity=' + currentQuantityValue, 'quantity=' + clickedTieredBaseQuantity);
    				}
    
    				addToCartAnchor.attr('href', newHref);
    				addToCartAnchor.attr('data-quantity', clickedTieredBaseQuantity);
    
                });
    			
    			//For table horizontal display of tiered pricing
                $('.tiered-pricing-horizontal-table__values').on('click', function(){
                    var priceRuleBoxId = $(this).parent()[0].id;
                    $('#'+priceRuleBoxId + ' .tiered-pricing-horizontal-table__values').removeClass('tiered-pricing--active');
    				$(this).addClass('tiered-pricing--active');
    				
    				var clickedTieredBaseQuantity = $(this).attr('data-tiered-quantity');
    				$(this).parent().parent().parent().parent().find('.wd-add-btn').find('input[type=number]').val(clickedTieredBaseQuantity);
    				
    				
    				var addToCartAnchor = jQuery(this).parent().parent().parent().parent().find('.wd-add-btn').find('a.add_to_cart_button');
    				var addToCartAnchorhref = addToCartAnchor.attr('href');
    				var currentQuantity = addToCartAnchorhref.match(/quantity=(\d+)/);
    
    				if (currentQuantity == null) {
    					var newHref = addToCartAnchorhref + '?quantity=' + clickedTieredBaseQuantity;
    				} else {
    					var currentQuantityValue = currentQuantity[1]; // Extract the matched quantity
    					var newHref = addToCartAnchorhref.replace('quantity=' + currentQuantityValue, 'quantity=' + clickedTieredBaseQuantity);
    				}
    
    				addToCartAnchor.attr('href', newHref);
    				addToCartAnchor.attr('data-quantity', clickedTieredBaseQuantity);
    
                });
    			
    			//For dropdown display of tiered pricing
                $('.tiered-pricing-dropdown__list .tiered-pricing-dropdown-option').on('click', function(){
    				debugger
                    var priceRuleBoxId = $(this).parent().parent().parent()[0].id;
                    $('#'+priceRuleBoxId + ' .tiered-pricing-dropdown-option').removeClass('tiered-pricing-dropdown-option--active');
    				$('#'+priceRuleBoxId + ' .tiered-pricing-dropdown__select-box .tiered-pricing-dropdown-option').html($(this).html());
    				$(this).addClass('tiered-pricing-dropdown-option--active');
    				
    				var clickedTieredBaseQuantity = $(this).attr('data-tiered-quantity');
    				$(this).parent().parent().parent().parent().parent().parent().find('.wd-add-btn').find('input[type=number]').val(clickedTieredBaseQuantity);
    				
    				
    				var addToCartAnchor = jQuery(this).parent().parent().parent().parent().parent().parent().find('.wd-add-btn').find('a.add_to_cart_button');
    				var addToCartAnchorhref = addToCartAnchor.attr('href');
    				var currentQuantity = addToCartAnchorhref.match(/quantity=(\d+)/);
    
    				if (currentQuantity == null) {
    					var newHref = addToCartAnchorhref + '?quantity=' + clickedTieredBaseQuantity;
    				} else {
    					var currentQuantityValue = currentQuantity[1]; // Extract the matched quantity
    					var newHref = addToCartAnchorhref.replace('quantity=' + currentQuantityValue, 'quantity=' + clickedTieredBaseQuantity);
    				}
    
    				addToCartAnchor.attr('href', newHref);
    				addToCartAnchor.attr('data-quantity', clickedTieredBaseQuantity);
    
                });
            });
        </script>
        <?php
    }
    
    // Hook the custom JS to the wp_footer
    add_action('wp_footer', 'custom_js_for_tiered_pricing_table');
Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author WP Developer

    (@bycrik)

    Hello @ingenuitor,

    Thanks for providing the snippet. We will consider making a separate add-on to show tiered pricing on the archive page.

    Thread Starter ingenuitor

    (@ingenuitor)

    @bycrik Thank you for being receptive to the suggestion. In specific scenarios, it does appear to be quite beneficial.

    Thank you. I had a problem that the table was not shown in the product catalog but with this code it was solved.

    Thread Starter ingenuitor

    (@ingenuitor)

    @reinventatuweb Glad it worked for you, hope to see it be more of a standard in the future within the software as a toggle option, in anything we do, we love consistency, yet keeping things simple with the least amount of complexity, where we can.

    Will be working on refining this even more in the near future or anyone is open to provider a better solution for the same and post it here.

    We are somewhat limited to the native framework choices of the plugin itself. All the best…

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Unified Product Archive | Tired Option(s) Display / Injected Short Code Snippet’ is closed to new replies.