Zen Cart Logo
Forums / Templates, Stylesheets, Page Layout / Align Product Details below Product Description: tpl_product_info_display.php issues

Align Product Details below Product Description: tpl_product_info_display.php issues

Locked

Views: 4,840

Results 1 to 7 of 7
This thread is locked. New replies are disabled.
14 Aug 2007, 11:14 PM
#1
gingertea avatar

gingertea

New Zenner

Join Date:
Jul 2007
Posts:
36
Plugin Contributions:
0

Align Product Details below Product Description: tpl_product_info_display.php issues

Aloha,

I'm having trouble aligning my product details list below my product description. I've toggled with tpl_product_info_display.php and cannot seem to get the details to appear below the description.

Take a look:

http://www.hawaiianwoodys.com/store/index.php?main_page=product_info&cPath=1_6&products_id=3

I removed <br class="clearBoth" /> below

<!--bof Product description --> <?php if ($products_description != '') { ?> <div id="productDescription" class="productGeneral biggerText"><?php echo stripslashes($products_description); ?></div> <?php } ?> <!--eof Product description -->

and it worked in IE, but not FF.

Also, the bullet appears in FF but not IE. How can I get it working in both browsers?

Mahalo for all time and energy spent reviewing my post.

Best wishes,

Kelly

15 Aug 2007, 12:04 AM
#2
kobra avatar

kobra

Black Belt

Join Date:
Aug 2005
Location:
Arizona
Posts:
31,500
Plugin Contributions:
4

Re: Align Product Details below Product Description: tpl_product_info_display.php issues

Probably best to do this in the file and you need a clear both before the BOF for product details (I think that is the title.

Or find this tag in your style sheet and if ganged with others seperate out and add this to it

#productDescription {
        clear: both;
        }
15 Aug 2007, 1:37 AM
#3
gingertea avatar

gingertea

New Zenner

Join Date:
Jul 2007
Posts:
36
Plugin Contributions:
0

Re: Align Product Details below Product Description: tpl_product_info_display.php issues

Checked to make sure <br class="clearBoth" /> appeared before product details list -- it was there.

Made change to stylesheet and the product description has now moved below product image.

?

Would like description and details to appear below title and price.

Any other advice?

15 Aug 2007, 6:02 AM
#4
kobra avatar

kobra

Black Belt

Join Date:
Aug 2005
Location:
Arizona
Posts:
31,500
Plugin Contributions:
4

Re: Align Product Details below Product Description: tpl_product_info_display.php issues

Checked to make sure <br class="clearBoth" /> appeared before product details list -- it was there.

Would like description and details to appear below title and price.
Sorry, If you want these both tucked under the price remove the css that I suggested and remove the clear both before (that forces the new line) the descriptions

15 Aug 2007, 7:13 PM
#5
gingertea avatar

gingertea

New Zenner

Join Date:
Jul 2007
Posts:
36
Plugin Contributions:
0

Re: Align Product Details below Product Description: tpl_product_info_display.php issues

Thanks again for your help, Kobra.

One problem though: after removing <br class="clearBoth" /> from beneath the product description block...its works in IE, but not FF.

That was my original problem so I figured removing <br class="clearBoth" /> wasn't the answer.

I'm stumped -- any other advice?

15 Aug 2007, 10:53 PM
#6
gingertea avatar

gingertea

New Zenner

Join Date:
Jul 2007
Posts:
36
Plugin Contributions:
0

Re: Align Product Details below Product Description: tpl_product_info_display.php issues

Kobra--

I just noticed something. In FF, it's dictated by the size of the product image. That's why the product detail bullet is not aligning. Checkout the Longboards, where the product image is significantly smaller and the bullet is in its proper place.

http://www.hawaiianwoodys.com/store/index.php?main_page=product_info&cPath=1_5&products_id=4

Any inkling on how to fix in FF, given that it's a function of the product image?

15 Aug 2007, 11:36 PM
#7
clydejones avatar

clydejones

Deceased

Join Date:
Nov 2005
Location:
Colorado Springs, CO USA
Posts:
7,017
Plugin Contributions:
12

Re: Align Product Details below Product Description: tpl_product_info_display.php issues

gingertea:

Kobra--

I just noticed something. In FF, it's dictated by the size of the product image. That's why the product detail bullet is not aligning. Checkout the Longboards, where the product image is significantly smaller and the bullet is in its proper place.

http://www.hawaiianwoodys.com/store/index.php?main_page=product_info&cPath=1_5&products_id=4

Any inkling on how to fix in FF, given that it's a function of the product image?

You may have to add some extra div statements to both the stylesheet and tpl_product_info_display.php

something like this:

