Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

Styling issues


dtrain

Recommended Posts

Posted

Hi,

 

I am trying to style my categories page similar to the 'View All' section I have already done.

Unfortunately its in a template and I haven't been able to get in touch with the original designer.

 

I am having trouble lining my image and text up like the example shown here at the main page.

 

What I have at the moment is here.

 

I have also included the code for the page I am trying to style.

 

If anyone can help it would be greatly appreciated!!!

 

 

Cheers,

 

 

Dallas

 

 

<?php
/*
 $Id: product_listing.php,v 1.44 2003/06/09 22:49:59 hpdl Exp $

 osCommerce, Open Source E-Commerce Solutions
 http://www.oscommerce.com

 Copyright (c) 2003 osCommerce

 Released under the GNU General Public License
*/
 $listing_split = new splitPageResults($listing_sql, MAX_DISPLAY_SEARCH_RESULTS, 'p.products_id');
 if ( ($listing_split->number_of_rows > 0) && ( (PREV_NEXT_BAR_LOCATION == '1') || (PREV_NEXT_BAR_LOCATION == '3') ) ) {
?>
<table border="0" width="<?php echo $content; ?>" cellspacing="0" cellpadding="0" class="head_table" style="margin-left:15px">
 <tr>
   <td class="smallText"><?php echo $listing_split->display_count(TEXT_DISPLAY_NUMBER_OF_PRODUCTS); ?></td>
   <td class="smallText" align="right"><?php echo TEXT_RESULT_PAGE . ' ' . $listing_split->display_links(MAX_DISPLAY_PAGE_LINKS, tep_get_all_get_params(array('page', 'info', 'x', 'y'))); ?></td>
 </tr>
</table>
<?php
 }

 $list_box_contents = array();

 for ($col=0, $n=sizeof($column_list); $col<$n; $col++) {
   switch ($column_list[$col]) {
   //  case 'PRODUCT_LIST_PRICE':
   //    $lc_text = TABLE_HEADING_PRICE;
   //    $lc_align = 'right';
   //    break ;
   //  case 'PRODUCT_LIST_IMAGE':
   //    $lc_text = TABLE_HEADING_IMAGE;
   //    $lc_align = 'left';
   //    break;
   //  case 'PRODUCT_LIST_BUY_NOW':
   //    $lc_text = TABLE_HEADING_BUY_NOW;
   //    $lc_align = 'center';
   //    break;
   }

   if ($column_list[$col] == 'PRODUCT_LIST_PRICE') continue;
   if ($column_list[$col] == 'PRODUCT_LIST_IMAGE') continue;
   if ($column_list[$col] == 'PRODUCT_LIST_BUY_NOW') continue;
   if ( ($column_list[$col] != 'PRODUCT_LIST_BUY_NOW') && ($column_list[$col] != 'PRODUCT_LIST_IMAGE') ) {
     $lc_text = tep_create_sort_heading($HTTP_GET_VARS['sort'], $col+1, $lc_text);
   }

   $list_box_contents[0][] = array('align' => $lc_align,
                                   'params' => 'class="productListing-heading"',
                                   'text' => ' ' . $lc_text . ' ');
 }
 echo START_BLOCK."<tr><td>";
 if ($listing_split->number_of_rows > 0) {
   $rows = 0;
   $listing_query = tep_db_query($listing_split->sql_query);
   while ($listing = tep_db_fetch_array($listing_query)) {
     $rows++;

     if (($rows/2) == floor($rows/2)) {
       $list_box_contents[] = array('params' => 'class="productListing-even"');
     } else {
       $list_box_contents[] = array('params' => 'class="productListing-odd"');
     }

     $cur_row = sizeof($list_box_contents) - 1;

     for ($col=0, $n=sizeof($column_list); $col<$n; $col++) {
       $lc_align = '';
       $params = '';

       switch ($column_list[$col]) {
         case 'PRODUCT_LIST_IMAGE':
           $lc_align = 'left';
           $params = 'width="'.(SMALL_IMAGE_WIDTH+20).'"';
           if (isset($HTTP_GET_VARS['manufacturers_id'])) {
             $lc_text = '<a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'products_id=' . $listing['products_id']) . '">' . tep_image(DIR_WS_IMAGES . $listing['products_image'], $listing['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, ' align="left" style="margin:0 15px 0 0px" class="small_image"') . '</a>';
           } else {
             $lc_text = '<a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'products_id=' . $listing['products_id']) . '">' . tep_image(DIR_WS_IMAGES . $listing['products_image'], $listing['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, ' align="left" style="margin:0 15px 0 0px" class="small_image"') . '</a>';
           }
           break;
         case 'PRODUCT_LIST_NAME':
           $lc_align = '';
/**/
           if (tep_not_null($listing['specials_new_products_price'])) {
             $pr_text = '<span class="price"><span class="old">' .  $currencies->display_price($listing['products_price'], tep_get_tax_rate($listing['products_tax_class_id'])) . '</span>  ' . $currencies->display_price($listing['specials_new_products_price'], tep_get_tax_rate($listing['products_tax_class_id'])) . '</span>';
           } else {
             $pr_text = ' <span class="price">' . $currencies->display_price($listing['products_price'], tep_get_tax_rate($listing['products_tax_class_id'])) . '</span> ';}
/* By Brand*/
           if (isset($HTTP_GET_VARS['manufacturers_id'])) {
             $lc_text = '<a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'manufacturers_id=' . $HTTP_GET_VARS['manufacturers_id'] . '&products_id=' . $listing['products_id']) . '" class="zag_main"><b>' . $listing['products_name'] . '</b><br><br></a>' . tep_flatten_product_description($listing['products_description']) . '<br><br>' .
             '<span class="zag_pr_text" style="font-size:14px">'.'Price:' . $pr_text.'</span>' . '<br><br>' .
             '<div align="left"> <a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'products_id=' . $listing['products_id']) . '">' . tep_image_button('button_det.gif', IMAGE_BUTTON_DET) . '</a>
             <a href="' . tep_href_link(basename($PHP_SELF), tep_get_all_get_params(array('action')) . 'action=buy_now&products_id=' . $listing['products_id']) . '">' . tep_image_button('button_buy_now.gif', IMAGE_BUTTON_BUY_NOW) . '</a></div><br>';
           } 
             else {
             $lc_text = '<a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'products_id=' . $listing['products_id']) . '" class="zag_main"><b>' . $listing['products_name'] . '</b><br><br></a>' . tep_flatten_product_description($listing['products_description']) . '<br><br>' .
             '<span class="zag_pr_text" style="font-size:14px">'.'Price:' . $pr_text.'</span>' . '<br><br>' .
             '<div align="left"> <a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'products_id=' . $listing['products_id']) . '">' . tep_image_button('button_det.gif', IMAGE_BUTTON_DET) . '</a>
             <a href="' . tep_href_link(basename($PHP_SELF), tep_get_all_get_params(array('action')) . 'action=buy_now&products_id=' . $listing['products_id']) . '">' . tep_image_button('button_buy_now.gif', IMAGE_BUTTON_BUY_NOW) . '</a></div><br>';
           }
           break;
         case 'PRODUCT_LIST_BUY_NOW':
           $lc_align = 'left';
           $lc_class = 'all';
           $lc_text = '<a href="' . tep_href_link(basename($PHP_SELF), tep_get_all_get_params(array('action')) . 'action=buy_now&products_id=' . $listing['products_id']) . '">' . tep_image_button('button_buy_now.gif', IMAGE_BUTTON_BUY_NOW) . '</a> ';
           break;
       }
       if ($column_list[$col] == 'PRODUCT_LIST_PRICE') continue;
       if ($column_list[$col] == 'PRODUCT_LIST_BUY_NOW') continue;
       $list_box_contents[$cur_row][] = array('align' => $lc_align,
                                              'params' => 'class="productListing-data" '.$params,
                                              'text'  => $lc_text);
     }
   }
   new productListingBox($list_box_contents,true);
 } else {
   $list_box_contents = array();

   $list_box_contents[0] = array('params' => 'class="productListing-odd"');
   $list_box_contents[0][] = array('params' => 'class="productListing-heading"',
                                  'text' => TEXT_NO_PRODUCTS);

   new productListingBox($list_box_contents,true);
 }
 if ( ($listing_split->number_of_rows > 0) && ((PREV_NEXT_BAR_LOCATION == '2') || (PREV_NEXT_BAR_LOCATION == '3')) ) {
?>
<table border="0" cellspacing="0" cellpadding="0">
     <tr>
       <td>
         <?php echo tep_image(DIR_WS_IMAGES . 'main_line.gif'); ?>
         <table border="0" width="<?php echo $content; ?>" cellspacing="0" cellpadding="8" class="number">
         <tr>
           <td class="smallText"><?php echo $listing_split->display_count(TEXT_DISPLAY_NUMBER_OF_PRODUCTS_NEW); ?></td>
           <td align="right" class="smallText"><?php echo TEXT_RESULT_PAGE . ' ' . $listing_split->display_links(MAX_DISPLAY_PAGE_LINKS, tep_get_all_get_params(array('page', 'info', 'x', 'y'))); ?></td>
         </tr>
       </table></td>
     </tr>
<?php
 }
 echo "</td></tr>".END_BLOCK;
