Woocommerce: How To Show Product Attribute Name And Category Name On Title

Using the answer provided in this thread (Woocommerce: How to show Product Attribute name on title when in a category page and 'filtering' products via '?pa_attribute=' on address

Solution 1:

So was able to get this to work by taking my JS and adding it in as a script within my functions.php. So essentially I was able to eliminate the custom_woocommerce_page_title filter.

Function.php

<?php

add_action('wp_footer', 'onLoadPageTitle');
function onLoadPageTitle() {
    ?>
        <script>
                    
  machineEl = document.getElementsByClassName('woof_select woof_select_pa_machine')[0];
  processEl = document.getElementsByClassName('woof_select woof_select_pa_processing')[0];
  optionMachine = machineEl.querySelector("option[selected='selected']");
  optionProcess = processEl.querySelector("option[selected='selected']");  
  if (optionMachine != null) {
    machineValue = optionMachine.innerHTML;
  }
  else {
    machineValue = "";
  }
  if (optionProcess != null) {
    processValue = optionProcess.innerHTML;
  }
  else {
    processValue = "";
  }
  result = document.getElementsByClassName('woocommerce-products-header__title page-title')[0];
  result.innerHTML = machineValue + " " + processValue;   

        </script>
    <?php
}

?>

Then the woof woocommerce filter js that updates the title when a new select occurs after the AJAX.

(function() {
  machineEl = document.getElementsByClassName('woof_select woof_select_pa_machine')[0];
  processEl = document.getElementsByClassName('woof_select woof_select_pa_processing')[0];
  optionMachine = machineEl.querySelector("option[selected='selected']");
  optionProcess = processEl.querySelector("option[selected='selected']");  
  if (optionMachine != null) {
    machineValue = optionMachine.innerHTML;
  }
  else {
    machineValue = "";
  }
  if (optionProcess != null) {
    processValue = optionProcess.innerHTML;
  }
  else {
    processValue = "";
  }
  result = document.getElementsByClassName('woocommerce-products-header__title page-title')[0];
  result.innerHTML = machineValue + " " + processValue; 
})()

will probably pare it down by just calling the script function from within the woof js after ajax.