<div id="mainProductBox"> This css for this box will make the width 100% <div id="imageBox"> This box will hold your main image and the additional images. the css for this would make the width 45% and float it to the left. <!--bof Main Product Image --> <?php if (zen_not_null($products_image)) { ?> <?php /** * display the main product image */ require($template->get_template_dir('/tpl_modules_main_product_image.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_main_product_image.php'); ?> <?php } ?> <!--eof Main Product Image--> <!--bof Additional Product Images --> <?php /** * display the products additional images */ require($template->get_template_dir('/tpl_modules_additional_images.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_additional_images.php'); ?> <!--eof Additional Product Images --> </div> <div id="productBox"> This box will hold your product information. the css for this would make the width 45% and float it to the left <!--bof Product Name--> <h1 id="productName" class="productGeneral"><?php echo $products_name; ?></h1> <!--eof Product Name--> <!--bof Product Price block --> <h2 id="productPrices" class="productGeneral"> <?php // base price if ($show_onetime_charges_description == 'true') { $one_time = '<span >' . TEXT_ONETIME_CHARGE_SYMBOL . TEXT_ONETIME_CHARGE_DESCRIPTION . '</span><br />'; } else { $one_time = ''; } echo $one_time . ((zen_has_product_attributes_values((int)$_GET['products_id']) and $flag_show_product_info_starting_at == 1) ? TEXT_BASE_PRICE : '') . zen_get_products_display_price((int)$_GET['products_id']); ?></h2> <!--eof Product Price block --> <!--bof free ship icon --> <?php if(zen_get_product_is_always_free_shipping($products_id_current) && $flag_show_product_info_free_shipping) { ?> <div id="freeShippingIcon"><?php echo TEXT_PRODUCT_FREE_SHIPPING_ICON; ?></div> <?php } ?> <!--eof free ship icon --> <!--bof Product description --> <?php if ($products_description != '') { ?> <div id="productDescription" class="productGeneral biggerText"><?php echo stripslashes($products_description); ?></div> <?php } ?> <!--eof Product description --> <!--bof Product details list --> <?php if ( (($flag_show_product_info_model == 1 and $products_model != '') or ($flag_show_product_info_weight == 1 and $products_weight !=0) or ($flag_show_product_info_quantity == 1) or ($flag_show_product_info_manufacturer == 1 and !empty($manufacturers_name))) ) { ?> <ul id="productDetailsList" class="floatingBox back"> <?php echo (($flag_show_product_info_model == 1 and $products_model !='') ? '<li>' . TEXT_PRODUCT_MODEL . $products_model . '</li>' : '') . "\n"; ?> <?php echo (($flag_show_product_info_weight == 1 and $products_weight !=0) ? '<li>' . TEXT_PRODUCT_WEIGHT . $products_weight . TEXT_PRODUCT_WEIGHT_UNIT . '</li>' : '') . "\n"; ?> <?php echo (($flag_show_product_info_quantity == 1) ? '<li>' . $products_quantity . TEXT_PRODUCT_QUANTITY . '</li>' : '') . "\n"; ?> <?php echo (($flag_show_product_info_manufacturer == 1 and !empty($manufacturers_name)) ? '<li>' . TEXT_PRODUCT_MANUFACTURER . $manufacturers_name . '</li>' : '') . "\n"; ?> </ul> <br class="clearBoth" /> <?php } ?> <!--eof Product details list --> <!--bof Attributes Module --> <?php if ($pr_attr->fields['total'] > 0) { ?> <?php /** * display the product atributes */ require($template->get_template_dir('/tpl_modules_attributes.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_attributes.php'); ?> <?php } ?> <!--eof Attributes Module --> <!--bof Add to Cart Box --> <?php if (CUSTOMERS_APPROVAL == 3 and TEXT_LOGIN_FOR_PRICE_BUTTON_REPLACE_SHOWROOM == '') { // do nothing } else { ?>
        <?php
$display_qty = (($flag_show_product_info_in_cart_qty == 1 and $_SESSION['cart']->in_cart($_GET['products_id'])) ? '<p>' . PRODUCTS_ORDER_QTY_TEXT_IN_CART . $_SESSION['cart']->get_quantity($_GET['products_id']) . '</p>' : '');
        if ($products_qty_box_status == 0 or $products_quantity_order_max== 1) {
          // hide the quantity box and default to 1
          $the_button = '<input type="hidden" name="cart_quantity" value="1" />' . zen_draw_hidden_field('products_id', (int)$_GET['products_id']) . zen_image_submit(BUTTON_IMAGE_IN_CART, BUTTON_IN_CART_ALT);
        } else {
          // show the quantity box
$the_button = PRODUCTS_ORDER_QTY_TEXT . '<input type="text" name="cart_quantity" value="' . (zen_get_buy_now_qty($_GET['products_id'])) . '" maxlength="6" size="4" /><br />' . zen_get_products_quantity_min_units_display((int)$_GET['products_id']) . '<br />' . zen_draw_hidden_field('products_id', (int)$_GET['products_id']) . zen_image_submit(BUTTON_IMAGE_IN_CART, BUTTON_IN_CART_ALT);
        }
$display_button = zen_get_buy_now_button($_GET['products_id'], $the_button);

?>

<?php if ($display_qty != '' or $display_button != '') { ?>
<div id="cartAdd">
<?php
  echo $display_qty;
  echo $display_button;
        ?>
      </div>
<?php } // display qty and button ?> <?php } // CUSTOMERS_APPROVAL == 3 ?> <!--eof Add to Cart Box--> </div> </div> <br class="clearBoth">