?>
</table>

Posted

I clicked both links and they look the same, so I am assuming you fixed the problem. Or am I missing something? On a totally unrelated topic, the dog header is adorable! But do you really want to lose that much premium above-the-fold space on a header? Just a thought.

 

Adrienne

Posted

I clicked both links and they look the same, so I am assuming you fixed the problem. Or am I missing something? On a totally unrelated topic, the dog header is adorable! But do you really want to lose that much premium above-the-fold space on a header? Just a thought.

 

Adrienne

 

No the problem is still there.

 

I am trying to contain the content in the grey box but it seems to be overflowing on either side as well as the bottom to create an ugly look.

 

It works well in the index page but not the categories page. Plus the image and text inside aren't aligned right.

 

If I was to contain it all similar to the index page what code can I change so that it has a more suitable table format.

I'm still getting used to PHP so sorry for my lack of knowledge on this one.

 

The code for the index page which I want the original code posting to look like is added below:

 

<table border="0" width="<?php echo $content; ?>" cellspacing="0" cellpadding="0" class="head_table">
         <tr>
           <td class="pageHeading">All products</td>
         </tr>
       </table><table border="0" cellspacing="0" cellpadding="0" width="<?php echo $content; ?>" style="margin-left:15px">

<?php
 $products_new_array = array();

 $products_new_query_raw = "select p.products_id, pd.products_name, pd.products_description, p.products_image, p.products_price, p.products_tax_class_id, p.products_date_added, m.manufacturers_name from " . TABLE_PRODUCTS . " p left join " . TABLE_MANUFACTURERS . " m on (p.manufacturers_id = m.manufacturers_id), " . TABLE_PRODUCTS_DESCRIPTION . " pd where p.products_status = '1' and p.products_id = pd.products_id and pd.language_id = '" . (int)$languages_id . "' order by p.products_date_added DESC, pd.products_name";
 $products_new_split = new splitPageResults($products_new_query_raw, MAX_DISPLAY_PRODUCTS_NEW);

 if (($products_new_split->number_of_rows > 0) && ((PREV_NEXT_BAR_LOCATION == '1') || (PREV_NEXT_BAR_LOCATION == '3'))) {
?>
     <tr>
       <td><table border="0" width="100%" cellspacing="0" cellpadding="2">
         <tr>
           <td class="smallText"><?php echo $products_new_split->display_count(TEXT_DISPLAY_NUMBER_OF_PRODUCTS_NEW); ?></td>
           <td align="right" class="smallText"><?php echo TEXT_RESULT_PAGE . ' ' . $products_new_split->display_links(MAX_DISPLAY_PAGE_LINKS, tep_get_all_get_params(array('page', 'info', 'x', 'y'))); ?></td>
         </tr>
       </table></td>
     </tr>
     <tr>
       <td><?php echo tep_draw_separator('pixel_trans.gif', '100%', '10'); ?></td>
     </tr>
<?php
 }
