6 replies [Last post]
stephthegeek's picture
Joined: 10/20/2007
Juice: 575
Was this information Helpful?

We've been doing a lot of Ubercart theming lately, and I wanted to open a brainstorming thread for both small and major things that would improve theming for UC.

Here are some of the issues we've noticed:
- inconsistent use of - and _ in id/class names
- use of markup for styling instead of spans/divs, eg.
<td class="cart-block-summary-total"><strong>Total:</strong> $913.71</td>
- using img tags for images inline instead of via CSS so they can be changed (*cough* icons in cart block *cough*)
- also another example of inline stuff that's hard to adjust, the (View cart) (Checkout) links in cart-block-summary-checkout
- lack of wrapper div around or additional class on each item such as displayed product fields or attributes -- for example, without busting it out in a template file, it's impossible to apply styling to or around all displayed product fields like weight, dimensions, etc.
- use of tables for, well, everything Smiling
- lack of identifying class for all UC elements, like tables and form buttons -- for example, if we wanted to apply a certain styling to all UC-related tables, like view cart, checkout, review cart, etc., or all of the submit buttons on cart/checkout pages, we'd have to list them all individually

Gorgeous original Drupal themes (and Ubercart themes!) ~ Psst: more Ubercart themes on our new site

zmove's picture
Bug FinderEarly adopter... addicted to alphas.Getting busy with the Ubercode.Internationalizationizer
Joined: 08/13/2007
Juice: 1195
Re: Brainstorming for UC theming improvements in D6 version

I deleted my post about the same subject, so I post my suggestions as comment here :

In the product listing, the column that contain the name of the product have an attribute width=100% in the td tag.

To do that : in the uc_product.module
replace :

['name'][] = array('data' => l($node->title, 'node/'. $node->nid), 'width' => '100%');

By :

['name'][] = array('data' => l($node->title, 'node/'. $node->nid), 'class' => 'product-name');

And then create the following rule in uc_product.css :

.product-name {
TR's picture
Bug FinderFAQ ModeratorGetting busy with the Ubercode.
Joined: 11/05/2007
Juice: 3277
Re: Re: Brainstorming for UC theming improvements in D6 version

I don't know whether this still applies to the D6 Form API, but it would be nice to remove all markup from the _form() functions. Specifically, eliminate #type=markup, #prefix, and #suffix properties by moving this stuff into form theme functions.

Ryan's picture
Joined: 08/07/2007
Juice: 15475
Re: Re: Re: Brainstorming for UC theming improvements in D6 vers

Great thoughts here... I can add some of my own later, but I wanted to +1 especially TR's suggestion. I don't think I'd thought of that before, but this would be one stellar way to handle the various messages and things we add into checkout and settings forms. I'd like to pursue that further later if possible.

Also on the radar, though it probably won't happen for Uber Tuber is the addition of default .tpl.php files in modules. We should be able to make good use of this feature, but we might need someone to show us when/where. Smiling

torgosPizza's picture
Bug FinderEarly adopter... addicted to alphas.Getting busy with the Ubercode.
Joined: 08/14/2007
Juice: 4107
Re: Re: Re: Re: Brainstorming for UC theming improvements in D6

I would like to suggest the theming of any type of output screen. For us, specifically, this means the "My Files" section which is included in the File Downloads module (uc_file). I've actually already done this successfully with my current build, so I'd be more than happy to supply a patch whenever the time is right Smiling

Help directly fund development: Donate via PayPal!

jrowny's picture
Joined: 01/08/2009
Juice: 297
Re: Re: Re: Re: Re: Brainstorming for UC theming improvements in

themeing the cart view needs to be improved a lot, I found it very difficult to add a table column to the cart when the customer asked for a specific "color" field. I'm still a drupal n00b but I ended up hacking uc_cart which I'm aware is a big no no.

duckz's picture
Joined: 05/13/2009
Juice: 130
Re: Re: Re: Re: Re: Re: Brainstorming for UC theming improvement

1. tableless product page and category page will be nice.

function theme_uc_catalog_product_grid($products) {
  $product_table = '<div id="category-grid-products-wrapper">';
  $count = 0;
  $context = array(
    'location' => 'catalog-grid-product',
  foreach ($products as $nid) {
    $product = node_load($nid);
    $context['subject'] = array('node' => $product);

    $titlelink = l($product->title, "node/$nid", array('html' => TRUE));
    if (module_exists('imagecache') && ($field = variable_get('uc_image_'. $product->type, '')) && isset($product->$field) && file_exists($product->{$field}[0]['filepath'])) {
      $imagelink = l(theme('imagecache', 'product_list', $product->{$field}[0]['filepath'], $product->title, $product->title), "node/$nid", array('html' => TRUE));
    else {
      $imagelink = '';
$product_table .= '<div class="category-grid-products-content">';
    if (variable_get('uc_catalog_grid_display_title', TRUE)) {
      $product_table .= '<div class="catalog-grid-title">'. $titlelink .'</div>';
    if (variable_get('uc_catalog_grid_display_model', TRUE)) {
      $product_table .= '<div class="catalog-grid-ref">'. $product->model .'</div>';
    $product_table .= '<div class="catalog-grid-image">'. $imagelink .'</div>';
    if (variable_get('uc_catalog_grid_display_sell_price', TRUE)) {
      $product_table .= '<div class="catalog-grid-sell-price">'. uc_price($product->sell_price, $context) .'</div>';
    if (variable_get('uc_catalog_grid_display_add_to_cart', TRUE)) {
      if (variable_get('uc_catalog_grid_display_attributes', TRUE)) {
        $product_table .= '<div class="catalog-addtocart-button">';
        $product_table .= theme('uc_product_add_to_cart', $product);
        $product_table .= '</div>';
      else {
      $product_table .= '<div class="catalog-addtocart-button">';
        $product_table .= drupal_get_form('uc_catalog_buy_it_now_form_'. $product->nid, $product);
            $product_table .= '</div>';
$product_table .= "</div><!-- /product-content -->";
  $product_table .= "</div><!--/product-wrapper -->";
  return $product_table;

2. ubercart cart block, especially the view cart | checkout link is hard to theme ( hard to align ).

available for custom works, drupalstore.info