Ubercart – Theme cart view in cart page

We can theme the cart page by the theme_uc_cart_view_form() function. Implement it in your theme template.php.

function <theme>_uc_cart_view_form($form) {
  drupal_add_css(drupal_get_path('module', 'uc_cart') .'/uc_cart.css');

  $output = '<div id="cart-form-products">'
          . drupal_render($form['items']) .'</div>';

  foreach (element_children($form['items']) as $i) {
    foreach (array('title', 'options', 'remove', 'image', 'qty') as $column) {
      $form['items'][$i][$column]['#printed'] = TRUE;
    }
    $form['items'][$i]['#printed'] = TRUE;
  }

  // Add the continue shopping element and cart submit buttons.
  if (($type = variable_get('uc_continue_shopping_type', 'link')) != 'none') {
    // Render the continue shopping element into a variable.
    $cs_element = drupal_render($form['continue_shopping']);

    // Add the element with the appropriate markup based on the display type.
    if ($type == 'link') {
      $output .= '<div id="cart-form-buttons"><div id="continue-shopping-link">'
               . $cs_element .'</div>'. drupal_render($form) .'</div>';
    }
    elseif ($type == 'button') {
      $output .= '<div id="cart-form-buttons"><div id="update-checkout-buttons">'
               . drupal_render($form) .'</div><div id="continue-shopping-button">'
               . $cs_element .'</div></div>';
    }
  }
  else {
    $output .= '<div id="cart-form-buttons">'. drupal_render($form) .'</div>';
  }

  return $output;
}

 

Customize you cart page now.

Done =)

Reference: Ubercart API – theme_uc_cart_view_form

18 thoughts on “Ubercart – Theme cart view in cart page”

  1. Hi –
    Say my template name is ‘john’, would I create this method in sites/all/themes/john/template.php and name it john_uc_cart_view_form() ?
    If so, I have tried that, and it doesn’t seem to run it on it’s own, do I need to register or declare this function to be used elsewhere?

    Thanks!

    Like

    1. Try the following
      1. Remove the ?> at the end of template.php
      2. Clear the Drupal cache and try again

      Does it help?

      Like

    1. This post is for Drupal 6 and Ubercart 2 only.

      For ubercart 3.0, the theme function has been changed.

      function theme_uc_cart_view_form($variables) {
        $form = &$variables['form'];
      
        $output = '<div class="uc-default-submit">';
        $output .= drupal_render($form['actions']['update']);
        $output .= '</div>';
        $form['actions']['update']['#printed'] = FALSE;
      
        $output .= drupal_render_children($form);
      
        return $output;
      }
      

      theme_uc_cart_view_form
       

      If you want to modify the cart view, I suggest you could alter the uc_cart_view_form() using the hook_form_alter()

      or you could hack the uc_cart.module and modified the uc_cart_view_table(). But most proper way is to create an issue in the Ubercart project page.

      Like

  2. hello,
    What should I do to put cart links above the table with products on cart page as well? I would like to have the same buttons on the top of the page. Thank you

    Like

    1. you mean the http://www.example.com/cart? you can add it to the $output before at the beginning of the <theme>_uc_cart_view_form($form) implementation.

      sth like

      $output = '<a href="/cart">cart</a><div id="cart-form-products">'
         . drupal_render($form['items']) .'</div>';
      

      Does it work for you?

      Like

      1. How about this?

        function <theme>_uc_cart_view_form($form) {
          drupal_add_css(drupal_get_path('module', 'uc_cart') .'/uc_cart.css');
          $output = "";
        
          // Add the continue shopping element and cart submit buttons.
          if (($type = variable_get('uc_continue_shopping_type', 'link')) != 'none') {
            // Render the continue shopping element into a variable.
            $cs_element = drupal_render($form['continue_shopping']);
        
            // Add the element with the appropriate markup based on the display type.
            if ($type == 'link') {
              $output .= '<div id="cart-form-buttons"><div id="continue-shopping-link">'
                      . $cs_element .'</div>'. drupal_render($form) .'</div>';
            }
            elseif ($type == 'button') {
              $output .= '<div id="cart-form-buttons"><div id="update-checkout-buttons">'
                      . drupal_render($form) .'</div><div id="continue-shopping-button">'
                      . $cs_element .'</div></div>';
            }
          }
          else {
            $output .= '<div id="cart-form-buttons">'. drupal_render($form) .'</div>';
          }
        
          $output .= '<div id="cart-form-products">'
                  . drupal_render($form['items']) .'</div>';
        
          foreach (element_children($form['items']) as $i) {
            foreach (array('title', 'options', 'remove', 'image', 'qty') as $column) {
              $form['items'][$i][$column]['#printed'] = TRUE;
            }
            $form['items'][$i]['#printed'] = TRUE;
          }
        
          return $output;
        }
        

        Like

      1. Hi, your example from nov. 13 does not work either. The form stays same, even outputs are switched.

        Like

      2. That’s weird. It should work on Drupal 6. Make sure your edit the correct theme and rename the <theme> with your theme name. Save the file and clear the cache, then it should work.

        Like

  3. Hi, is ist possible to duplicate buttons on cart page? Duplicating code does not work since drupal registers every form. So if you print one form once, it can not be printed again on same page.

    Like

    1. You can try adding a button on anywhere on the page and give it proper id such that i could be selected by the jQuery selector. Then use jQuery to trigger the cart button click event.

      Like

      1. HI, would this work also for submit button leading to cart/checkout page? From looking at the code – it is quite complicated code inside the submit button.

        Like

Leave a reply to miki Cancel reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.