?>
     <tr>
       <td><table border="0" width="100%" cellspacing="0" cellpadding="2">
<?php
 if ($products_new_split->number_of_rows > 0) {
   $products_new_query = tep_db_query($products_new_split->sql_query);
   while ($products_new = tep_db_fetch_array($products_new_query)) {
     if ($new_price = tep_get_products_special_price($products_new['products_id'])) {
       $products_price = '<s class="zag_pr_old" style="font-size:15px;">' . $currencies->display_price($products_new['products_price'], tep_get_tax_rate($products_new['products_tax_class_id'])) . '</s> <span class="zag_pr_price" style="font-size:15px;">' . $currencies->display_price($new_price, tep_get_tax_rate($products_new['products_tax_class_id'])) . '</span>';
     } else {
       $products_price = '<span class="zag_pr_price">'.$currencies->display_price($products_new['products_price'], tep_get_tax_rate($products_new['products_tax_class_id'])).'</span>';
     }
?>
   <tr>
     <td style="padding-bottom:12px;border-bottom:1px dotted #B2B2B2;">
       <table border="0" width="100%" cellspacing="0" cellpadding="2">
         <tr>
           <td colspan="2"><?php echo tep_draw_separator('pixel_trans.gif', '100%', '2'); ?></td>
         </tr>
         <tr>
           <td class="all" valign="top"  width="<?php echo (SMALL_IMAGE_WIDTH+20);?>"><?php 
           echo '<a  href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'products_id=' . $products_new['products_id']) . '">' . tep_image(DIR_WS_IMAGES . $products_new['products_image'], $products_new['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, ' align="left" style="margin:0 15px 0 0px" class="small_image"') . '</a>'; 
           ?>
           </td>
           <!-- Product Name, Description, etc -->
           <td class="main" style="padding:0" ><?php  echo '<a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'products_id=' . $products_new['products_id']) . '" class="zag_main"><b>' . $products_new['products_name'] . '</b><br><br></a>' . tep_flatten_product_description($products_new['products_description']) . '<br><b>' . '<br><div class="zag_pr_text" style="font-size:14px;">' . TEXT_PRICE . ' ' . $products_price . '</div>'; ?>
           <!--
           . TEXT_DATE_ADDED . ' ' . tep_date_long($products_new['products_date_added']) . '<br>' . '<br><div class="zag_pr_text" style="font-size:12px;">' . TEXT_PRICE . ' ' . $products_price . '</div>'; ?> -->
           <br>
           <!-- Shopping Cart -->
           <div align="left" valign="middle">

           <?php echo ' <a href="' . tep_href_link(FILENAME_PRODUCT_INFO, 'products_id=' . $products_new['products_id']) . '">' . tep_image_button('button_det.gif', IMAGE_BUTTON_DET) . '</a>';?>

           <?php echo '<a href="' . tep_href_link(FILENAME_PRODUCTS_NEW, tep_get_all_get_params(array('action')) . 'action=buy_now&products_id=' . $products_new['products_id']) . '">' . tep_image_button('button_in_cart.gif', IMAGE_BUTTON_IN_CART) . '</a>'; ?></div></td>
         </tr>
       </table>
     </td>
   </tr>		
<?php
   }
 } else {
?>
   <tr>
     <td bgcolor="#AFBCC1">
       <table border="0" width="100%" cellspacing="0" cellpadding="2" bgcolor="#FFFFFF">
         <tr>
           <td class="main"><?php echo TEXT_NO_NEW_PRODUCTS; ?></td>
         </tr>
         <tr>
           <td><?php echo tep_draw_separator('pixel_trans.gif', '100%', '3'); ?></td>
         </tr>
       </table>
     </td>
   </tr>
<?php
 }
?>
       </table></td>
     </tr>
 </table>
<?php
 if (($products_new_split->number_of_rows > 0) && ((PREV_NEXT_BAR_LOCATION == '2') || (PREV_NEXT_BAR_LOCATION == '3'))) {
?>
   <table border="0" cellspacing="0" cellpadding="0">
     <tr>
       <td>
         <?php echo tep_image(DIR_WS_IMAGES . 'main_line.gif'); ?>
         <table border="0" width="100%" cellspacing="0" cellpadding="8" class="number">
         <tr>
           <td class="smallText"><?php echo $products_new_split->display_count(TEXT_DISPLAY_NUMBER_OF_PRODUCTS_NEW); ?></td>
           <td align="right" class="smallText"><?php echo TEXT_RESULT_PAGE . ' ' . $products_new_split->display_links(MAX_DISPLAY_PAGE_LINKS, tep_get_all_get_params(array('page', 'info', 'x', 'y'))); ?></td>
         </tr>
       </table></td>
     </tr>
<?php
 }
?>
</table>

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...